유니티 멀티플레이 구현(Photon) - 채팅시스템구현

Intro

포톤을 이용하여 간단한 채팅시스템을 구현해보았다.

GUI

채팅창만 존재하는 씬을 만들었다.

• 채팅을 입력할 수 있는 InputField

• 입력한 채팅을 전송할 버튼

• 전송된 채팅이 보여질 ScrollView

• ScrollRect로 새로운 메세지는 채팅창 맨 아래에 표시

• Queue를 이용해 오래된 메시지는 삭제

동작 흐름

채팅시스템의 전체 동작흐름은 아래와같이 설계했다.

1. 플레이어가 서버에 입장
   • 첫 플레이어는 입장후 챗룸을 생성
   • 그 후의 플레이어는 챗룸에 입장
2. 플레이어는 InputField에 채팅을 입력 후 전송
   • 전송 버튼을 누르면 SendChatMessage() 호출
3. RPC 호출
   • ReceiveMessage()가 모든 클라이언트에서 실행
4. AppendMessage() 호출
   • 채팅창에 메시지를 추가
5. 채팅 로그 갱신
   • 새로운 메세지가 채팅창에 보임

---

구현

채팅 시스템을 관리할 ChatManager 오브젝트를 만든다.

그리고 아래와 같이 작성한 스크립트를 붙여준다.

// PhotonChatManager.cs
public class PhotonChatManager : MonoBehaviourPunCallbacks
{
    [SerializeField] TMP_InputField inputField;
    [SerializeField] Button sendButton;
    [SerializeField] TMP_Text chatContent;
    [SerializeField] ScrollRect scrollRect;

    private Queue<string> messageQueue = new();         // 메세지 로그를 담을 큐
    private int maxMessages = 13;                       // 채팅창에 최대 13개의 채팅이 보이도록

    void Start()
    {
        PhotonNetwork.ConnectUsingSettings();
        PhotonNetwork.NickName = "Player" + Random.Range(0, 1000);
        sendButton.onClick.AddListener(SendChatMessage);
    }

    public override void OnConnectedToMaster()
    {
        RoomOptions opt = new RoomOptions();
        opt.MaxPlayers = 2;     // 최대 2명의 플레이어

        PhotonNetwork.JoinOrCreateRoom("ChatRoom", opt, TypedLobby.Default);
    }

    public override void OnJoinedRoom()
    {
        // 플레이어 입장 메시지 출력
        AppendMessage($"<color=green>{PhotonNetwork.NickName} Joined the chat room.</color>");
    }

    void SendChatMessage()
    {
        if(!string.IsNullOrEmpty(inputField.text))
        {
            // "Player1 : ~~~" 식으로 표시
            string message = PhotonNetwork.NickName + ": " + inputField.text;
            photonView.RPC("ReceiveMessage", RpcTarget.All, message);
            inputField.text = "";
        }
    }

    [PunRPC]
    void ReceiveMessage(string message)
    {
        AppendMessage(message);
    }

    void AppendMessage(string message)
    {
        messageQueue.Enqueue(message);
        if(messageQueue.Count > maxMessages)
        {
            messageQueue.Dequeue();
        }

        chatContent.text = string.Join("\n", messageQueue);

        ScrollToBottom();
    }

    // 새로운 채팅은 맨아래로
    void ScrollToBottom()
    {
        // UI를 업데이트
        Canvas.ForceUpdateCanvases();
        // 스크롤을 맨 아래로 내림
        scrollRect.verticalNormalizedPosition = 0f;
    }
}

---

인스펙터에서 오브젝트들을 연결시켜주고,

ChatManager 오브젝트에 “PhotonView” 컴포넌트를 붙여준다.

동작 확인을 편하게 하기위해 창모드가 가능하도록 빌드한다.

[Build Settings] - [Player Settings] - [Player] - [Resolution and Presentation] - [Resizable Window 체크]

빌드 후 “ALT + 엔터” 입력으로 창모드를 할 수 있다.