본문 바로가기
유니티5 독학 & 게임 제작

유니티5 독학하기 그 43번째 걸음-환영인사 메세지 출력하기와 닫기버튼의 구현

by 인터넷떠돌이 2018. 5. 28.
반응형

안녕하세요?


이번 시간에는 NGUI를 공부하면서 어떻게 하면 상단에 환영인사 메세지를 출력할 수 있는지와, 단순한 Exit와 같은 버튼 말고, 윈도우위 닫기 버튼을 구현해 보는 작업을 하고자 합니다.



일단 UIRoot>Main에 있는 Background를 Ctrl + D를 눌러서 복사해 주도록 합니다.



이름을 일단 Welcome로 바꾸어 주도록 합니다. 그리고 나서 lURoot아래로 이동 시킵니다.



그리고 나서 자식 오브젝트인 Stripes를 제거하도록 합니다.



그리고 나서 위 스크린샷에 보이는 것처럼, Welcome을 수정하도록 하는데, 먼저 스프라이트부터 Window로 바꾸도록 하고, 깊이를 1로 두고서 사이즈를 800 X 100 으로 두도록 합니다.



그리고 나서 UIRoot>Options>Welcome>border로 이동을 해서, 위 스크린샷과 같이 스프라이트를 바꾸도록 하고, 다음에는 깊이를 2로 두기로 합니다.



그 다음에는 Welcome에서 Alt+Shift+N을 눌러서 새로운 빈 자식 오브젝트를 마들도록 합니다. 그리고 나서 Text라고 오브젝트의 이름 자체를 바꾸도록 합니다.




다음에는 Alt+Shift+L을 눌러서 Label이라는 자식 오브젝트를 Text안에 불러 오도록 하고, 그 다음에는 위 스크린샷과 같이 바꾸도록 합니다. 색상도 바꾸고, Overflow를 자유롭게 바꾸도록 한 다음에, text항목에는 입력을 하도록 합니다.



그 다음에는 Add component를 선택한 다음, Tween Position을 추가하도록 합니다.



다음에는 Tween Position을 누른 다음에, 위 스크린샷과 같이 만들도록 합니다. To 항목에다가 {-2400, 0, 0}을 선택하도록 하고, 그 다음에는 Duration과 start delay를 설정하도록 합니다. 그런데 이러고도 에러가 발생하였는데 어디가 문제였느냐 하니......



위에서 1로 깊이를 설정한 Text>Label안에다가 깊이를 3으로 바꾸도록 합니다. 그렇게 하면 아래의 동영상과 같이 나오는 것을 볼 수 있었습니다.



일단 의도치 않게 출력하라고 만든 박스를 넘어서 나오는 것을 볼 수 있습니다. 이래서야 곤란하기는 곤란한데, 그래서 클리핑이라는 과정이 필요하게 됩니다.



다시금 UIRoot>Welcome에 있는 Text를 누르도록 합니다.



이런 클리핑 작업을 위해서는 Add Component를 누른 다음에, NGUI panel을 누르도록 합니다.




그런다음 UI Panel에서 설정을 깊이를 1로 설정을 하고서, 클리핑을 Soft Clip를 둔 다음 사이즈를 760 X 100으로 두도록 합니다.



이제서야 의도한 대로 상단의 박스에서만 환영인사 메세지가 나오는 것을 볼 수 있습니다. 이제는 닫기 버튼을 구현하러 갈 차례인데, 일단 버튼의 외형부터 만드는 것 부터 해야 겠습니다.



그리고 나서 먼저 UIRoot>Main>Buttons>Exit를 선택한 다음, 여기다가 Ctrl+D를 눌러서 복사를 하도록 합니다. 그 이후에 Close라고 이름을 바꾸도록 합니다.



우선 위 스크린샷을 보시면 상단의 톱니바퀴가 있는데, 여기서 이 톱니바퀴를 눌러서 Remove Component를 눌러서 제거하도록 합니다. 이렇게 해서 Play Tween을 제거하도록 합니다.



다음에는 Close에 있는 사이즈와 Transform을 위 스크린샷과 같이 바꾸어 주도록 합니다.



다음에는 그 아래에 있는 Label이라는 항목에 들어간 다음에, 여기서 이름을 X라고 바꾼다음에 폰트 사이즈를 55로 바꾸고, text를 x라고 소문자로 바꾸도록 합니다.



이렇게 해서 완성이 된 닫기 버튼이 완성이 되었습니다. 그런데 이렇게만 해서는 겉 모습만이 완성이 되었을 뿐이지, 기능이 아직 없습니다. 그래서 기능을 추가하는 작업을 해야 합니다.




먼저 UIRoot>Main>Buttons>Close를 선택한 다음 Add Component를 누르도록 합니다.



여기서는 Forward Events라는 항목을 섵택하도록 합니다.



새로 추가가 된 Forward Events에는 위 화면과 같이 Target을 Exit로 지정을 하고, On Click을 선택 하도록 합니다.



다음에는 이 Close라는 게임 오브젝트를 복사해서 UIRoot>Options>Close로 복사본을 이동 시키도록 합니다.



그 다음에는 Target을 Confirm으로 둔 다음에, On Click을 선택하도록 합니다.



위 동영상을 보시면 닫기 버튼이 완성이 된 것을 보실 수 있습니다. 이렇게 해서 '유니티 NGUI 게임 프로젝트'라는 책의 챕터 3가 어느정도 많이 진행은 되었지만, 아직은 남아 있다는 생각이 듭니다. 이렇게 계속 나아가서 여기를 완성한 다음에, 어서 챕터5까지 가고 싶다는 생각이 들지만, 여기서 나오는 내용이 너무 중요해서 그냥은 갈 수 없다는 생각이 듭니다.


반응형