[20260527] Unity 정리 ( UI Canvas )

1. Canvas란

- Canvas는 Unity UI가 배치되고 렌더링이 되는 영역이다.

- Image, Text, Button, Panel, Scroll View 등등.. 다양한 UI 요소는 기본적으로 Canvas 아래에 배치된다.

- UI는 일반 Transform이 아니라 RectTransform을 사용한다

※ UI는 단순히 화면에 렌더링을 해주는 기능이 아닌, 해상도 대응, 입력 처리, 배치 기준을 함께 고려해서 처리해야 한다.

---

2. Canvas Render Mode

- Canvas에는 대표적으로 3가지 렌더링 방식이 있다.

① Screen Space - Overlay

- 카메라와 상관없이 화면 위에 UI를 바로 렌더링하는 방식이다.

- 일반적인 HUD, 체력바, 메뉴 UI에서 많이 사용되는 기법이다.

 

② Screen Space - Camera

- 특정 카메라를 기준으로 UI를 렌더링한다.

- 카메라 거리, 정렬 순서, 후처리 영향 등을 고려할 때 사용한다.

 

③ World Space

- UI가 3D 월드 안의 오브젝트 처럼 존재하게 만든다.

- 캐릭터 머리 위의 체력바, 상호작용 안내 UI, 월드 공간 버튼 등에 사용할 수 있다.

- World Space는 화면에 고정되는 UI가 아니다. 그래서 카메라 위치, 거리, 회전에 따라 보이는 크기와 위치가 달라질 수 있다.

---

3. Canvas Scaler

- Canvas Scaler는 화면 크기나 해상도에 따라 UI 크기를 어떻게 조절할지 정하는 컴포넌트다.

① Constant Pixel Size

- UI를 동일한 픽셀 크기로 유지한다.

- 해상도가 바뀌어도 UI 요소의 픽셀 크기는 유지된다.

 

② Scale With Screen Size

- 기준 해상도를 정하고, 화면 크기에 맞춰, UI를 비율로 저장한다.

- 해상도 대응이 필요한 일반적인 게임 UI에서 자주 사용한다.

 

③ Constant Physical Size

- 실제 물리적 크기를 기준으로 UI 크기를 유지한다.

- 아직은 어디에 써야 할지 잘 와닿지가 않는다. (나중에 기회가 되면 써봐야 할 것 같다.)

---

4. EventSystem

• EventSystem은 UI 입력을 처리하는 역할을 한다. (Canvas 만들면 같이 만들어진다.)
• 버튼 클릭, 드래그, 포인터 진입/이탈 같은 이벤트 처리를 담당한다.

※ 예를 들어, Button 클릭할 수 있는 것도 EventSystem이 입력을 받아 UI 요소에 전달하기 때문이다.

---

5. RectTransform

- UI 오브젝트는 일반 Transform 대신 RectTransform을 사용한다.

- RectTransform은 UI의 위치, 크기, Anchor, Pivot을 관리한다.

- Image, Text, Panel 같은 UI 요소에서 확인할 수 있다.

---

6. Pivot

- Pivot은 UI 자기 자신의 기준점이다.

- 회전, 크기 변경, 위치 계산의 중심이 된다.

- 예를 들어 Pivot이 중앙 이면 UI는 중앙을 기준으로 커지고, Pivot이 왼쪽 아래면 왼쪽 아래를 기준으로 크기가 변한다.

---

7. Anchor

- Anchor는 부모 RectTransform 안에서 UI가 붙는 기준 위치다.

- 화면 크기나 부모 UI 크기가 바뀔 때, 어디를 기준으로 위치를 유지할지 결정한다.

- 예를 들어, 체력바를 왼쪽 위에 고정하고 싶다면, Anchor를 왼쪽 위로 잡는 방식이 적합하다.

---

8. Anchor Preset

- Anchor Preset을 조정할 때 Alt와 Shift를 함께 사용할 수 있다.

- 각각의 기능은 아래와 같다.

- Alt : Anchor를 바꾸면서 Position도 같이 맞춘다.
- Shift : Anchor를 바꾸면서 Pivot도 같이 맞춘다.
- Alt + Shift : Anchor, Position, Pivot을 함께 맞춘다.

- 그래서 UI 기준점을 빠르게 맞출 때 Alt + Shift를 같이 사용한다.

---

9. 정리

- Canvas는 UI가 배치되고 렌더링되는 기준 영역이다.

- Canvas Scaler는 해상도 변화에 따라 UI 크기를 어떻게 조절할지 정한다.

- EventSystem은 UI 입력을 처리한다.

- UI는 일반 Transform이 아니라 RectTransform을 사용한다.

- Pivot은 UI 자기 자신의 기준점이다.

- Anchor는 부모 RectTransform을 기준으로 UI가 붙는 위치다.

- 해상도 대응 UI를 만들려면 Canvas Scaler, Anchor, Pivot을 함께 이해해야 한다.