4. NGUI 다국어 지원하기 실습 (Localization) – 3
NGUI 다국어 지원하기 실습 – 3
NGUI Localization
4장에서 배운 내용을 이용해서 아래 그림과 같은 예제를 만들어 보겠습니다.
이번 예제를 진행하시면 아래 그림과 같은 예제를 만들 수 있습니다.
예제는 네이*의 모바일 가입화면을 참고해서 만들었습니다.
다국어를 설정하는 과정이 비슷하기 때문에 예제를 진행한 후에 필요한 곳에 응용하시면 좋을 것 같습니다.
실행 과정을 살펴보면, English 버튼과 한국어 버튼이 탭버튼으로 구성되어 있고 버튼을 클릭하면 선택한 언어로 변경됩니다.
예제 진행을 위해서 아래 링크에 있는 파일을 다운로드받습니다.
https://goo.gl/GPRL3Y
https://goo.gl/75xPIF
다운로드한 파일은 이미지파일 하나와 KopubDotum 폰트파일입니다. 다운로드가 완료되면, 이미지 파일은 유니티 프로젝트의 Assets/Textures 폴더에 임포트하고, 폰트파일은 Assets/Font/FontFile에 임포트합니다.
본 예제를 진행하기에 앞서 NGUI 다국어 지원에 대한 내용을 익히지 않은 분들은 4.NGUI 다국어 지원하기 (Localization) – 1 과 4.NGUI 다국어 지원하기 (Localization) – 2 의 내용을 먼저 공부하시고 예제를 진행하시기 바랍니다. |
Localization.txt 파일 만들기
NGUI를 이용한 다국어를 지원할 때 Localization.txt 파일이 필요합니다.
NGUI는 이 텍스트 파일에 정의되어 있는 정보를 토대로 다국어를 지원합니다.
메모장을 이용해서 텍스트파일을 만들고 아래 내용을 입력합니다.
KEY,English,Korean Localization,Localization,다국어지원 ID,ID,아이디 Password,PW,비밀번호 PWConfirm,Password Confirm,비밀번호 재확인 Name,Name,이름 Gender,Gender,성별 Male,Male,남자 Female,Female,여자 Birth,Date of Birth,생년월일 Email,E-mail,이메일 SignIn,Sign In,가입하기
내용 입력이 끝났으면, Localization.txt 로 파일을 저장합니다. 저장할 때 파일의 대소문자를 잘 구분해서 저장합니다. 또한 파일을 저장할 때 인코딩을 UTF-8로 지정해서 저장해야 합니다. 텍스트 파일을 읽어올 때 문제가 발생할 수 있기때문에 이 부분에도 주의해서 저장합니다.
저장 위치는 Assets/Resources 입니다. NGUI는 다국어 지원을 위한 파일을 찾을 때 이 경로에서 검색을 하기 때문에 경로와 파일이름이 모두 중요합니다.
NGUI 폰트 만들기
다운로드받은 폰트를 Assets/Font/FontFile에 임포트했습니다. 임포트된 폰트를 이용해서 NGUI 비트맵 폰트를 생성하겠습니다. 유니티 상단 메뉴의 NGUI -> Open -> Font Maker 메뉴를 선택해서 폰트 생성기를 엽니다.
폰트 생성기가 열리면 아래 그림과 같이 Source 항목을 선택합니다. Source 항목을 선택하면 폰트를 생성하는 메뉴가 나타나는데 여기에서 메뉴 하단의 Show All 버튼을 눌러서 모든 폰트가 목록에 나타나도록 합니다.
(Show All 버튼이 보이지 않는 경우는 모든 폰트가 목록에 나와있기 때문에 나타나지 않을 수 있습니다.).
그런뒤 임포트한 Kopub 폰트 중 하나를 선택합니다. 예제에서는 Bold 타입의 폰트를 선택했습니다.
이제 폰트로 생성할 글자 정보를 지정해야합니다. 웹 브라우저 주소 창에 아래 링크를 입력한 뒤 텍스트 파일을 다운로드 받습니다. https://goo.gl/Rlehk3
다운로드한 텍스트 파일 안의 내용을 모두 복사해서 아래 그림과 같이 Custom 항목에 붙여넣기 합니다. 그리고 Create the Font 버튼을 클릭해서 폰트를 저장합니다.
폰트 생성하기 버튼을 클릭하면 폰트가 저장될 위치를 지정하는 메뉴가 나타나는데, 아래 그림과 같이 Assets/Font 폴더에 Kopub_Bold 라는 이름으로 폰트를 저장합니다.
NGUI 아틀라스 만들기
유니티 상단 메뉴에서 NGUI -> Open -> Atlas Maker 메뉴를 선택합니다. 아틀라스 생성메뉴가 나타나면, Assets/Textures 폴더에 저장해둔 Background 이미지를 선택하고, Create 버튼을 눌러서 아틀라스를 생성합니다.
위의 과정을 통해서 생성된 아틀라스는 Localization_Atlas라는 이름으로 Assets/Atlas 폴더에 저장합니다.
Localization.txt / 폰트 / 아틀라스 생성이 완료되었습니다. 예제를 구성하는 데 필요한 구성품이 모두 준비되었습니다. 이번 예제에서 생성한 것들 중에서 이해가 되지 않거나 익숙하지 않은 부분은 복습하셔서 내용을 익히시기 바랍니다.
여기까지 마무리하고, 다음 예제에서 UI 위젯을 구성하고 예제를 완성하겠습니다.
내용 끝까지 읽어주셔서 감사합니다.
배너 클릭은 저에게 많은 힘이 됩니다.
감사합니다 🙂