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

유니티5 독학하기 그 62번째 걸음-UI디자인하기 part2

by 인터넷떠돌이 2018. 8. 4.
반응형

안녕하세요?


지난번 포스팅에서 타이틀까지 달아놓았는데, 이번에는 나머지 부분을 완성하고자 합니다. 우선 이번 챕터12에서는 NGUI없이 UI를 만드는 작업을 하고 있으며, 이것만 해도 어느정도는 쓸만한 인터페이스를 만들 수는 있지만, 그래도 NGUI를 이용한 다양한 작업을 하는 것에는 못 미치는 것이 아닌가 합니다.



우선 예제코드로 있는 InGameCanvas라는 유니티 패키지를 가지고 오도록 합니다. 이 패키지는 게임상에서 점수와 수집한 동전의 갯수를 알려주기 위한 인터페이스 입니다.



모두 다 가져오도록 합니다.



프리펩이 있는 폴더로 가면, InGameCanvas.prefab이라는 것이 있는 것을 볼 수 있습니다. 이를 계층뷰로 드래그 앤 드롭을 해서 이전에 있던 Menu와 같은 항렬의 자식 오브젝트로 만든 다음, 아래처럼 코딩 작업을 시작합니다.



먼저 이 작업을 위해서 GameManager.cs에서 위 스크린샷과 같이 inGameCanvas라는 Canvas타입의 광역 변수를 선언해 주도록 합니다.



그리고 나서 게임중인 상태일때만 표시가 되도록 enabled를 조절하도록 합니다.



그리고 나서 유니티5로 돌아와서 계층뷰에서 GameManager를 선택하도록 합니다.




인스펙트 뷰에서 새로 생성된 InGameCanvas항목의 슬롯이 비어 있는 것을 처음에는 볼 수 있는데, 여기다가 InGameCanvas라는 게임 오브젝트를 드래그 앤 드롭으로 추가 하도록 합니다.



유니티에서 게임을 시작시켜 보면, 위 스크린샷과 같이 게임내 각종 점수를 알려주는 인터페이스가 나오는 것을 확인할 수 있습니다. 이제는 게임오버의 조건을 만들도록 해야 합니다.



먼저 이전에 있던 LevelPieceBasic을 복사해서 붙여넣기를 하도록 합니다. 그리고 이름을 LevelPieceHole이라고 해서 주인공이 떨어져서 죽을 수 있는 구멍을 만들어 주도록 합니다.



그리고 구멍을 만드는 과정은 간단하게도 Floor층의 일부를 삭제해서 간단하게 만들 수 있습니다. 너무 넓으면 곤란하니, 일단 2개만 제거 하도록 합니다.



다음으로는 이전에 삭제를 하였는 KillTrigger.prefab을 도로 가져오도록 해서, 이를 방금 만들어 놓은 LevelPieceHole의 자식 오브젝트가 되도록 계층뷰로 끌어다가 놓습니다. 그리고 이 프리펩만 가져다 놓으면 아무런 작업도 하지 못하기 때문에, KillTirgger.cs라는 스크립트를 컴포넌트로 반드시 추가해 놓도록 합니다.



이제 LevelGanerator 게임 오브젝트를 계층뷰에서 선택하도록 합니다.




여기서 Size항목을 이전에 1에서 2로 늘린 다음에, Element1에다가 LevelPieceHole을 배치하도록 합니다.



다음으로는 게임오버 뷰를 만들어야 하는 차례입니다. 예제 코드에서 GameOverCanvas라는 유니티 패키지를 가지고 오도록 합니다.



그리고 모두 다 가지고 오도록 합니다.



역시 프리펩 폴더를 보면, GameOverCanvas.prefab이라는 것이 생성된 것을 볼 수 있는데, 이를 계층뷰에서 Menu와 InGameView와 같은 항렬이 되도록 끌어다 오도록 합니다.



여기서 부터 다소 헤메기는 했는데, 일단 이전에 추가해 놓은 GameOverCanvas를 계층뷰에 끌어다 놓아서 새로운 게임 오브젝트로 만들어 놓도록 합니다.



그리고 일단 게임오버의 트리거가 우선 바닥에 떨어지는 것이기 때문에, 여기서는 KillTrigger게임 오브젝트를 선택하도록 합니다.



위에서 설명을 했다시피, KillTrigger.cs라는 스크립트를 추가해 놓아야 하며, 이게 없으면 아무런 작동도 하지 않았습니다. 




그리고 게임오버 캔버스를 제대로 만들기 위해서는 우선 gameOverCanvas라는 Canvas타입의 변수를 선언하도록 합니다.



그리고 나서 게임오버상태일 때만 true가 되도록 일단 만들어 주도록 합니다.



다음으로 계층뷰에서 GameManager를 선택하도록 합니다.



그리고 여기서 있는 GameOverCanvas에서 이전에 추가해 놓은 GameOverCanvas게임 오브젝트를 계층뷰에서 끌어다가 위 스크린샷의 밑 줄친 부분에다가 놓도록 합니다.



그리고 GameManager.cs에서 이전에 작성을 해 놓았는 GameOver()메소드가 완전히 비어 있는 것을 볼 수 있었습니다. 이 부분에다가 SetGameState()라는 함수를 써서, 게임오버 상태라는 것을 선언하도록 만들어 줍니다.



이렇게 해서 어느정도 게임이 그런데로 구색을 갖추어 나가는 듯한 모습을 보이고 있습니다. 하지만 아직까지 몇 군데 허전하다는 면이 있어 보이기 때문에, 계속해서 마지막 챕터를 진행해 나가도록 해 보겠습니다. 아마 마지막 챕터까지 끝내고 나면 어느정도 게임의 구색이 갖추어 지기는 하지만, 그래도 많은 부분이 아직은 '숙제'라고 남아 있는데, 아마 이 부분은 따로 하나하나 해 봐야 할듯 합니다.


반응형