본문 바로가기

Unity/Unity2D_TopDown

Unity2D-Top_Down - 모바일Ui(방향키)

1. 모바일UI구성

 (1) - 이미지Sprite border중 하얀배경과 검정배경 스프라이트는 늘려서 사용할 예정이기 때문에 이미지가 늘어나도 양 끝이 뭉게지지 않도록 border를 T: 3, B: 4로 잘라준다

 

 

(2) - Canvas 계층구조 아래 controler Image를 만들어 검정배경을 깔고 그안에 빈 오브젝트 두개를 생성하여 각 각

diretionKey, EnterAndBack 으로 이름을 정정 후 각 각 비어있는 오브젝트 안에 적절한 image UI를 배치한다

 

 

(3) - 화면 비율을 9:19(최근 모바일 화면 비율)로 조정해보고 Main Camera의 Pixel Perfect Camera와 함께 조정해보면서

      알맞은 미리보기 Game화면 비율을 찾아본다

 

 

2. 모바일 방향키UI 관련 코드 작성

  (1) - 아래 PC에서의 Input관련 코드를 모바일UI에서 구상하기 위해서는 우리가 수동으로 Input관련 코드를 생성해야한다 

      - PC에서 방향키가 입력이 되는 Input의 로직은 우리가 모바일에서 방향키UI를 누르는 행위와 같은데

        이는 방향키UI의 Event Trigger에서 구현할 것이고

      - PC에서 Input으로 인해 리턴되는 GetAxisRaw()의 값 -1 , 0 , 1 과 GetButtonUp() or GetButtonDown()의 bool값

        이는 각각 전역변수로 구현할 것이다

 

 

 (2) -  GetAxisRaw()의 int값과 GetButtonUp() or GetButtonDown()의 bool값을 

         전역변수로써 구현

 

 

(3) -  ButtonDown or ButtonUp 함수의 매개변수로 각 방향키를 상징하는 U or D or R or L 중 하나가 들어오면

       위에서 선언한 전역변수에 값을 할당해줌으로써 Input.Get~~ 과 같은 로직을 구현한다

 

    - 예를 들어  ->Key를 누르면 Input.GetAxisRaw("Horizontal")로 인해 플레이어의 속도가 1이 되고

                                        Input.GetButtonDown("Horizontal")로 인해 플레이어 수평이동중이 true가 된다

 

       이는 void ButtonDown("R")로 인해 right_value = 1 이 되고 right_Down = true가 되는 것과 같다                                        

 

 

(4) - (3)에서 말한 PC와의 로직이 같아지도록 플레이어 이동변수 초기화 부분과 수직,수평버튼 up,down체크 부분을

       재구성해준다

 

 

 (5) - Input.Get이 입력을 받으면 1프레임만 true가 되고 다시 false로 돌아가는 로직을 수동으로 구현해준다

 

 

 

(6) - 각 방향키UI에 클릭 이벤트를 주어야한다

    - 기존 On click() 이벤트는 버튼을 누르고 떼는 Up ,Down이 한세트이기 때문에 문제가 생긴다 

    - Up과 Down에 관한 이벤트를 각각 따로 구현하려면 속성 중 Event Trigger를 사용하면 된다

 

(7) - Event Trigger에서 +버튼을 누르고 PointerDown과 , PointerUp 이벤트 두개를 추가한다

 

 

(8) - 추가한 이벤트의 빈칸에 Player 오브젝트를 드래그앤 드랍하고 Function을 우리가 위 스크립트에서 정의한 

ButtonDown 과 ButtonUP을 각각 넣어주고 빈칸에 매개변수인 U , D , R , L 중 하나를 방향키UI에 맞게 넣어준다

 

 

3. 모바일UI (엔터와 취소)