본문 바로가기
모바일/유니티

유니티 | NGUI 기초

by KISCH 2020. 3. 9.
반응형


NGUI



UI Root라는 스크립트 아래 자식오브젝트를 두고 화면에 그림

Panel과 Widget(sprite, label 등)을 통해 정렬(순서를 정해서)하여 화면에 그림


UI Root : 카메라 생성(Main Camera 삭제)

Label : 폰트를 이용해서 글자 출력

Button : 충돌 박스(Box Collider)가 있어야 터치 인식

Scroll View 

Camera Scroll View

⊢ UIScrollView 컨텐츠 구현에 자주 사용. 

∟ UIPanel을 이용해 클립핑(UIWidget을 상속받지 않으면 클립핑 불가)



유니티NGUI




NGUI 구성



1. Anchor : 해상도가 바뀌어도 항상 고정

2. Panel 

⊢ Sprite, Label, Button 등 다양한 Widget들을 배치

⊢ 전부 패널 안에서 그려짐

∟ 패널이 없으면 그려지지 않기 때문에 위젯은 패널의 자식 오브젝트로 존재


3. Widget : 화면에 실질적으로 보이는 Contents

4. Atlas : 사용할 그림들의 집합

5. Font



아틀라스



아틀라스


⊢ 텍스처들을 모아 놓은 커다란 텍스처

∟ 하나의 메터리얼만을 사용할 수 있어 드로우콜을 줄이고 성능 향상에 도움


1. 이미지 변경 : resource에 이미지 교체 -> project창에서 변경 된 이미지 선택 후 atlas maker 오픈 -> 해당 atlas 선택 -> add/update


아틀라스 메이커 (Atlas Maker)


⊢ Project

우클릭 -> NGUI -> Open Atlas Maker

New, UI 추가, Create

저장

메터리얼, 프리팹, 텍스처 생성


∟ 업데이트

이미지 교체 시 이미지 전부를 업데이트 해야함 -> 안 그러면 기존 이미지 계속 품질 저하 됨



Camera



UI는 고정되어 움직이지 않는 이유는 UI용 카메라가 따로 존재

UI객체는 UI카메라에만 찍혀야 함. 별도의 레이어로 구분


Clear Flags : 화면의 어떤 부분이 제거될 지 정함

⊢ Depth Only : 카메라가 볼 수 있는 영역에 있는 오브젝트만 Depth 수준에 따라 렌더링

⊢ Skybox

⊢ Solid Color : 빈 공간을 카메라의 배경색으로 표현

∟ Don't Clear : 색상, 깊이, 버퍼 등 아무것도 제거하지 않는다


Culling Mask

⊢ 레이어를 사용하여 선택적으로 화면에 그려낼 오브젝트들을 정함. 배경과 효과 나누는 등의 작업

∟ 오브젝트가 보이지 않는 경우 해당 카메라의 해당 레이어가 선택되어 있는지 확인




반응형

댓글