지난시간에 몬스터와 플레이어간의 공격이 완성이 되었으니, 오늘은 몬스터의 체력상태를 나타내는 UI를 소개하겠습니다.
저는 UMG를 사용하여 만들었으며, UMG는 언리얼에서 제공하는 UI 제작 툴입니다. HUD, 메뉴, 인벤토리 등 다양한 인터페이스를 만들 수 있도록 도와주지요. UMG는 미리 만들어진 버튼, 체크박스, 슬라이더, 진행상황 바 등의 위젯들을 조립하서 UI를 만들 수 있습니다.
위 사진과 같이 플레이어가 공격하면 타켓팅된 몬스터의 HP를 보여주는데요,
이번 HUD를 띄우는데 있어서 C++코딩작업은 거의 없었고, 위젯 블루프린트를 사용하여 언리얼 엔진에서 제공되는 Progress Bar에 몬스터의 최대 HP와 현재 HP값이 전달될 수 있도록 연결작업 위주로 해주었습니다.
위젯을 추가하기전 C++에서 몬스터의 HP를 설정해주겠습니다.
HP는 몬스터와 플레이어가 공통적으로 가지고 있는 부분이기 때문에 JMonster 클래스에 추가하지 않고 JCharacter 클래스에 추가하겠습니다.
코드와 같이 설정해주고 GetCurrentHealth()와 GetMaxHealth()는 블루프린트에서 호출이 가능하도록 해야하기 때문에 BlueprintCallable로 지정해 주었습니다.
컴파일을 해주고 컴파일이 성공했다면, 다시 에디터로 돌아오겠습니다.
위젯을 추가하기전 C++에서 몬스터의 HP를 설정해주겠습니다.
HP는 몬스터와 플레이어가 공통적으로 가지고 있는 부분이기 때문에 JMonster 클래스에 추가하지 않고 JCharacter 클래스에 추가하겠습니다.
1
2
3
4
5
6
7
8
9
10
11
|
//JCharacter.h
public:
UFUNCTION(BlueprintCallable, Category = "State")
float GetCurrentHealth();
UFUNCTION(BlueprintCallable, Category = "State")
float GetMaxHealth();
private:
float fHealth;
float fCurrentHealth;
| cs |
컴파일을 해주고 컴파일이 성공했다면, 다시 에디터로 돌아오겠습니다.
언리얼 엔진 에디터에서 위젯 블루프린트를 하나 생성해 줍니다.
User Interface > 위젯 블루프린트
User Interface > 위젯 블루프린트
그리고나서 추가된 위젯 블루프린트를 'TargetHP'라고 이름을 지어주었습니다. TargetHP를 열어보도록 하겠습니다.
TagetHP를 열면 창이 하나 열리게 되는데요, 왼쪽을 보시면 팔레트라고 있습니다. 팔레트안에 일반 > Progress Bar를 드래그해서 화면에 배치해줍니다.
화면에 놓여진 프로그레스바의 위치와 크기를 조정하고 몬스터의 HP bar로 사용될 프로그레스바에 몬스터의 HP값이 적용될 수 있도록 바인딩해보겠습니다.
화면의 오른쪽에 디테일탭을 보면 Progress영역에 Percent옆에 바인드라고 써있는 버튼을 누르면 '+바인딩 생성'이라는 버튼이 나타나게됩니다. 바인딩 생성을 클릭하면!
원래는 'Get Percent0', '반환 노드' 두개의 노드가 있는 창이 생성이됩니다.
Get Player Charater 노드를 추가하여 JPlayer에 형변환 노드를 추가합니다.
타겟된 몬스터의 정보는 JPlayer가 가지고있기 때문이지요,
형변환된 JPlayer노드에서 Get Target으로 몬스터 정보를 얻어온수
최대 HP 수치랑, 현재 HP 수치를 받아옵니다.
몬스터의 HP 수치도 연결되었고 이제 데미지를 입었을 때 HP의 상태량을 확인해보겠습니다. 그전에 먼저, 게임모드를 새로 추가하고, 제가 추가한 몬스터 HP바 HUD도 새로운 게임모드에 설정한 후, 추가한 게임모드로 현재 레벨에 지정해보겠습니다.
( 게임모드(Game Mode)는 디폴트 Pawn클래스, HUD 클래스, PlayerController클래스와 더불어 게임플레이 동작 등을 설정합니다. 게임모드를 새로 만드는 이유는 레벨 및 월드마다 혹은 프로젝트마다 다른 규칙과 그에 맞는 인터페이스 등 룰에 맞게 보여주기 위해서이기도 하지요.)
AGameMode를 상속받은 AJGameMode 클래스를 추가해주었습니다. 이제 이 게임모드에
Get Player Charater 노드를 추가하여 JPlayer에 형변환 노드를 추가합니다.
타겟된 몬스터의 정보는 JPlayer가 가지고있기 때문이지요,
형변환된 JPlayer노드에서 Get Target으로 몬스터 정보를 얻어온수
최대 HP 수치랑, 현재 HP 수치를 받아옵니다.
몬스터의 HP 수치도 연결되었고 이제 데미지를 입었을 때 HP의 상태량을 확인해보겠습니다. 그전에 먼저, 게임모드를 새로 추가하고, 제가 추가한 몬스터 HP바 HUD도 새로운 게임모드에 설정한 후, 추가한 게임모드로 현재 레벨에 지정해보겠습니다.
( 게임모드(Game Mode)는 디폴트 Pawn클래스, HUD 클래스, PlayerController클래스와 더불어 게임플레이 동작 등을 설정합니다. 게임모드를 새로 만드는 이유는 레벨 및 월드마다 혹은 프로젝트마다 다른 규칙과 그에 맞는 인터페이스 등 룰에 맞게 보여주기 위해서이기도 하지요.)
1
2
3
|
UCLASS()
class JOYLAND_API AJGameMode : public AGameMode
| cs |
DefaultPawnClass와 HUDWidget Class를 추가하겠습니다.
1
2
3
4
5
6
|
//JGameMode.h
UPROPERTY(EditDefaultsOnly, BlueprintReadWrite, Category="Widget", Meta = (BlueprintProtected = "true") )
TSubclassOf<class UUserWidget> HUDWidgetClass;
UPROPERTY()
class UUserWidget* CurrentWidget;
| cs |
에디터에서 사용할 HUD클래스를 받아 HUDWidgetClass에 저장할 변수와 현재 월드에서 생성해서 보여주기 위핸 CurrentWidget 변수를 추가해주었습니다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
//JGameMode.cpp
void AJGameMode::BeginPlay()
{
Super::BeginPlay();
if (HUDWidgetClass != nullptr)
{
CurrentWidget = CreateWidget<UUserWidget>(GetWorld(), HUDWidgetClass);
if (CurrentWidget != nullptr)
{
CurrentWidget->AddToViewport();
}
}
| cs |
HUDWidgetClass는 에디터에서 변경이 가능한 메크로를 사용하여, 위에서 추가했던 HUD클래스를 에디터에서 지정해줄겁니다. 그러면 코드에서는 HUDWidgetClass의 데이터 여부를 판단하고 현재 월드에 생성하게 되지요.
정상적으로 생성이 되었다면 AddToViewPort()를 호출함으로써 화면에 보여지게 됩니다.
다시 에디터로 돌아와서 추가한 JGameMode를 DafaultGameMode로 지정해주겠습니다.
블루프린트 창을 꺼주시고, 프로젝트 셋팅에서 '맵&모드'로 가시면 Default GameMode를 지정해주는 부분이 있으실겁니다. 그럼 클릭하시면 저희가 추가했던 JGameMode_BP가 나오실꺼고, JGameMode_BP로 지정해주시면 Default GameMode로 설정이 된답니다.
그러면 저희가 추가한 게임모드로 현재 게임에 적용이 되고 게임을 실행했을 때 위에서 추가했던 HUD가 보이게 된답니다!
이번시간에는 UI가 어떻게 띄워지고 컨트롤되는지에 대해서 간단히 알아보기위해 만들어보았는데 다음에는 C++로 UI를 생성하고 띄워보는 작업을 진행해보도록 하겠습니다.
