240208-TIL

2월 8일

 

어제까지 수학 공부를 통해 조금 더 단단해진 나다.

 

오늘부터 팀 프로젝트가 시작되는데 나는 전체적인 UI를 담당하게 되었다.

 

그래서 기존에는 Text를 만들때 Unity가 기본적으로 지우너하는 Text 컴포넌트를 써왔지만

 

새로운 방식인 Unity의 TextMeshPro에 대해서 정리해 보려고 한다. (유니티 측에서 상당히 밀고있다고 한다)

 

TextMeshPro

유니티에서 지원하는 Text를 적는 방법은 두가지가 있다

 

 

기존에 유니티가 제공하는 Text인 요 녀석을 쓰거나

 

 

유니티에서 강력하게 밀고있는 TextMeshPro를 사용하거나

 

기존의 Text는 Legacy에 꽁꽁 숨겨놓으면서까지 TextMeshPro를 강력하게 밀고있는 모습니다

 

자 그렇다면 이 TextMeshPro 기존의 Text 컴포넌트가 있는데 왜 쓰는걸까?

 

사진 출처 : https://hyeokjunjjang.tistory.com/

유니티에서 지원하는 기존의 Text는 시각적 품질이 매우 불량하다 

 

반면에 TextMeshPro는 기존의 Text보다 기능도 많고 글자가 깨지지 않는다(매우 선명함)

 

TextMeshPro는 기존의 Font 파일을 사용하는 대신에 FontAsset을 사용하며

 

Font를 추가하거나, 한글을 추가하려고 할 경우 반드시 새로 Font Asset을 생성해야 한다.

 

자 그렇다면 이제 본격적으로 TextMeshPro를 사용하기 위한 사전 작업에 대해서 알아보도록 하자

 

그냥 UI - TextMeshPro를 선택하면

 

 

TextMeshPro 줄여서 TMP Impoter라고 창이하나 똿 나오게 된다

 

여기서 Import TMP Essentials를 해줘도 괜찮고

 

 

Window - TextMeshPro - import TMP Essential Resources를 누른다음

 

 이곳에서 Import를 눌러줘도 괜찮다

 

Import를 완료하고 나면 우리눈에는 

 

 이런 폴더가 생성된 것을 확인할 수 있다.

 

아까도 말했듯이 TextMeshPro는 기존의 Font가 아닌 Font Asset을 사용한다

 

기본으로 제공되는 Font Asset을 사용해도 괜찮지만? 기본적으로 제공해주는 것은

 

한글을 지원하지 않기 때문에 새로운 FontAsset 파일을 생성해줘야 한다.

 

당연 Font Asset을 만들기 위해선? Font 파일(.ttf)이 필요하다.

https://www.gg.go.kr/contents/contents.do?ciIdx=679&menuId=2457

경기도 서체 | 경기도 상징물 | 경기도 소개 | 경기도청 - 변화의 중심 기회의 경기

 

나는 Font파일로 경기도에서 무료로 배포해주는 경기천년체를 활용해서 Font Asset을 만들어보도록 하겠다

 

TextMeshPro Font Asset 만들기

 

window - Text Meshpro - Font Asset Creator를 클릭하면

 

 

요런 이미지가 나오게 된다. 외국 지렁이가 기어다니는게 매우 불편하지만

 

중요한 것들만 빠르게 어떤 기능을 하는지 알아보도록 하자

 

Atlas Resolution : 폰트 이미지 해상도

Character Set : 문자 설정(영어 문자, 한글 문자 설정)
- ASCII : 아스키 코드만 (= 영어 폰트일 경우)

-Custom Range : 사용할 문자의 범위를 입력한다.

(영어 : 32-126 | 특수문자 : 8200-9900 | 한글자모 : 12593-12643 | 한글 : 44032-55203)

- Custom Characters : 사용할 문자를 직접 입력한다. 

(인터넷 검색창에 상용한글을 입력하고 메모장에 있는 모든 글을 복사+붙여넣기)

 

Render Mode : 그리기 모드

• SMOOTH :안티앨리어싱
• RASTER :안티앨리어싱 X
• SMOOTH_HINTED :안티앨리어싱, 힌팅
• RASTER_HINTED :안티앨리어싱 X, 힌팅
• SDF(Signed Distance Field) :거리에 따라 선명도를 계산하여 출력(매끄러운 윤곽선)

 

 

이런식으로 구성하고 Generate Font Atlas 버튼을 클릭해준다.

 

 

엇! 앗차차 폰트 파일 이름이 한글이라 오류를 내뱉고 있다...

 

 폰트 파일 이름을 영어로 바꿔주고 다시 버튼을 클릭하면 지이이잉 게이지가 차면서

 

Font Asset을 만들어주는데 기기와 성능에 따라서 상당한 시간이 소요된다.

 

대충 밥을 먹고오거나 노래를 듣고 오거나 책을 읽고오거나 적당한 시간을 보내고 나면

 

이런식으로 폰트가 만들어진다

 

만들어진 Font Asset을 넣어주고

 

 잘 깔끔하게 잘 나오는걸 볼수가 있다

 

그 외에도 여러 기능들이 있지만 모두 다루기에는 볼륨이 너무 커지기 때문에

 

https://docs.unity3d.com/Packages/com.unity.textmeshpro@3.0/manual/index.html#support--api-documentation

TextMesh Pro User Guide | TextMeshPro | 3.0.7

 

필요할때마다 꺼내보는 Unity 사전!

 

TextMeshPro의 내용을 확인할 수 있는데 필요한 기능과 모르는 기능이 있을때마다 꺼내먹도록 하자

 

오늘은 TextMeshPro를 사용하는 방법에 대해서 알아보았다. 기존의 Text 컴포넌트보다 상당히 복잡하지만

 

글씨의 선명도와 사용할 수 있는 기능이 압도적으로 많으니 잘 써먹도록 하자.

(어짜피 폰트 에셋 만드는거 말고는 딱히 어려울 것도 없고...)

 

2월 8일 TIL은 여기서 마치도록 하겠다.