유니티 UI - Anchor, Pivot, Position

1. Anchor

Anchor 는 부모 RectTansform 의 범위 안에서 UI 객체가 고정될 위치를 지정해 줍니다. 만약 상위 RectTransform 객체가 Canvas 이면 Anchor는 화면 크기의 범위 안에서 현재 UI 객체가 고정될 위치를 지정해 주는 것입니다. Anchor 는 대상 범위의 실제 크기가 얼마인지에 상관없이 항상 0~1 사이의 상대 값으로 표시됩니다.

 

이해를 돕기 위해 간단한 실험을 해보도록 하겠습니다.

테스트 환경은 아래의 이미지와 같이 Canvas 객체 아래에  ParentRect 를 만들고 그 자식으로 Button을 추가했습니다.

 

 

Button 의 Inspector 창을 보면 Anchors 가 모두 0.5 로 되어 있습니다. 이 의미는 Button UI 객체의 부모인 ParentRect의 정 중앙에 Button UI 의 위치가 고정된다는 의미입니다. 

 

Anchor 테스트

 

테스트 결과를 보면 위에서 설명한 것과 같이 ParentRect 의 크기와 상관없이 Button 이 항상 ParentRect의 정 중앙에 위치하는 것을 볼 수 있습니다.

 

2. Pivot 

Pivot 은 UI 객체의 기준점입니다. Position, Scale, Rotation 은 이 기준점에 영향을 받아 움직입니다. 특히 Position 은 Pivot 과 Anchor의 설정에 따라 동일한 값이라도 전혀 다른 위치에 표시될 수 있습니다.

 

위에서 만든 버튼을 Z 축으로 회전시키면 버튼의 중심을 기준으로 회전합니다. 또, Scale의 x 값을 늘이거나 줄이면 버튼의 중심점을 기준으로 양옆으로 늘어나거나 줄어듭니다. 이는 Pivot 이 버튼의 정중앙에 위치하고 있기 때문입니다. Pivot의 위치를 변경하면 그 지점을 기준으로 회전과 확대/축소가 됩니다.

 

Pivot 위치 변경

3. Position

Position 은 객체의 위치를 나타냅니다. 그런데 이 위치 값은 Anchor 와 Pivot 의 위치에 따라 달라집니다. 

Position의 (0, 0) 은 항상 Anchor 와 Pivot 이 일치하는 위치가 됩니다.

 

중학교 수학시간에 배운 4분면을 생각하시면 됩니다. Anchor 는 4분면의 원점(0, 0) 의 위치를 지정해 주는 것이고 객체의 Position 값을 (0, 0) 으로 했을 때 객체 영역 중 Pivot의 위치로 설정된 곳이 (0, 0) 에 놓이게 됩니다.

 

 

위의 그림을 보면 Anchor 와 Pivot 의 x 위치를 변경했을 때 Position (0, 0) 즉, 원점이 어떻게 이동 되었는지 확인할 수 있습니다.