[07] 채팅창 UI 만들기, TMP로 한글 쓰기

플레이어가 입력하면 서버의 모든 이용자가 메시지를 볼 수 있는 채팅창을 만들어보자. 기본적인 구성은 위의 사진처럼 Chat이 올라오고, 채팅창의 아래부분을 누르면 채팅을 입력할 수 있는 InputField가 등장하는 구조다.

 

이제 채팅을 입력하고, 위에 올리는 작업을 시행해야 하나... 그 전에 해결해야 할 문제가 있다. 바로 한글이 쳐지지 않는다는 것.

이 상태로 무언가를 만들어도, 한글로 된 내용은 전부 빈 네모로 바뀔 뿐. 그건 폰트가 한글을 지원해주지 않기 때문이다. 따라서, 우리는 유니티에 TMP에서 쓸 수 있는 한글 폰트를 설정할 필요가 있다.

우선 한글을 지원하는 폰트를 다운받아, TextMeshPro의 Fonts 폴더에 집어넣어주자. 작성자는 넥슨에서 지원하는 메이플스토리 폰트를 사용했다.

들어가면 받은 폰트들을 골라서 TMP에서 쓸 수 있도록 변경할 수 있다. Atlas Resolution은 글꼴의 해상도이다. 높을수록 품질은 좋지만, 렉이 걸린다. Render Mode도 마찬가지로 성능과 품질, 확대 축소에 대한 반응이 달라진다.

정상적으로 진행하면(Generate -> Save), SDF 파일이 생긴다. 이 파일이 TMP에서 사용할 수 있는 폰트이다.

그 다음으로는 SDF 파일에서 Static -> Dynamic, Sampling Point Size를 적절한 값으로(여기서는 60) 변경해주면 된다. 값을 줄일수록 글꼴의 디테일이 선명해진다. 690 -> 60으로 변경하였다.

그 결과, TMP에서 한글을 입력할 수 있게 되었다. 스크립트에서 한글을 입력해도 잘 사용할 수 있다. 이렇게 이름을 입력할 수 있는 칸을 만들었으니, 다음으로는 Player 개체를 만들어보자. 굳이 오브젝트가 화면에 있지 않아도, 유저 개개인의 정보를 저장할 곳이 필요하다.

각 유저마다 존재할, Player라는 빈 오브젝트를 생성해주자. Player 오브젝트의 Player 스크립트에 유저가 설정한 Name이 입력된다. 이 Player오브젝트는 로딩에서 생성되어 게임 종료 전까지 계속 사용한다.