[Unity] UI의 Rect Transform

 

RectTransform이란?

• UI가 사용할 Transform
• 2D 공간에서 UI 요소의 위치, 크기, 앵커(Anchor), 피벗(Pivot) 등을 제어

Anchor (앵커)의 역할

• 부모 기준으로 UI 요소가 어떻게 위치하고 크기를 조정할지 결정
• stretch 조절을 통해 앵커를 변경할 수 있다.
• 앵커를 지정하면 부모의 크기가 변할때 앵커를 기준으로 같은 비율로 크기가 변하게 된다.
• 직접 앵커의 Min, Max 값을 조절하여 앵커를 조절할 수 있다.
• Min,Max값을 조절할때는 Min을 기준으로 Max를 대각선으로 가지는 사격형을 그러준다고 생각하면 편하다.

• stretch를 보면 부모의 크기화 동기화 하는 stretch인데 Anchors를 보면 Min과 Max의 값이 (0,0) , (1,1)임을 확인할 수 있다.

 

• 이는 Min(0,0)을 시작으로 Max(1,1)로 향하는 대각선을 가진 크기의 사각형이 되는것이다.
  이렇게 Min Max 값을 통해 원하는 앵커를 지정할 수 있다.

Pivot (피벗)의 역할

• UI 요소 내부에서 기준점이 되는 위치 (0~1)
• 회전, 스케일, 정렬 기준에 영향을 준다.
• 피벗이 0.5이면 중심축은 가운데를 의미한다.
• 예를 들어 앵커의 중심에서 100 Width를 가지는 UI를 그렸을때 피벗이 0.5라면 Pos X의 값은 0일 것이다.
• 중심점을 기준으로 50,50으로 나눠 100 Width를 그렸기 때문에 X축으로 이동을 하지 않는다.
• 하지만 피벗이 0이되면 왼쪽에서 오른쪽으로 100 Width를 그리기 때문에 가운데에 그려주기 위해서는 -50만큼 x축 이동이 필요하다

가운데 정렬을 위해 -50만큼 이동해야 가운데 정렬이 된다.

 

Position vs AnchoredPosition의 차이

• Position
  • 월드 좌표계 기준으로 오브젝트가 월드에 존재할 때 사용한다.
• AnchoredPosition
  • RectTransform의 위치 값으로 UI 상 위치를 나타낸다.
  • 지정한 Anchor를 기준으로 부모 안에서의 상대적 위치를 나타낸다.
  • Anchor 지점을 기준으로 얼만큼 떨어져 있는지를 나타내는 좌표.
  • UI가 화면상 같은 위치에 있어도 Anchor따라 AnchoredPosition 값이 달라질 수 있다.

처음에는 헷갈렸던 UI 좌표 개념이 Anchor와 Pivot의 역할을 분리하여 정리하니 명확하게 이해가되었다.

이후에 해상도 대응이나 회전 구현에 등 다양한 기능 제작에 활용해 볼 수 있을거 같다.