옴로하!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

 

저번 시간에 이어서 타이틀 페이지 구현을 끝내러 돌아온 옴.

오늘은 타이틀 페이지에 있는 두 개의 버튼에 대한 각각의 기능을 구현해보자.

 

먼저 첫 번째 버튼은 메인 메뉴 버튼이다.

이 버튼의 경우 클릭했을 때 메인 메뉴 씬으로 넘어가는 기능이 필요하다.

 

 

 

일단 지난 시간에 어지럽게 널려있던 이미지 파일들은 Create > Folder로 폴더를 생성하여 깔끔하게 정리해주었다.

프로젝트가 커지면 커질수록 손쉬운 파일 정리를 위해 폴더를 여러 개 생성하여

파일 타입별로 정리를 해주는 것이 중요하다.

대체적으로 많이 사용하는 타입에는

Sprites (이미지), Scripts (스크립트), Scenes (씬), Fonts (폰트), Music (음악) 등이 있다.

 

프로젝트 탭에서 빈 공간을
우클릭 > Create > Scene을 눌러

새로운 씬을 생성해주고, 우클릭 > Create > C# Script를 눌러 스크립트도 새롭게 하나 생성해주자.

이때 알아보기 쉽게 새로 생성된 씬 이름은 MainMenu, 스크립트의 이름은 ChangeScene으로 변경해주었다.

(항상 나중에 찾기 쉬운 이름으로
변경해주는 거 잊지 말기!!!)

 

 

 

 

 

유니티의 경우 새로운 씬을 추가할 때마다 File > Build Settings... 에 들어가서 씬 추가를 해주어야 한다.

씬 추가는 Build Settings 상단의 Scenes In Build 칸에 새로 생성한 씬을 드래그 앤 드롭하면 끝이다.

아주 간단-

 

그런 다음 생성한 ChangeScene 스크립트를
더블클릭해서 열어주도록 하자.

메인 메뉴 버튼 클릭 시 특정한 씬으로
넘어가는 함수를 만들건대,

우리는 우리만의 함수를 만들 거기 때문에 Start()와 Update() 함수는 필요가 없으므로 지워주도록 하자.

 

 

 

 

유니티에서 씬 변경을 사용할 경우
유니티 자체 라이브러리인
UnityEngine.SceneManagement가 필요하다.

스크립트 상단 라이브러리 섹션에
using UnityEngine.SceneManagement; 를 추가해주자.

 

다음으로 필요한 것은
씬 이름을 담을 string(문자) type의 변수이다.

클래스 안에 sceneName이라는 변수와 ChangeSceneTo()라는 함수를 만들어준다.

씬 변경에는 SceneManager.LoadScene(string, mode) 함수를 사용한다.

완성된 스크립트를 저장해주고 다시 유니티로 돌아가 보자.

 

 

 

Hierarchy에서 메인 메뉴 버튼을 선택해주고

Inspector에 만든 ChangeScene 스크립트를
드래그 앤 드롭으로 넣어준 뒤,

SceneName 변수에 변경할 씬 이름을 넣어준다.

이 경우는 아까 만든 MainMenu 씬 이름을 넣어주면 된다.

 

다음 버튼 컴포넌트 아래에 On Click() 함수 아래에 있는 +버튼을 클릭하고

Runtime Only 아래에 위치한 칸에 아까 스크립트를 추가했던 오브젝트인 메인 메뉴 버튼을 넣어준다.

오른쪽에 생성된 리스트에서 ChangeScence > ChangeSceneTo를 선택!

 

이렇게 하면 씬 변경 기능 구현 완료!!!!!!!!!!!!

플레이 버튼을 눌러 테스트를 해보면 메인 메뉴 버튼 클릭 시 선택한 씬으로 넘어가지는 걸 볼 수 있다.

벌써 반은 완성!!!!!!!!!

 

그럼 이제 타이틀 페이지 마지막, 개인정보 보호정책 페이지 열기 기능을 구현해보자.

프로젝트 탭에서 빈 공간 우클릭 > Create > C# Script를 클릭해 새로운 스크립트 생성.

