NGUI 3.x Tutorials Step1 - Scene

 이제 유니티3D에서 많이 사용되어지고 있다는 NGUI 튜토리얼 정리도 시작해볼까 합니다. NGUI 개발사 사이트에 가보면 최신의 3.0.x와 관련된 튜토리얼이 있지만 영상 튜토리얼뿐이고 NGUI 홈피에 글로 된 2.7.0 기준 튜토리얼이 있지만 구버전이죠. 또한 구글링을 해보면 한국분중 아이군님의 블로그와 icoder님의 블로그에 이미 번역한 내용이 있긴 합니다만 역시나 2.7.0 기준의 내용들입니다. 그래서 NGUI 사이트의 2.7.0 기준 튜토리얼과 샘플을 제 나름대로 3.x에 맞게 정리해보려고 합니다. 정확히는 3.0.8 f3 3.3.2 버전입니다. NGUI 버전 명명법이 갑짜기 바뀌었네요.

 정리에 앞서, 아래 그림과 같이 3.0.7부터 Deprecated 된 Widget Wizard와 같은 Legacy 기능들은 배제할 생각입니다. 또한 NGUI 몇몇 샘플과 튜토리얼을 열어보면 아직 UIAnchor을 사용하는 것도 있던데 이것도  Deprecated된 상태라 사용하지 않는 방향으로 진행할 생각입니다.

 NGUI 익스포트 하면 아래 그림과 같이 Scenes에 튜토리얼 1부터 11까지와 Example(이하 샘플)에 0 부터 13 + X가 있습니다. 먼저 튜토리얼부터 정리하고 시간이 되면 샘플도 정리해보겠습니다. 이번 포스팅은 튜토리얼 1 - Scene에 관한 내용입니다.

 자 이제 튜토리얼1 Scene과 같은 결과물을 만들어 보겠습니다. 먼저 유니티에서 새로운 프로젝트를 만들거나 새로운 씬을 만들어줍니다. 그리고 아래 그림과 같이 NGUI - Create - 2D UI를 선택해줍니다.

 NGUI 사이트에는 Main Camera를 삭제하라고 하지만 굳이 삭제를 안해도 됩니다. 생성된 결과도 아래 그림과 같이 다릅니다. 예전에는 UI Root - Camera - Anchor - Panel 순으로 생성이 되었지만 3.0.8에서는 깔끔하게 UI Root - Camera만 생성됩니다.

 예전 버전은 보지 못해 확실치 않지만 아래 그림과 같이 UI Root에 UIPanel 컴포넌트를 포함 시킨서 그런듯 하네요.

 이것으로 끝입니다. 2D UI 작업을 할 수 있는 환경만 일단 만들어 봤습니다. 여기에 계속해서 내용을 추가해갑니다. 다음에는 스프라이트를 추가해 보겠습니다.


참고

NGUI Tutorial Step 1: Creating Your UI