728x90
📢 최근 회사의 프로젝트를 진행하면서 UI Toolkit를 사용하게 되어 공부하게 되었습니다.
UI 시스템 비교
종류 | 설명 |
IMGUI ( Immediate Mode GUI) | 코드 기반 사용자 인터페이스를 빠르고 쉽게 만들수 있는 라이브러리, 유니티 초기 UI 시스템 |
NGUI ( Next - Gen UI ) | 상용 UI 시스템, IMGUI가 불편하여 사용한 플로그인 아틀라스를 사용하여 드로우콜을 줄임 |
UGUI ( Unity GUI ) | 게임 오브젝트 직관적이기 때문에 확인이 쉽고 유니티에 최적화 현재 많이 사용하고 있는 UI 시스템 |
UI Toolkit ( UI Builder ) | 웹 참고 새롭게 출시된 UI 시스템, 런타임 UI 개발, 에디터 UI에도 사용이 가능 |
Web과 Unity의 유사점
Web | Unity | 기능 설명 |
Css | Uss | 스타일 |
HTML | UXML | 구조, 레이아웃 |
JS | C# | 기능, 상호작용 |
Web의 이름에서 Unity의 U만 가져다 붙혀 나타냈다.
직접 UI Toolkit을 사용해보니 웹을 공부한 적이 있다면 쉽게 접근할 수 있다. 특히, Adobe의 Dreamweaver과 유사하다.
UI Toolkit 시작하기
🔹 UI Document 생성
: Project 우클릭 ➾ Create ➾ UI Toolkit ➾ UI Document
해당 uxml 파일 생성이 된다.
uxml 파일을 더블 클릭하면 UI Builder 윈도우가 열리게 된다.
🔹 UI Builder 창 열기
UiBuilder로 로드된 UXML 문서가 열리게 되며 1번 ~ 6번까지의 인터페이스로 되어있으며 이를 이용하여 UI를 배치하면 된다.
🔹 PanelSetting 생성하기
: Project 우클릭 ➾ Create ➾ UI Toolkit ➾ Panel Settings Asset 클릭
UI 순서, 텍스트 설정 등 세팅을 위한 에셋이다.
🔹 Game View 창에 띄우기
: 배치한 UI를 보여주기 위해 빈 게임오브젝트를 만든 후 UI Document의 컴포넌트를 추가한다.
생성한 Panel과 UXML를 연결해준다.
Ui Builder에서 작업한 Game View에 UI가 나타나게 된다.
이후의 글은 UI 배치, Style, Library에서 사용해 본 Button, Label 등 정리 할 예정이다.
📃 참고 자료
728x90