이번에는 알기 쉽게 OpenURL이라고 이름을 지어주었다.

더블클릭! 역시나 이번에도 필요 없는 Start()와 Update()는 지워주도록 하자.

 

 

 

이번에 필요한 함수는 Application.OpenURL() 함수이다.

이 함수에 괄호 안에 "" (큰따옴표)를 열고
원하는 사이트의 주소를 입력하면 된다.

직접 사이트 주소를 입력하는 방법도 있고, 만약 여러 개의 각기 다른 사이트를 열어야 한다면

아까와 같이 string type 변수를 하나 만들어서
값을 따로 받아 넣을 수도 있다.

이 경우는 한 번밖에 필요가 없기 때문에
그냥 직접 입력으로 구현!

 

 

 

 

아까와 마찬가지로 이번엔
개인정보보호정책 버튼을 선택한 뒤

Inspector에 OpenURL 스크립트를 넣어주고

버튼 컴포넌트 On Click() 우측 하단에 +버튼을 클릭하여

이번엔 스크립트가 들어있는
개인정보보호정책 버튼을 넣고

OpenURL > OpenPrivacyPolicyPage 함수를 선택!

 

저장 후 플레이 버튼을 눌러 확인해보면!!!!!
명시된 사이트가 열린다!

 

 

 

 

이렇게 버튼 기능까지 모두 갖춘 완벽한 타이틀 페이지 완성!!!!!!!!!!!!!!!!!!

와아아아아아아아아

 

 

다음 시간에는 메인 메뉴페이지 만들기에 대해
알아보도록 하자.

슬라이더로 스와이프 모션을 이용해 여러 개의 메뉴를 왔다 갔다 하는 기능을 구현할 예정이다.

 

 

다음 포스팅까지 그럼 오늘도 해피 코딩!!!!!!!!!!!! :)

 

 

 

 

 

 

옴로하!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

 

오늘은 '흥미로운 사실 - 동물 편' 개발일지의 첫 시간으로

타이틀 페이지 구현에 대해 포스팅해볼까 한다.

 

준비물은 유니티로 생성한 새로운 프로젝트!

우리는 안드로이드 어플을 목표하고 있으므로 

 

먼저 File > Building Settings... 로 들어가 플랫폼 아래 안드로이드를 클릭해주고

Switch Platform 버튼을 눌러 설정을 저장해 주자.

처음 새로운 프로젝트를 생성하면 PC 플랫폼이 디폴트로 설정되어있다.

나중에 변경하게 될 경우 만들어놓은 화면 비율이나 이미지 위치가 엉망이 되는 관계로

항상 프로젝트 생성 후 바로 플랫폼을 변경하는 것을 습관화하도록하자.

 

 

 

 

다음으로 필요한 것은 가장 중요한 이미지 파일!

만들어놓은 이미지를 프로젝트 콘솔에 드래그엔드랍으로 끌어와주자.

해당 어플의 경우 타이틀 페이지에 필요한 이미지는

배경, 타이틀 이미지 (동물 로고), 타이틀 텍스트, 메인 메뉴 버튼, 개인정보 보호정책 버튼이다.

 

 

배경 이미지를 제외한 나머지는 한 장에 여러 개의 스프라이트가 함께 있는 게 보인다.

이럴 경우엔 해당 이미지 클릭 > Inspector > Sprite Mode > Multiple > Sprite Editor > Apply

를 통해 한 이미지에 스프라이트 개수가 여러 개라는 걸 알려주고

스프라이트 에디터로 가서 이미지를 개별로 잘라주고 어플라이를 눌러주면 된다.

 

스프라이트 준비가 완료되었다면 본격적으로 UI 디자인을 적용할 시간!

먼저 Hierarchy 탭에서 우클릭 > UI > Image를 눌러 빈 이미지를 생성해준다.

 

이때 Hierarchy에 캔버스가 없었다면 자동으로 새로운 캔버스가 형성되는 것을 볼 수 있는데,

여기서 아주 중요한 건 캔버스 안에서 작업을 시작하기 전

해상도 최적화 작업을 해줘야 한다는 것이다.

 

 

