1. 개요
이 글에서는 언리얼 엔진에서 체력(Health) 및 마나(Mana) 상태를 구체(Globe) 형태로 시각화하는 Globe Progress Bar 위젯을 구현하는 방법을 설명합니다. 이 위젯은 상속 구조를 활용하여 효율적으로 확장할 수 있도록 설계되었습니다.
2. 위젯 구성 요소 및 역할
1. Size Box (크기 박스)
역할: 위젯의 크기를 고정하거나 조절할 수 있는 컨테이너 역할을 합니다.
세부 기능:
● 크기 오버라이드(Override): Width와 Height를 변수로 설정하여 크기를 유동적으로 변경할 수 있습니다.
● 루트 컨테이너: 다른 위젯 요소들의 최상위 컨테이너로 사용됩니다.
예시: 체력 구체(Health Globe)의 크기를 조정할 때 250x250 또는 다른 크기로 설정할 수 있도록 설정
2. Overlay (오버레이)
역할: 여러 위젯을 겹쳐서(Stacking) 배치할 수 있는 레이아웃 관리 도구입니다.
세부 기능:
● 겹쳐진 요소들이 서로 독립적으로 관리되며 위치와 정렬을 조정할 수 있습니다.
● 배경, 진행률 표시줄, 유리 효과 등을 각각 개별적으로 배치할 수 있도록 도와줍니다.
예시: 배경 이미지 위에 진행률 표시줄(Progress Bar)을 겹치고, 그 위에 유리 효과(Glass Effect)를 추가하는 구조.
3. Image (이미지)
역할: 위젯에서 시각적 요소(텍스처, 브러시 등)를 표시하는 기능을 수행합니다.
세부 기능
● 배경 이미지: Globe Ring 텍스처로 구체의 프레임(테두리) 역할
● 유리 효과: Empty Globe Material 로 반짝이는 유리 느낌의 시각적 효과를 추가
예시: 체력 구체의 테두리 이미지와 유리 반사 효과를 각각 추가하여 디자인을 향상
- Progress Bar (진행률 표시줄)
역할: 데이터의 진행 상태(예: 체력 또는 마나의 비율)를 시각적으로 표현하는 역할을 합니다.
세부 기능:
● 스타일 변경: 체력은 빨간색, 마나는 파란색 등 재질(Material)을 오버라이드할 수 있음
● 채우기 방향: 아래에서 위로 채워지는 방식으로 설정하여 구체 형태의 움직임 구현
● 변수화: 진행률 표시줄의 이미지(Material)를 변수로 설정하여 자식 클래스에서 변경 가능
예시: 체력이 50%로 줄어들면, 구체가 반쯤 비어있는 것처럼 보임
5. Variables (변수)
역할: 위젯의 속성(크기, 색상, 이미지 등)을 설정하고, 필요시 자식 위젯에서 값을 재정의(Override)할 수 있도록 함
세부 기능:
● BoxWidth/BoxHeight: 위젯의 크기를 설정하는 변수.
● BackgroundBrush/GlassBrush: 이미지 재질(Material)을 변수로 설정하여 변경 가능.
● Padding: 각 요소의 여백(Spacing)을 설정하여 레이아웃 조정.
예시: 체력 구체는 빨간색, 마나 구체는 파란색으로 변경할 수 있도록 이미지(Material)를 변수로 관리.
- Event Pre Construct (이벤트 프리 컨스트럭트)
역할: 위젯이 게임에서 생성되기 전에 초기 설정값을 적용하는 이벤트입니다.
세부 기능
● 변수 값이 변경되면 즉시 UI에 반영되도록 설정
● 위젯의 기본 상태(크기, 스타일 등)를 초기화
예시: 디자이너 탭에서 크기(Width/Height) 또는 이미지(Material)를 변경하면, 변경 사항이 즉시 표시됨
