joyStick으로 캐릭터 이동시키기

2015.08.27. 04:02

마우스로 클릭한 지점까지 캐릭터가 이동하는거 하다가... 세나 하던중에 딴생각.

데탑이야 키보드, 마우스로 움직이면 되지만 모바일은 터치로 움직여야하니까!

조이스틱이 있어야 되지않을까? 일일히 터치해서 이동하는거보단 왼손으로 조이스틱 움직이고

오른손으론 스킬 누르는게 편하더라.

그래서

조이스틱!!

GameObject - UI - Image

이미지 두 개를 만들어준다.

하나는 Joy Pannel, 나머지 하나는 Joy Stick으로 이름을 바꾸어주고,

Joy Pannel 안에 Joy Stick을 넣어준다.

그리고 이미지 입혀주기.

다운 받은 이미지는 반드시 Sprite 로 바꾸어주어야한다.

(이미지를 누르고 Texture Type - Sprite(2D and UI) 로 바꾸어준다.)

​

​

​왼손으로 할거니까 대충 왼편으로 이동시켜줬다.

 

​

Canvas 도 Scale With Screen Size로 바꾸어준다.

화면사이즈로 바뀐다

*주석처리한 부분은 모바일 터치전용. 지금은 마우스로 스틱을 움직여야한다.

PannelRad에는 joy Pannel 크기의 반을 구해서 넣어주고

​Center 는 joy Stick의 맨 처음 중심위치.

joyMove 는 joy Stick을 움직일때 호출된다.

Axis는 어느위치로 움직이는지 넣어주는 변수.

RectTransform이란걸 GetComponent해오는데, Canvas를 이용하면 Transform이 RectTransform으로 알아서 바뀐단다.

그러니까 Canvas에서만 쓸수 있고 Transform에 추가된 기능 이라고 보면됌.

SizeDelta는 Size.

각각 joyMove와 End함수를 public으로 해놓은건 외부에서 불러서 쓸거기때문에 그런거다.

fingerPos 에 마우스 위치좌표를 넣어주고,

마우스 좌표와 stick 중심 좌표간의 차를 nomalized해준 값을 방향(Axis값)으로 사용한다.

(axis는 단순히 방향을 가리키는 변수인데 nomalized정규화를 통해 방향벡터로 바꿔주는거란다!)

fDistance 는 두 좌표간의 거리.

Stick이 Pannel밖으로 나가지 않게끔 조건문으로

fDistance가 Pannel크기의 반인 PannelRad를 넘어가면 PannelRad만큼만 이동하게 한다.

else mouse좌표대로 stick움직임.

End는 Vector3.zero로 방향 초기화하고 Center로 원위치시키기. 

 

작성한 스크립트를 Joy Pannel에 넣어주고 Stick에는 Joy Stick을 넣어준다. 

그리고 아까 추가한 Event Trigger에서 각각 +버튼을 눌러서 추가한다음

none에다가 Joy Pannel을 넣어준다.

Drag 는 Move()

End Drag 는 End().

(중간에 날아가서... Image로 되어있지만 Joy Pannel을 넣어주면된다 ㅜㅜ)

Joy에도 JoyPannel을 넣어주면된다.

​

​

​

​

​

여기까지하면 joy Stick이 움직이는 대로 움직이는 캐릭터를 볼수 있다.