캔버스를 클릭하여 Inspector > Canvas Scaler > UI Scale Mode를

Scale With Screen Size로 변경해준 뒤 Reference Resolution을

현재 작업하는 모바일 뷰 크기로 맞춰주도록 하자.

 

이 작업을 완료했다면 본격적으로 이미지를 캔버스에 배치할 차례이다.

 

 

 

아까 생성했던 빈 이미지를 클릭한뒤 Inspector > Source Image에

배경이 될 이미지를 드래그 앤 드롭으로 끌어다 놓자.

그런 다음 Preserve Aspect를 눌러주면 원본 이미지의 비율을 깨뜨리지 않고

그대로 가져올 수 있게 된다.

 

이미지를 적용했다면 Scene 뷰에서 알맞은 사이즈를 맞추고

이미지 배치도 적절하게 해 주도록 하자.

 

그다음 위와 동일한 방법으로 캔버스에 빈 이미지를 생성해서

타이틀 이미지와 타이틀 텍스트도 적용, 배치해준다.

 

여기까지 끝나면

 

 

이렇게 이미지 3개로 타일 이미지 배치는 끝이 났다.

이번엔 타이틀 텍스트 하단에 메인 메뉴와 개인정보보호정책 버튼을 넣어줄 차례!

 

이번엔 Hierarchy 창에서 우클릭 > UI > Button을 눌러 버튼을 생성해준다.

 

필자가 준비한 버튼 이미지의 경우 이미 버튼 안에 용도별 텍스트가 들어가 있기 때문에

버튼 아래에 있는 Text는 지워준다.

하지만 보통 버튼 백그라운드 UI 이미지만 입혀서 텍스트만 바꿔 사용하기도 한다.

이건 개인 취향을 적용해 적절히 사용하면 된다.

 

그다음 똑같이 생성된 Button을 클릭한뒤 Inspector > Source Image에

원하는 버튼 이미지를 끌어다 놓은 뒤 Preserve Aspect로 원본 이미지 비율을 고정해주고

Scene 뷰에서 크기 조절과 버튼 배치를 해준다.

같은 방법으로 개인정보 보호정책 버튼도 만들어주도록 하자.

 

 

완성된 타이틀 페이지 UI !!!!!!!!!!!!!!!!!!!!!

너무 귀엽다.

 

여기서 잠깐! UI 배치에 중요한 포인트.

휴대폰은 기종에 따라 스크린 해상도 / 화면 비율이 제각각이기 때문에

해상도에 변화가 있을 경우 배치해놓은 이미지들이 중구난방으로 난리가 나게 된다.

이를 방지하기 위해서 anchor라는 것을 사용해야 되는데,

여기서 anchor는 바다 위에서 배를 고정하는 데에 쓰이는 닻을 의미한다.

말 그대로 닻을 내려 물체를 고정시킬 수 있는 기능이다.

 

이 anchor의 사용방법은 다음과 같다.

일단 고정하고 싶은 방향에 따라 오브젝트를 한데 모아줘야 한다.

이를 위해 Hierarchy에서 Canvas > 우클릭 > Create Empty를 눌러 빈 오브젝트를 만들고

그 속에 함께 움직여야 할 물체들을 싸그리 넣어준다.

(이때는 꼭 Canvas에 우클릭 후 빈 오브젝트를 생성해주어야 anchor사용이 가능해진다)

 

 

필자의 경우 모든 이미지를 화면 중앙에 고정시키기 위해

빈 게임 오브젝트를 하나만 생성하여 타이틀 이미지, 타이틀 텍스트,

메인 메뉴 버튼, 개인정보보호정책 버튼을 모두 넣어주었다.

 

 

이렇게 고정할 물체들을 빈 오브젝트에 넣고 난 뒤,

오브젝트를 클릭 > Inspector > Rect Transform 좌측 상단 이미지를 눌러

Anchor Presets 설정을 열어준다.

이때 경우에 따라 화면 상단 중앙을 고정 기준점으로 잡고 싶다면

가운데 9개의 옵션 중 상단 센터 옵션을,

하단으로 잡고 싶다면 하단 센터 옵션을 선택해주면 된다.

 

