티스토리 뷰

NGUI를 처음부터 설명할 순 없으니 약간은 안다는 가정하에 시작해볼게요. (유료버전 기준입니다.)



1. 구조 잡기

- Root

--Camera

--Scroll View

---Grid

----Content (0)
----Content (1)
.
.
.
----Content (9)



이런 구조로 잡아줍니다.

Root와 카메라는 NGUI의 기본 루트를 그대로 사용하고 있고요.

Scroll view는 따로 만들 수 있습니다. NGUI->Create-> Scroll View 누르면 만들어집니다.

Grid도 마찬가지로 NGUI->Create->Grid 눌러서 만들 수 있습니다.

그리드 하위부터는 안의 내용물로서 이미지나 버튼, 레이블 등이 채워지게 됩니다.


2. 와꾸잡기

1번에서 제대로 생성을 했다면,
먼저 Scroll view부터 확인해보자.
해당 게임오브젝트에는 분명 
UI Scroll View 컴퍼넌트와
UI Panel 컴퍼넌트가 있을 것이다.

이것부터 건드려보자.


먼저

게임 패널을 씬뷰에서 크기를 어떻게 해야하는지 세팅할 수 있다.



여기서 앵커와 포지션과 크기를 설정할 수 있다.

사이즈는 마스크와도 긴밀한 연관이 있고

또한 앵커 설정을 잘해야 스크린 크기에 따라 들쭉 날쭉 되지 않게되니 그런 설정도 잘해주자.



그 다음 스크롤뷰에서는...


일단 Content Origin은 자식의 어느 부분을 시작지점으로 할지! 입니다.

Movement는 움직일 수 있는 축 설정이고요,

그리고 그 외의 것은 드래그 감도나 뭐 그런 잡다구레한 것들이니 직접 확인하는 게 좋을 것입니다.


그 밑은 이제 컨텐츠의 부모가 될 Grid입니다.


UIGrid라는 컴퍼넌트가 붙어 있고

컨텐츠 들을 어떻게 정렬할지에 대해서 설정할 수 있습니다.

Arrangement는 어느 방향으로 정렬할지,

Cell width와 height는 밑의 컨텐츠들이 일괄적인 크기.

Column Limit 혹은 Row Limit는 어레인지 최대치라고 보시면 됩니다.

Sorting은 컨텐츠들의 순서입니다.


마지막으로 이 그리드 밑의 컨텐츠 부분입니다.


이 부분은 구조가 잡힌 프리팹이 될 수도 있고

스프라이트가 될 수도 있고 레이블이 될 수도 있지만,

핵심은 이겁니다.

잡고 움직일 수 있어야되요.

그러기위해선 잡을 수 있어야하니 박스콜라이더가 추가되어야 하고

스크롤뷰로 이동된다는 것을 선언해주기 위해 UI Drag Scroll View 추가 해야 합니다.

그리고 스크롤뷰 오브젝트를 가져와서 캐싱해줍니다.


일단 이렇게만 하면 일단 가장 기본적인 부분은 될거에요.

UI는 기술적인 어려움보다는 센스와 경험이 중요하기 때문에....

기반을 잘 닦아서 화이팅 해보세요.

댓글
최근에 올라온 글
Total
Today
Yesterday
TAG
more
«   2024/10   »
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31