[📜일지] 개발일지 #3

오랜만에 다시 올리네요

그동안 맵기능 구현하느라 죽는줄 알았습니다.

이번엔 진행하면서 굉장히 많은걸 배웠는데요. 가장 큰건 아무래도 UI 요소인 CANVAS가 아닌가 싶습니다.

위의 (옆에서 나오는 애니메이션의)노트도 원래는 패널로 안하고 개별적인 오브젝트로 생성후

버튼을 child object로 만들어서 애니메이션을 플레이해봤었는데

이상하게 버튼이 부모 오브젝트를 안따라 오길래. 무엇이 문제일까 고민을 하면서 시간을 지새운 결과...

와! UI는 UI object만을 따라가는구나! 라는걸 알았습니다.

그 후, 아래에는 맵 기능을 만들었구요.

맵은 기본적으로 휴대폰을 연상시키기 위해서 길쭉하게, 화면전체를 차지하도록 만들었고.

그 길이감을 전달하기 위해서 옆에서 나오는 것이 아닌, 아래에서 위로 쑤~욱 하는 느낌으로 나오게 만들었습니다.

이후 맵을 닫고싶다면 맵을 클릭후 적당히 내린다음 클릭을 때면, 지정된 위치까지 알아서 내려가도록

vector3.lerp를 사용해서 만들었습니다.

21b8c236abc236a14e81d2b628f1736e7072

이것도 정말 많은 개고생후 알아낸 기능이었는데. 써보니깐 신세계더라고요. 원래는 다 애니메이션으로 만드나 생각했었는데 역시 코딩! ^^b

그리고 맵을 닫는 기능은 원래는 버튼으로 만들려고 생각했었는데. 어짜피 모바일로 만드는거, 맵을 닫을때 모바일의 강점을 살려서 click & drag로

내릴 수 있게하자 라고 생각하여

22b3d434e4d576b660b8f68b12d21a1ddcb481addd

이벤트시스템에 있는 IDragHandler와 IEndDragHandler를 사용하여 UI요소가 드래그 되고있는지 파악할 수 있게 하였고.

OnDrag에선 맵을 내릴때 맵의 x축이 옆으로 움직이지 않고 깔끔하게 내려가도록. 새로운 벡터값에 x와 z값만 0으로 맞춰놨는데.

이상하게 아무래도 완전히 0으로 유지시키는건 안되더라고요. 완전히 0으로 유지하게 노력을 해보았지만. 저의 뇌가

과부화되어서, 일단은 포기하고 미래의 저를 위해서 남겨놓았습니다.

그후 drag가 끝났을때에는 대조군 패널의 위치값과 맵 패널의 위치값을 비교하여. 맵 패널의 위치값이 더 작으면

update에 있는 lerp가 진행될 수 있게 하는 방식으로 만들었습니다.

이렇게 넣다 뺐다를 마친후 들어간 작업은 맵을 선택할 수있는 창을 만드는 작업이었습니다.

영상에서 나오듯이 폰을 꺼내면서부터 나오는 화면은 월드맵으로 각 테마의 스테이지를 한눈에 볼수 있게 만들것이고.

그 다음으로 스테이지 버튼을 누르면 나오는 세부맵이 존재합니다. 아직은 띄어주는 것만 구현해놨지만.

나중엔

월드맵 클릭 -> 세부맵이 뜸 -> 세부맵에서 갈수 있는 장소를 클릭 (갈수있는 장소가 보일예정) -> 폰이 자동으로 화면밖으로 내려감

-> 메인플레이 화면의 일러스트가 세부맵에서 선택을 한 장소로 바뀜.

이런순서로 나타나게 만들 예정이고. 맵은 건물의 내부, 외부를 둘다 쓰면서 좀더 입체적으로 장소를 보여줄 예정이라.

맵 디자인부터 할게 많이 남았습니다 ㅠㅠ

뭐.. 이거 말고는 한게 없는거 같네요. 분명 많이 한거같은데..

아직 코딩은 많이 힘든것 같습니다, 그래도 계속 하다보면 익숙해지겠죠? ㅋㅋㅋㅋㅋ 제발

굉장히 두서없이 글을 썼는데, 다음 일지에선 좀더 구체적으로 쓰도록하겠습니다.

일지 읽어주시면서 귀한 시간써주신 분들 감사드리고, 좋은 하루되세요. 태풍에 큰 피해없길!

P.S.

다음엔 맵디자인과 수집한 것들을 보는 컬랙션 UI 디자인이 될거 같습니다

댓글 3