anchor 설정이 완료되었다면 Game 뷰에서 화면 비율을 변경해가면서

모든 화면 크기에서 이미지가 잘리는 일 없이 제대로 보이는지 확인해주자.

 

이렇게 하면 타이틀 화면 UI 완성!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

짝짝짝짝짝

 

이어지는 포스팅에서는 버튼 기능 구현을 다룰 예정!

메인 메뉴 버튼의 경우 클릭하면 메인 메뉴로 넘어가는 기능을 만들고,

개인정보 보호정책 버튼의 경우 클릭 시 정책 웹페이지를 여는 기능을 구현한다.

이를 위해서는 Scene 생성과 웹페이지를 열어주는 코드가 필요하다.

다음 시간에 자세히 알아보도록 하자!

 

 

그럼 다음 포스팅까지!!!!!!!!!!!!!!!!!!!!!!!!!

 

피쓰-!

 

 

옴로하!!!!!!!!!!!!!!!!!!!!!!!!!!

 

오늘은 본인이 처음 유니티를 시작했을 때 아주아주 도움을 많이 받았던 유튜브 채널들을 소개해보려 한다.

보통 프로그래밍 지식이 아예 없거나 프로그래밍 지식이 있더라도

유니티를 한 번도 사용해 보지 않은 사람들의 경우

어디서부터 시작을 해야 하나 막막한 경우가 많다.

본인도 물론 그랬었다. 컴퓨터학과를 졸업하긴 했지만

지식은 얕았고 유니티는 들어본 적도 없었고 C# 언어도 사용해 본 적이 없었다.

그러다가 우연히 유니티를 중심적으로 가르쳐주는 유튜브 채널을 몇몇 알게 되었고

직접 체험해본 결과 엄청난 도움이 되었다.

게임은 만들고 싶은데 지식이 부족하거나 막막한 경우 다음 채널들을 주목하자.

 

1. Brakeys

 

유니티 강좌계의 원탑이라고 할 수 있는 Brakeys.

유니티 코딩/프로그래밍을 주제로 유튜브에서 100만 명 이상의 구독자를 보유하고 있다.

Brakeys의 최대 장점은 지루하지 않은 강좌이다.

초보자들도 쉽게 따라 할 수 있게끔 모든 과정을 하나씩 차근차근 설명하며 진행한다.

 

게임 제작에 필요한 요소들에 대한 개별적인 강좌가 상당 부분 올라와있다.

예를 들면, 게임 메뉴 만들기, 화면 정지 기능, 설정창 만들기, 캐릭터 조종하기,

애니메이션 만들기, 슈팅 기능 구현하기, 에너지바 만들기 등

없는 거 빼곤 다 있다고 보면 된다. (응?)

또한 개별 강좌 이외에도 다양한 종류의 게임을 처음부터 끝까지

함께 만들어 볼 수 있는 강좌 세트도 있다.

이 강좌들을 따라만 해도 완벽한 기능을 하는 게임을 만들 수 있다는 얘기.

영상의 퀄리티와 높은 강좌 수준을 원한다면 Brakeys를 강력 추천한다.

 

----------------

 

2. Blackthornprod

 

두 번째로 소개할 채널은 Blackthornprod이다.

Blackthornprod는 위에 언급된 Brakeys 채널에서 큰 영감을 받아 만들어진 채널이다.

(Brakeys가 원탑인 이유 크으)

재밌는 점은 채널의 주인인 노아(Noah)가 아주 어린 나이에 게임 제작/프로그래밍을 시작했다는 것이다.

노아는 여러 영상에서 Brakeys를 언급하며 자신에게 영감을 준 채널이라 말한다.

개인적으로 이 채널을 선호하는 이유는 엄청나게 쉬운 난이도 때문이다.

Brakeys의 경우는 간단하지만 심도 있는 내용의 강좌를 다루는데,

Blackthronprod의 경우는 극 초보자들도 쉽게 따라 할 수 있는 심플한 강좌를 위주로 한다.

대부분의 영상이 짧게는 5분, 길게는 10~15분 미만이며,

