유니티5 독학하기 그 53.5번째 걸음-게임 오브젝트의 버튼 만들기part1

안녕하세요?

어느덧 유니티NGUI게임 프로젝트라는 책의 챕터6도 어느정도 진도가 나아갔는데, 여기서 포스팅 하고자 하는 것은 우선 게임 오브젝트인 파워소스 위에 버튼을 띄워서 상태를 변화시키는 버튼을 띄우고 어떻게 게임 오브젝트를 따라 다니게 할 것인지에 대해서 포스팅을 하고자 했습니다만, 내용이 너무 길어져서 최하 2부분으로 나누어야 겠습니다.

먼저 지난번 포스팅에서 만든 InGame2DUI를 선택한 다음에 Alt+Shift+N을 눌러서 새 게임 오브젝트를 생성하도록 합니다.

그리고 나서 이름은 ElementalSwitch로 변경을 하도록 합니다.

다음으로는 프로젝트 뷰에서 button을 입력해서 검색을 한 다음에 Control-simple button을 찾습니다.

실수로 Control-Simple Button prefabs인데, 이걸 몰라서 다른 걸 했더니 전혀 드래그 앤 드롭이 되지 않았습니다. 그래서 이번에는 프리펩을 선택한 다음, 방금 만들어 둔 ElementalSwitch항목에 드래그해서 놓도록 합니다.

그러면 위 스크린샷과 같이 새로 Control-Simple Button이라는 것이 자식 오브젝트처럼 생성이 되는 것을 볼 수 있습니다.

위 스크린샷처럼 인스펙트 뷰에서 이름부터 ElementalButtons로 바꾸고, Transform부터 시작해서 아틀라스, 스프라이트, 타입, 색상과 사이즈를 변경하도록 합니다.

그리고 아래로 내려가서, Hover, Pressed, Disabled의 색상을 위 스크린샷과 같이 바꾸도록 합니다.

좀더 Hover시에 제대로 보이도록 하기 위해서 위 스크린샷에서 보이는 것 처럼 Button Scale이라는 컴포넌트를 추가해 주도록 합니다.

이렇게 해서 제대로 인스펙트 뷰에서 추가가 된 것을 볼 수 있습니다.

다음으로는 자식 오브젝트인 Label을 선택하도록 합니다.

그리고 나서 폰트부터 Lato로 바꾸어 주도록 하고 폰트 사이즈와 텍스트도 Fire로 바꾸고 효과를 Shadow를 주도록 합니다. 그리고 나서 Color Tint도 바꾸어 주도록 합니다.

이렇게 해서 Fire속성을 부여할 수 있는 버튼의 외형을 만드는 데는 성공했습니다. 이제는 나머지 3개의 원소에 대한 버튼을 만들어 보도록 합니다.

이제 이 버튼을 프리펩으로 만들기 위해서 위 스크린샷에 보이는 것처럼 계층뷰에 있는 ElementalButton을 드래그 해서 프로젝트 뷰의 Assets/Resources/Prefabs안으로 놓아 주도록 합니다.

그래서 여기서는 ElementalButton.prefab이 생성이 된 것을 볼 수 있습니다.

마지막으로 Fire라고 ElementalButton의 이름을 바꾸어 주도록 합니다.

이제 Fire버튼을 Ctrl+D를 눌러서 복사한 다음, 이름을 Ice로 바꾸어 주고 Transform도 바꾸어 주도록 합니다.

다음으로는 UIButton 컴포넌트로 들어가서 위 스크린샷과 같이 Normal과 Hover를 바꾸도록 합니다. 여기서 Normal만 바꾸어 주어도 UISprite에서 ColorTint를 바꾸어 주지 않더라도 색상이 바뀌어 집니다.

마지막 으로 Label 게임 오브젝트로 들어가서 Text를 Ice로 바꾼다음, 글자의 색상도 바꾸어 주도록 합니다.

Ctrl+D를 눌러서 Ice를 복사한 다음 이름을 Lightning으로 바꾸도록 해야 합니다.

그리고 나서 Transform도 위 스크린샷과 같이 바꾸어 주도록 합니다.

그리고 나서 UIButton컴포넌트에 위 스크린샷과 같이 Normal, Hover의 색상도 바꾸어 주도록 합니다.

그리고나서 Label에 들어가서 Lightning로 Text를 바꾸어 주도록 하고, 다음으로 Color Tint를 흰색 계통으로 바꾸어 주도록 합니다.

다음으로 Ctrl+D로 복사를 한 다음에, Water라고 이름을 바꾸어 준 다음, 위 스크린샷과 같이 Transform을 만들어 주도록 합니다.

그리고 나서 UIButton항목을 위 스크린샷과 같이 Normal과 Hover를 바꾸어 주도록 합니다.

다음으로는 Label로 들어가서 Text를 Water로 바꾸어 주도록 하고, 다음으로는 Color Tint도 바꾸어서 글자 색상도 바꾸어 주도록 합니다.

이렇게 해서 4 종류의 버튼이 종류별로 만들어 지는 것을 볼 수 있었습니다. 겉으로는 완성이 되기는 했습니다. 하지만 이 버튼들은 게임 오브젝트에서 떨어져 있습니다. 그래서 이것을 따라다니도록 만들어야 하는데, 이렇게 하기 위해서는 스크립트를 작성해야 하는데, 이는 다음 포스팅에서 다루도록 하겠습니다.