unity UI Chat
Post

unity UI Chat

UI Chat 기능

Scroll Rect와 Input Field를 만들고,
ChatManager script를 만든다

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
using Photon.Pun;

public class ChatManager : MonoBehaviour
{
    // inputField
    public InputField chatInput;

    // ChatItem Prefab
    public GameObject chatItemFactory;
    // ScrollView 에 있는 Content의 RectTransform
    public RectTransform rtContent;


    private void Start()
    {
        // 엔터키를 누르면 InputField에 있는 텍스트 내용 알려주는 함수 등록 
        chatInput.onSubmit.AddListener(OnSubmit);

        // inputField의 내용이 변경될 때마다 호출해주는 함수 등록
        chatInput.onValueChanged.AddListener(onValueChanged);

        //InputField 의 Focusing이 사라졌을 때 호출해주는 함수 등록 
        chatInput.onEndEdit.AddListener(onEndEdit);
    }


    void OnSubmit(string s)
    {
        //print("OnSubmit : " + s);
        // Chatitem을 만든다.
        GameObject ci = Instantiate(chatItemFactory,rtContent);
        // 만들어진 item의 부모를 Content로 한다.
        ci.transform.SetParent(rtContent);
        // 만들어진 item에서 chatItem 컴포넌트를 가져온다.
        ChatItem item = ci.GetComponent<ChatItem>();

        // 닉네임을 붙여서 채팅내용을 만들자
        //"<color=#fff00> 원하는 내용 </color>"
        string chat = "<color=#" + ColorUtility.ToHtmlStringRGB(Color.blue) + ">" +
            PhotonNetwork.NickName + "</color>" + " : " + s;    // 포톤 통신을 위한 닉네임.   

        //가져온 컴포넌트에서 SetText 함수 실행
        item.SetText(chat);

        //chatInput 값을 초기화
        chatInput.text = "";

        chatInput.ActivateInputField();
    }
    void onValueChanged(string s)
    {
        //print("onValueChanged : " + s);
    }
    void onEndEdit(string s)
    {
        //print("onEndEdit : " + s);
    }

}


image

ChatItem은 Text컴포넌트가 붙어있는 오브젝트를 Prefab으로 만들어 둔다.

image


ChatItem Script

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
public class ChatItem : MonoBehaviour
{
     Text chatText;
     RectTransform rt;
    void Awake()
    {
        chatText = GetComponent<Text>();
        rt = GetComponent<RectTransform>();
    }

    public void SetText(string s)
    {
        // text 갱신
        chatText.text = s;
        // text에 맞춰서 크기를 조절
        rt.sizeDelta = new Vector2(rt.sizeDelta.x,chatText.preferredHeight);
        Debug.Log(rt.sizeDelta);
    }
}


자동으로 스크롤 바닥에 맞추게 설정.
rtScrollView는 Scroll view 가져오면 된다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
    IEnumerator AutoScrollBottom()
    {
        // 한 프레임 지나고 나서 실행
        yield return 0;

        // scrol view의 H보다 Content의 H 값이 크다면 (스크롤이 가능한 상태라면)
        if (rtContent.sizeDelta.y > rtScrollView.sizeDelta.y)
        {
            // 이전의 바닥에 닿아있었다면 , anchroedPosition은 recttransform에서 사용하는 값
            if (prevContentH - rtScrollView.sizeDelta.y <= rtContent.anchoredPosition.y)
            {
                // content의 y값을 재설정한다.
                rtContent.anchoredPosition =
                    new Vector2(0,rtContent.sizeDelta.y - rtScrollView.sizeDelta.y);
            }
        }
    }

OnSubmit() 함수 마지막줄에 추가한다.