특유의 만화 같은 그림체가 특징이다.

Brakeys와 동일하게 노아도 게임에 필요한 요소들은 각각 짧은 영상으로 만들어 올린다.

노아는 itch.io라는 대형 인디게임 사이트에 꾸준히 1인 개발 게임들을 업로드하고 있다.

쉽고 귀여운, 단순한 게임을 목적으로 한다면 Blackthornprod 채널을 추천한다.

 

----------------

 

3. Alexander Zotov

 

Brakeys가 중고등, Blackthornprod가 초등이라면 Alexander Zotov는 유아교육 수준이라고 해도 과언이 아니다.

이 채널의 경우, 완벽한 게임을 처음부터 끝까지 만드는 것보다

정말로 필요한 게임의 기능만 매우 짧은 시간 안에 짚어주는 걸 목표로 한다.

영상은 길어야 3분, 짧으면 1분 미만인 경우도 있다.

영상이 짧기 때문에 스크립트를 같이 써 내려가고 설명은 생략하는 경우가 많다.

위에 언급된 두 채널만큼 상세한 설명은 없지만

기능 구현은 정말 끝내주게 빠르게 가능하다.

사람마다 배우는 스타일은 다르겠지만, 일단 복사해서 붙여 넣고

돌아가는 걸 보며 하나씩 이해하는 것도 하나의 방법이다.

쓰다 보면 외워지고 외우다 보면 이해가 되는 마법.

심플하고 빠른 강좌를 찾는다면 Alexander Zotov 채널을 추천한다.

 

----------------

 

오늘은 본인 피셜 가장 도움이 많이 되었던 유니티 유튜버들을 알아보았다.

다음엔 추천 유튜버 & 유니티 리소스 2탄을 들고 올 예정이다.

많은 길 잃은 유니티 어린양들에게 이 글이 도움이 되었길 바라며

 

아디오스!

옴로하!!!!!!!!!!!!!!

 

내가 할 줄 몰라서 나 같은 사람들 돕기 위해 쓰는 포스팅 따단.

오늘은 티스토리 블로그 임시저장 글 불러오는 방법을 소개한다.

임시저장은 글을 쓰다가 갑자기 졸리다거나 놀러 나가야 된다거나 엄마 심부름을 가야 될 때,

급똥이 마려울 때, 맨날 져서 재미없지만 야구경기가 시작하려고 할 때

쓰던 글을 나중에 아무때나 이어 쓸 수 있게 해주는 효자스럽고 편리한 기능이다.

 

티스토리에서 글쓰기를 눌러 글쓰기 창으로 들어오면, 오른쪽 하단에 임시저장버튼과 완료 버튼을 볼 수 있다.

임시저장은 눌렀는데 도대체 어디서 불러와야 하는 건지 몰라 헤매고 있다면 방법은 간단하다.

 

임시저장버튼을 자세히 보면 왼쪽에는 글씨가, 오른쪽에는 임시 저장된 글 개수가 빨간색으로 쓰여있다.

임시저장 버튼을 클릭하면 오른쪽에 위치한 숫자가 올라가게 된다.

이때 이 숫자를 클릭하면

 

 

짠!!!

하고 임시 저장된 글 목록 창이 뜬다.

이제 원하는 글로 들어가 쓰던 글을 마저 쓰면 된다.

심-플

 

+ 혹시나 공들여서 작성한 포스팅이 임시저장이 잘못되어 날아가진 않을까 걱정된다면

걱정하지 않아도 된다. 본인도 처음엔 1500자를 꾸역꾸역 넘겨쓴 포스팅이 혹여 날아가진 않을까

조마조마했었지만 저장 잘되고 잘 불러와지더라.

내 경우는 회사 컴퓨터로는 사진을 업로드할 수 없어서 집에 가서 하려고 글만 써놓고 저장하는 케이스.

(사장님이 이 글을 싫어합니다)

시간 날 때마다 생각날 때마다 아이디어가 떠오를 때마다 글을 써놓고 임시저장을 해놓도록 하자.

엄지 척

 

자 이렇게 임시저장 불러오기 방법을 알아보았다.

