[CommonUI] 위젯 위치가 이상하게 고정됨

김여울·2025년 11월 26일

내일배움캠프

목록 보기
122/139

📎 [CommonUI] UI 위젯이 화면에 안 뜨는 문제

위젯 뜨는 건 해결했지만 위젯 위치가 이상하다...

근데 이건 또 잘 된다..?

원인

  • PrimaryLayout의 Panel이 화면 전체를 안 쓰고 왼쪽에만 UI가 있음
    WBP_PrimaryLayout 내부의 루트 패널이나 Slot 설정이 전체 화면(FullScreen)으로 Stretch 되지 않은 상태

  • PrimaryLayout 자체는 AddToViewport() 됐음

  • 레이어(container)들이 화면 전체를 차지하도록 Anchors/Size 설정이 안 되어 있음

해결 : 레이어 컨테이너를 Canvas 패널 전체에 꽉 채우기

PrimaryLayout 구조:

CanvasPanel
    ├─ MainLayerContainer (WidgetStack)
    ├─ DialogLayerContainer
    ├─ OverlayLayerContainer
    └─ HUDLayerContainer

그리고 이 4개는 전부 Canvas Slot 안에서:

  • Anchors = 전체
  • Offsets = 0

이렇게 되어 있어야 화면 전체를 차지할 수 있음

1. 루트를 Canvas Panel로 바꾸기

현재는 WBP_PrimaryLayout의 루트가 Overlay라서 Anchors 옵션이 없는 게 정상

➡ Anchors는 Canvas Panel에서만 존재함
➡ Overlay / Border / VerticalBox / HorizontalBox 등은 Anchors가 없음

그래서 지금 레이어 컨테이너들이 화면 전체가 아닌 Overlay의 기본 크기만큼만 차지하는 것

Canvas Panel  ← anchors 가능함 (필수)
   ├─ MainLayerContainer
   ├─ DialogLayerContainer
   ├─ OverlayLayerContainer
   └─ HUDLayerContainer

Overlay Wrap With → Canvas Panel 선택

Overlay가 루트면
→ Overlay의 크기만큼만 위젯이 보임
→ 그래서 지금 메뉴 UI가 왼쪽 상단에 작게 나오는 거임


2. 모든 레이어 컨테이너를 Canvas Panel 아래로 이동

각 LayerContainer의 Slot 설정:

  • Anchors = 전체 화면
Min (0, 0)
Max (1, 1)
  • Offsets = 0,0,0,0
  • Alignment = 0.5, 0.5

이렇게 하면 각 레이어가 화면 전체를 차지하는 풀스크린 스택이 됨

패널 종류Anchors 가능?UI 레이어 루트로 적합?
Canvas Panel✔ 가능최적 (사용해야 함)
Overlay❌ 없음불가능
VerticalBox / HorizontalBox❌ 없음불가능
Border❌ 없음불가능
SizeBox❌ 없음불가능

겉으로 보기엔 “레이어 컨테이너는 FullScreen Anchors인데도 위젯이 왼쪽 상단에 붙는다”
→ 이건 100% "Slot 타입이 CanvasSlot이 아닌 OverlaySlot" 문제

LayerContainer들은 CanvasPanel의 직접 자식이 아니라
Overlay 밑에 있기 때문에 "CanvasSlot"이 아니라 "OverlaySlot"이라서 Anchors를 바꿀 수 없음

Anchors(앵커)는 CanvasPanel Slot 전용 기능이기 때문에
Overlay, VerticalBox, HorizontalBox 안에서는 절대 작동하지 않음
→ 그래서 아무리 Anchors를 잡아도 적용이 안 되고 위젯이 무조건 왼쪽 위 기준으로만 배치됨

해결 : CanvasPanel → LayerContainers 직속으로 이동

CommonUI가 LayerContainer를 생성하면,
그 위젯은 "AddWidget → CanvasPanelSlot 자동 생성"이라고 가정하고 있음

그래서 컨테이너가 전체화면을 차지해야 정상적인 포커스/입력/전환이 작동함

OverlaySlot은:

  • Anchors 없음
  • SizeToContent 기반
  • 고정된 Child Layout만 가능

그래서 FullScreen 안 됨!

Anchors = Full Screen

  • Minimum (0,0)
  • Maximum (1,1)

해결 완료~

0개의 댓글