Unity 에서 UI 요소를 삽입하면 Canvas 폴더가 생기고, 그 아래에 있는 객체들은 기존의 좌표체계와 달라지는 것을 볼 수 있다.
<Transform 과 RectTransform 생김새 비교>
(RectTransform 은 Transform 을 상속받은 클래스라 한다.)
어쨌든, RectTransform 속성을 지닌 객체의 포지션에 대해 이해한 것만을 적어 본다.
직관적으로 쉽게 이해하기 위해 원점 좌표를 주면 어디에 위치하는지 테스트 해보았다.
테스트를 위해 Panel 을 생성하고 그 안에 Image 객체를 넣었다.
Panel 사이즈는 1920x1080 전체화면으로 했고, Image 는 100x100 이다. (단위는 Pixel)
Panel 의 인스펙터 RectTransform (1920x1080 스크린 전체를 차지한다.) Pos X : 0, Pos Y : 0, Pos Z : 0, Width : 1920, Height : 1080, Anchors Min Max 모두 0, Pivot X, Y : 0, 0 Image 의 인스펙터 RectTransform Pos X : 0, Pos Y : 0, Pos Z : 0, Width : 100, Height : 100, Anchors Min Max X, Y 모두 0.5 |
이렇게 Image 원점의 위치는 Panel 의 가운데 위치해 있다. 원점이 가운데 있다는 뜻이다.
왜 가운데가 원점이냐면, Anchor 가 (0.5, 0.5) 이기 때문이다. 여기서 0.5의 뜻은 0.0~1.0 범위의 값으로, 화면 비율을 뜻한다. (0.5, 0.5) 는 화면 한 가운데에 Anchor 가 있다는 것이다. 그럼 Anchor 를 (0.0, 0.5) 로 한다면?
그리고, Anchor 의 Min Max 는 모두 하나의 값으로 맞추는 것으로 했다. 두 값이 달라지면 객체 사이즈가 늘어나는 stretch 와 관련이 있지만 여기서는 논외로 한다.
그럼 본격적으로 실험해 보자.
인스펙터 셋팅은 초기 조건으로 돌리고, 스크립트로 localPosition 에 원점을 넣어 실행 시켜보았다.
GameObject obj = GameObject.Find("Image");
obj.transform.localPosition = Vector3.zero;
이것은 RectTransform 의 원점과 Transform 의 원점이 다르기 때문이다.
인스펙터 상에서 (0, 0) 로 셋팅하면 RectTransform 기준으로 원점으로 이동하지만, localPosition 으로 (0, 0) 을 셋팅하면 Transform 기준으로 원점으로 이동한다.
Transform 의 원점이 왜 부모 객체(Panel)의 좌하단일까? 부모의 Pivot 이 거기 있기 때문이다.
부모의 Pivot 은 (0, 0) 이라고 했다.
그럼 부모의 Pivot 을 (0.5, 0) 으로 옮겨서 테스트 해보자.
원점의 기준을 정리하자면 다음과 같다.
RectTransform (인스펙터, 코드) | Transform (코드로만 조작 가능) | |
원점 기준 | 자신의 Anchor | 부모의 Pivot |
포지션을 코드로 조작하는 법 | RectTransoform rt = transform as RectTransform; rt.anchoredPosition = Vector3.zero; |
transform.localPosition = Vector3.zero; |
** 위의 실험들의 알려지지 않은 조건들은 모두 Unity 프로그램의 default 값들입니다.