UI Canvas Scaler

박지예·2026년 6월 10일

공부2026

목록 보기
3/20

UI Canvas Scaler 란 ?

Canvas 에서 UI 요소의 크기를 다양한 해상도에 맞게 조정할 수 있다.

1. Constant Pixel Size

UI 요소가 픽셀 크기 그대로 유지 된다. 해상도가 달라져도 크기가 변하지 않는다.

세부요소는

  • Scale Factor - 모든 UI 요소에 일괄 적용할 배율
  • Reference Pixels Per Unit - 스프라이트 1유닛당 픽셀 수 기준 값

1080 x 1920 Portrait

아이패드 (1536 x 2048)

해상도가 바뀌어도 내부 이미지의 크기는 그대로인 걸 확인 할 수 있다.

해상도가 높아지면 UI 가 상대적으로 작아 보이는 문제가 있어서, 고정 해상도 환경이 아니면 잘 안쓴다.

2. Scale With Screen Size ✨


기준해상도를 설정하고, 실제 화면 크기에 맞게 UI를 자동으로 스케일링 한다.

  • ReferenceResolution - 기준이 되는 설계 해상도

  • Screen Match Mode - 기준 해상도와 실제 해상도 비율이 다를 때 처리 방식

  • Match Width Or Height - Width/Height 슬라이더로 기준 축을 결정

  • Expand - UI가 잘리지 않도록 더 큰 축 기준으로 확장

  • Shrink - UI가 화면을 넘지 않도록 더 작은 축 기준으로 축소


1080 x 1920 Portrait

아이패드 (1536 x 2048) Screen Match Mode 1 (Height)

아이패드 (1536 x 2048) Screen Match Mode 0 (Width)

2-1. Match Width Or Height 상세

어떤 축을 기준으로 스케일 배율을 계산하냐의 문제다.

배율 계산 원리
Canvas Scaler 는 결국 하나의 Scale 값을 구해서 전체 UI에 적용한다.

Scale = 실제 해상도 / 기준 해상도

그런데 종종 실제 해상도와 기준 해상도 가로 세로 비율이 다를 때 가 있다. 그럴때 어느 쪽을 최종 Scale 로 쓸지 정해야 한다.

Slider Value의 의미

1. Match = 0 (Width 기준)

가로 배율만 사용. UI 전체가 가로에 딱 맞게 들어간다.
UI의 세로가 잘리거나 여백이 생길 수 있다.

2. Match = 1 (Height 기준)

새로 배율만 사용. UI 전체가 세로에 딱 맞게 들어간다.
UI의 가로가 잘리거나 여백이 생길 수 있다.


기준 해상도로 만든 종이 UI를 , 크기가 다른 액자(실제화면)에 끼운다고 생각하면 쉽다.

실무에서는, 세로 모바일 게임에서는 Height(1) 쪽에 가깝게해서 세로를 살리고, 가로 모드 게임에서는 Width(0)에 가깝게 해서 가로를 살린다.

Constant Physical Size

물리적 실제 크기(mm, cm, inch) 를 기준으로 유지한다. DPI 정보를 활용한다.

  • Physical Unit - 기준 단위 선택
  • Fallback Screen DPI - DPI 정보를 못 읽을 때 사용할 기본 값
  • Default Sprite DPI - 스프라이트의 기본 DPI

실제 기기 크기에 맞는 버튼 등을 만들 때 유용하지만, 기기마다 DPI 정보가 부정확한 경우도 있다고 하니 주의가 필요해보인다.

실제로 사용해본적이 없다

profile
게임 클라이언트 개발자

0개의 댓글