본문 바로가기

[Unity3D] 렉트 트랜스폼(Rect Transform)

·
2019. 10. 15. 17:26
반응형

렉트 트랜스폼(Rect Transform)

렉트 트랜스폼은 UI에서 사용되는 Transform입니다.

렉트 트랜스폼에는 Width, Height, Anchors, Pivot의 속성을 가지고 있습니다.

 

Width : UI의 넓이를 나타냅니다.

Height : UI의 폭을 나타냅니다.

 

앵커(Anchors)

앵커는 씬뷰에서 네게의 삼각형 손잡이 모습으로 표시되며, 부모로부터의 기준을 나타냅니다.

스크린이 리사이징(Resizing)될 때 앵커를 기준으로 UI의 위치, 크기가 변경됩니다.

앵커의 x, y는 0 ~ 1 사이의 비율 값으로 설정됩니다.

앵커의 x값은 0일때 부모의 가장 좌측, 1일때 부모의 가장 우측으로 설정됩니다.

앵커의 y값은 0일때 부모의 가장 하단, 1일때 부모의 가장 상단으로 설정됩니다.

 

다음은 부모 UI가 리사이징(Resizing)될 때의 예제를 보여줍니다.

앵커가 Min (0, 1), Max (0, 1)일 경우
앵커가 Min (0.5, 0.5), Max (0.5, 0.5)일 경우

 

비율에 따라 UI의 크기와 위치를 변경하고 싶은 경우에는 앵커를 원하는 비율로 위치시키면 됩니다.

다음은 앵커의 비율을 설정 한 후 부모 UI가 리사이징(Resizing)될 때의 예제를 보여줍니다

앵커가 Min (0,299, 1), Max (0.702, 1)일 경우

 

앵커 프리셋(Anchors Preset)

앵커 프리셋은 자주 사용하는 앵커를 미리 정의해 놓은 것입니다.

앵커 프리셋을 클릭하면 앵커를 변경할 수 있습니다.

 

Shift를 누르고 앵커 프리셋 클릭 : 앵커와 피벗을 해당 위치로 변경

Alt를 누르고 앵커 프리셋 클릭 : 앵커와 오브젝트를 해당 위치로 변경

Shift, Alt를 누르고 앵커 프리셋 클릭 : 앵커와 피벗, 오브젝트를 해당 위치로 변경

 

피벗(Pivot)

피벗은 UI의 중심을 나타냅니다.

피벗을 기준으로 UI의 위치, 크기, 회전이 변경됩니다.

피벗의 x, y는 앵커와 마찬가지로 0 ~ 1 사이의 비율 값으로 설정됩니다.

피벗의 x값은 0일때 오브젝트의 가장 좌측, 1일때 오브젝트의 가장 우측으로 설정됩니다.

피벗의 y값은 0일때 오브젝트의 가장 하단, 1일때 오브젝트의 가장 상단으로 설정됩니다.

 

다음은 피벗 값에 따라 UI의 크기, 회전이 변경될 때를 보여줍니다.

피벗이 (0.5, 0.5)일 경우
피벗이 (0, 0.5)일 경우

 

참고
 

기본 레이아웃 - Unity 매뉴얼

이 섹션에서는 UI 요소를 서로 간 비교하거나 캔버스와 비교하여 배치하는 방법에 대해 설명합니다. GameObject -> UI -> Image 메뉴에서 이미지를 생성하고 섹션을 참고하여 직접 테스트해 볼 수 있습니다.

docs.unity3d.com

 

반응형
블로그 이미지
Frontend Engineer

댓글