[Unity] UI에서 Position 변경 시 주의사항

아이템을 누르면 마우스 위치에 해당 아이템 복사본이 생성되어 마우스를 따라다니고 이걸 이동, 드랍, 장착 등의 동작에 사용하려고 했는데.....

이런 어처구니 없는 상황이 발생해버렸다.

RectTransform.localPosition = Input.mousePosition;

딱 한 줄의 간단한 코드라 뭐 어디 잘못된 것도 없어서 좀 당황했다. 그냥 position으로도 바꿔보고 anchoredPosition으로도 바꿔보고 오브젝트 설정도 바꿔보고 했는데 잘 안돼서 이거저거 바꿔보고 검색해본 끝에 해결했다.

먼저 내 UI 세팅이다. 메인 카메라에 의해 렌더링돼도록 했고 여러 해상도에 반응하기 위해 Canvas Scaler를 달아주었다.

여기서 아마 저 Render Mode가 Screen Space - Camera일 경우 저런 문제가 발생하는 것 같다.
실제 위치와 카메라로 렌더링돼 보여지는 것에 차이가 있어서인지 아님 마우스 인풋이 달라지는 문제인지 정확히는 모르겠지만 어쨌든 저 렌더링 방식 때문에 UI에서 이상하게 그려지는 것 같다.

해결법은 RectTransformUtility.ScreenPointToLocalPointInRectangle 이 함수를 사용하면 된다.

public static bool ScreenPointToLocalPointInRectangle(RectTransform rect, Vector2 screenPoint, Camera cam, out Vector2 localPoint);

rect에는 부모 오브젝트의 RectTransform을, screenPoint는 마우스 위치 등 오브젝트가 위치할 좌표, cam은 렌더링 되는 카메라를 넣으면 된다.

유니티 Docs에 있는 설명을 읽어보니
화면 공간 점을 사각형 평면에 있는 RectTransform의 로컬 공간 위치로 변환합니다. 라고 돼있다.

보이는 화면에서 찍는 좌표와 실제 RectTransform에 찍힌 좌표가 달라서 화면에 찍는 좌표를 RectTransform의 로컬 좌표로 변환해주는 것 같다.

RectTransformUtility.ScreenPointToLocalPointInRectangle(InventoryManager.Instance._rect, Input.mousePosition, Camera.main, out var pos);
_rect.localPosition = pos;

그래서 이렇게 코드를 바꿔주었다. 헤맨 시간 치고는 바뀐 코드 역시 너무 간단하다...

해결!