Smart Academy

(7)  스크롤 바 만들기

Widget Tool 창에서 Template을 Scroll Bar로 두고 Anchor에 Add To 버튼을 눌러 오브젝트를 생성합니다.

[그림 7-7]

[그림 7-8]

      그리고 생성한 ‘Scroll Bar’의 포지션을 X = 50, Y = 210값을 넣어 ‘Label’의 옆에 오도록 조정을 해줍니다.

[그림 7-9]

그리고 플레이 버튼을 눌러서 스크롤 바가 드래깅에 맞춰서 잘 반응을 하는지 체크해봅시다.

  (8)  ‘Label’ 포지션 조정

플레이를 시작했을 때, ‘Label’의 시작부분이 1부터 화면에 보이도록 ‘Label’의 포지션을 변경합니다. 이때 플레이 한 상태에서 값을 바꾸면 플레이모드에서 빠져나오면 사라지게 되니 플레이모드에서 동작을 확인하고 플레이모드를 끄고 값들을 수정합니다.

‘Label’을 선택하고 Transform에서 Y 포지션 값을 -474로 수정해줍니다.

[그림 7-10]

  (4)  Draggable Panel 설정

‘Panel’오브젝트를 선택하고 Inspector에 있는 Add Component 버튼을 눌러서 NGUI > Interaction > Draggable Panel을 선택하여 컴포넌트로 추가합니다.

그리고 ‘Label’의 드래그가 세로축 방향으로만 일어나야만 하므로 Scale에서 Y의 값만 1로 놔두고, 나머지는 모두 0으로 변경해줍니다.

[그림 7-3]

(5)  ‘Label’의 Drag Panel Contents 설정

이번에는 Drag를 위한 Collider 영역을 따로 생성하지 않고 ‘Label’ 자체를 클릭 & 드래그 인식이 가능하게 만들어 사용해보겠습니다.

‘Label’ 오브젝트의 Inspector창으로 가서 Add Component 버튼을 눌러서 NGUI > Interaction > Drag Panel Contents 를 선택해서 컴포넌트를 추가합니다.

생성된 UIDrag Panel Contests (Script)에서 Draggable Panel에 자동으로 설정되어 있는 ‘Panel’을 클릭해서 실제로 우리가 드래그하고자 하는 패널이 제대로 설정되어 있는 것인지 확인해봅니다.

위의 그림과 같이 자동으로 설정되어 있는 ‘Panel’을 클릭해보면 Hierarchy창에서 설정된 객체를 표시해줍니다.

[그림 7-4]

그리고 ‘Label’ 오브젝트의 Inspector창에서 Add Component를 클릭해서 Physics > Box    Collider를 클릭해서 Collider 컴포넌트를 하나 추가해줍니다.

생성된 Box Collider 컴포넌트에서 Y Size를 50으로 변경해줍니다. (숫자가 50까지 줄 바꿈으로 들어갔으므로)

[그림 7-5]

설정이 끝났다면, 플레이 버튼을 눌러서 드래깅이 제대로 일어나는지 확인해봅시다.

(6)  ‘Panel’의 UIPanel 컴포넌트 설정

‘Panel’오브젝트를 선택하고, Inspector창에 있는 UIPanel (Script)컴포넌트에서 Clipping을 Soft Clip으로 변경시켜줍니다. 그리고 Size를 X = 28, Y = 450으로 변경시켜준 뒤에, Softness에서 X = 1, Y = 210으로 설정해줍니다.

[그림 7-6]

7.    Drag Label 만들기

<만들 예정인 결과물>

[그림 7-1]

6. 버튼으로 오브젝트 움직이기 

​

   (6)  FSM Templates 만들기

‘Left Button’을 선택한 상태에서 Playmaker Editor창의 빈 곳을 우 클릭 > Save Template을 클릭합니다.

[그림 6-16]