그럼 다음 꿀팁까지

 

아디오스!

 

 

 

옴로하!!!!!!!!!!!!!!!

 

으아니 왜 한글이 안 써져?!

예전 포스팅에 한번 다뤘었던 유니티 한글 적용 방법.

오늘은 예전 강좌에 이어 전보다 더욱더 최적화된 업그레이드 버전을 들고 왔다.

한글 폰트 아틀라스를 생성했는데도 불구하고 몇몇 철자가 아직도 네모 박스로 나오거나

제대로 쓰이지 않는다면 이 방법을 사용해 보길 바란다.

한글 폰트 적용에 필요한 건 Textmesh Pro

 

유니티 구버전에서는 에셋스토어에서 직접 Textmesh Pro를 다운로드하여 임포트 해서 사용했어야 했지만

업데이트 이후 유니티가 자체에서 Textmesh Pro를 지원하면서 에셋스토어를 들락날락거려야 하는 번거로움이 사라졌다.

간편하게 한글 폰트 적용하는 방법을 알아보도록 하자.

 

 

먼저 원하는 한글 폰트 파일 프로젝트 폴더에 넣어준다.

(사용 폰트는 상업용 무료 폰트인 고도체)

 

다음 Window > TextmeshPro > Font Asset Creator 클릭.

 

 

이런 창이 뜨면 Import TMP Essentials를 눌러주면 된다. 

 

 

폰트 에셋 크리에이터의 설정값은 아래와 같이 맞춰준다.

 

 

Source Font File - 폰트 선택
Sampling Point Size - Custom Size, 36
Padding - 4
Packing Method - Fast
Atlas Resolution - 4096, 4096
Character Set - Custom Range
Character Sequence (Decimal) - 44032-55203
Render Mode - SMOOTH_HINTED

 

설정이 끝나면 Generate Font Atlas 버튼을 클릭한 뒤 생성이 완료되면 Save 버튼을 눌러 폰트 아틀라스를 저장해준다.

 

 

다음 UI > Text - TextMeshPro를 클릭해서 텍스트를 생성.

 

 

Text 필드에 원하는 한글 문장을 써준 뒤

Font Asset > 생성한 폰트 아틀라스 선택

한글 폰트 적용 완료!

 

고민 해결!









스토어에 어플을 등록할 때 보이는 어플 아이콘 설정하는 방법을 알아보자.

처음 유니티로 개발을 시작했을때 아이콘 설정하는걸 까먹고 그냥 올렸었는데

아무런 아이콘도 설정하지 않으면 유니티는 유니티 기본 아이콘을 자동으로 설정한다.

내 생각이지만 마켓에서 어플을 고를 때 저 아이콘이 반 이상은 차지하는 것 같다.


어플이 아무리 잘 만들어졌다해도 아이콘이 부실하면 뭔가 별로일것 같은 느낌이랄까














그래서 이번 포스팅은 '아이콘 설정 하우투'를 준비해봤다











먼저 포토샵으로 아이콘을 제작할텐데, 여기서 중요한 건 구글 플레이 스토어에 어플을 등록할때

함께 올려야하는 아이콘 이미지의 사이즈는 512px x 512px에 32bit PNG 파일이다


만약 이미지 파일 사이즈가 조건을 충족하지 않으면 에러가 나며 다음으로 진행할 수 없다

고로 두번 일하지 않으려면 처음부터 설정을 제대로 하도록 하자













이렇게 편의에 맞춰 깔끔한 아이콘을 만들어준다


(꼭 정사각형이 아니여도 상관없다 동그란 아이콘 속이 빈 아이콘 등등 다양하게 제작하면 된다)













아이콘이 완성 되었으면 적용하는 방법을 알아보도록 하자


유니티에서 File -> Build Settings 클릭











클릭하면 위와 같은 창이 나온다


왼쪽 아래에 있는 Player Settings 클릭











그럼 오른쪽 inspector에 위와 같은 창이 뜨는 것을 볼 수 있다


여기서 우리가 집중해야할 것은 맨 윗 부분이다











Company Name 칸에 회사 이름을 적고

Product Name 칸에 어플 이름을 적는다












