내일배움캠프 74일차 TIL - 최종 프로젝트 개발 확장 9

 

[한 줄 요약]

컨트롤러 버그를 고치고, 퀵슬롯을 개편하고, 대쉬 기능을 추가하였다.

---

[학습 내용]

 

최종 프로젝트 개발 확장

---

컨트롤러 버그 수정

원인과 해결

우선 가장 큰 원인으로는, 캔버스 크기의 변화였다. 해상도가 달라지면 캔버스의 크기도 달라져서 컨트롤러의 좌표가 바뀌는 것이 원인이었다.

그렇다면 캔버스의 변화에 따라 좌표를 바꿔줘야 하는데, 이 과정이 오래 걸렸다. 지금까지 짚어본 헛다리로는, 카메라 크기를 고정하여 캔버스 변화를 막는다던가(이건 UI 배치 등의 이유로 포기했다), 캔버스를 카메라 기준으로 바꿔본다던가, 좌표를 스크린 기준으로 바꾼다던가 하는 것들이었다.

왜 이렇게까지 헤맨 것인가 하면 캔버스 크기가 바껴도 컨트롤러의 RectTransform 좌표값이 바뀌지 않았기 때문이다. 그래서 다른 게 문제인 줄 알았다.

그런데 한참 지나고 나서야 어쩌다 Scale 쪽에 눈이 갔고, 1이어야 할 스케일이 1.333으로 바껴있었다. 기존 해상도의 y값이 1080이었는데, 1440으로 늘어나면서 생긴 변화같았다.

그제서야 아차 싶어서 컨트롤러의 위치 좌표에 늘어난 스케일 값(1.333)만큼 곱해줬더니 해결되었다.

 

 

퀵슬롯 변경

구성 변경

새로운 기획에 따라 대쉬 기능과 고양이 고유 스킬 슬롯을 추가하고, 인터페이스 구성을 바꾸었다.

바뀐 퀵슬롯

 

---

!! 문제 발생 !!

 

* 내용

버튼이 동그랗게 생겼어도 버튼 클릭 인식 범위가 사각형으로 고정되는 문제가 있었다. 그래서 사이드 버튼들과 눈으로는 겹치지 않아보여도 인식 범위가 겹치는 현상이 발생하였다.

 

* 탐색

구글에 검색해보니, 코드를 짜서 이미지의 투명한 곳을 인식하지 못하게 하는 방법 밖에 없었다. 뭔가 편법으로 하는 거 같아서 정도를 찾아보았다. 그런데 마땅히 나오는 게 없었다. 아직은 버튼을 사각형으로만 만들 수 있는 것 같다.

 

* 해결

Button을 상속하는 AreaFitButton 클래스를 만들어서 기능을 추가해주었다. 그래서 기존 버튼처럼 사용하되, 이미지 부분만 클릭이 되도록 하였다. 이를 위해서 이미지 알파값의 최소치를 바꿔줘야 했기 때문에, 이미지 소스의 Read/Write 기능을 켜주어야 했다.

새로 만든 AreaFitButton

이미지 Read/Write 체크

---

 

대쉬 추가

대쉬 추가

기획에 맞도록 대쉬 버튼을 누르면 고양이가 대쉬하도록 구현하였다. 대쉬 방향을 지정할 경로를 따로 만들지 않았기 때문에, 마지막으로 이동한 방향을 향해서 대쉬가 나가도록 만들었다.

고양이 대쉬

 

이를 위해서 선형 보간 방법을 사용하였다.

참고한 글: https://iygames.tistory.com/6

[Unity] 유니티 3D Vector의 선형보간 Lerp 정확한 사용법

 

 

---

[회고]

오늘은 생각보다 일이 잘 풀린 거 같다. 내일은 플레이어 종류 추가와, 대쉬 쿨타임을 시각적으로 확인할 수 있는 기능을 넣어봐야겠다. 그리고 괜찮다싶으면 퀵슬롯을 반투명하게 만들어봐야겠다.