만들어둔 아이콘을 프로젝트에 불러온다












Default Icon 칸에 Select 버튼을 눌러 만들었던 아이콘 이미지를 선택해주자














이렇게 아이콘란이 각기 다른 사이즈에 맞게 자동으로 설정되는 것을 볼 수 있다












프로젝트 빌드 시 설정한 아이콘이 뜨는 것이 보인다



초간단 아이콘 설정 방법이었다







그럼 이만 해피코딩 :)











유니티는 외국어를 지원하지 않는다.

그렇기 때문에 영어가 아닌 외국어를 입력하면 

아래와 같이 네모 박스 모양만 줄줄이 나오는 것을 볼 수 있다.





한글 또는 외국어를 입력하는 방법은 앞서 소개했던 간편 텍스트 툴 TextMeshPro를 사용하는 것이다.




1. 유니티 에셋 스토어에서 TextMesh 검색




2. TextMesh Pro를 설치, 그리고 Import




3. 전부 Import




4. 원하는 한글 / 외국어 폰트 파일 (.ttf, otf) 프로젝트로 불러오기




5. Window -> TextMeshPro -> Font Asset Creator 클릭




그럼 이런 에디터가 뜬다.





6. Font Source에 준비했던 한글 폰트 또는 외국어 폰트를 드래그 & 드랍 또는 옆에 동그라미 클릭 후 선택





7. Atlas Resolution을 1024 x 1024로 설정





8. Character Set을 Custom Characters로 변경




9. 밑에 나타나는 Custom Character List칸에 원하는 한글 / 외국어 문장을 쓴다.


(길이 상관 X)





10. Generate Font Atlas 버튼 클릭






11. 완성된 작업의 위와 같다. Save TextMeshPro Font Asset 클릭




12. 원하는 폴더에 저장




저장하면 위와같은 유니티 에셋 파일이 만들어지는 것을 볼 수 있다.




자 이제 만들어진 커스텀 글꼴 에셋을 사용하여 한글 폰트를 적용해보자.


UI -> TextMeshPro - Text 클릭




Inspector 아래 Font Settings에서 Font Asset을 설정해준다.

앞서 만든 커스텀폰트 에셋을 드래그 & 드랍 또는 옆에 작은 동그라미 클릭



동그라미를 클릭하면 앞서 만든 커스텀 글꼴 에셋이 보인다. 클릭




커스텀 에셋이 적용 된 모습

한글 폰트 적용 완료 :)







위 방법 외에도 외국어 폰트를 적용 하는 방법은 다양하다.

예를 들어 사용할 문장 외에 언어 전체를 지원하고 싶다면 Font Asset Creator에서 Character Set설정을 

Custom Range로 선택하여 범위를 선택하면 된다.


글자 수가 많을 수록 시간도 오래걸리고 용량도 커지기 때문에 꼭 필요한 문장만 지원하도록 설정해봤다.








그럼 이만 해피코딩 :)













유니티에서 Text 컴포넌트를 사용할때 글자 퀄리티가 떨어지는 현상이 나타나는데, 

이 문제는 유니티 에셋스토어 무료 에셋 TextMesh Pro로 간단히 해결이 가능하다.







1. 에셋스토어로 들어가 Textmesh를 검색한다.









2. 처음 나오는 TextMesh Pro를 다운로드 받은 뒤 Import 버튼 클릭










3. 모든 파일을 Import 해준다.










4. 임포트가 끝나면 UI에 새롭게 TextMeshPro - Text가 추가된다.

이 TextMeshPro -Text를 Text 대신 사용한다.




Text와 TextMeshPro - Text의 차이를 살펴보자











위에가 보통 Text를 사용했을때, 아래가 TextMeshPro - Text를 사용했을때이다.

차이가 잘 느껴지지 않는다면 클로즈업을 해보자.











왼쪽이 보통 Text, 오른쪽이 TextMeshPro - Text이다.

퀄리티가 확연히 달라진게 보인다.


이제부터는 깨지지 않는 깔끔한 글자로 개발해보자 :)





그럼 이만 해피코딩 :)



+ Recent posts