GameplayAbilitySystem을 이용한 RPG 프로젝트 - (10) Overlay Widget과 HUD

이번에는 기존에 만든 Wiget 블루 프린트를 상속받아 체력과 마나를 나타내는 위젯을 만들고

그 위젯을 Overlay Widget에 담고 최종적으로는 HUD를 통해 화면에 연출하겠습니다.

 

 

위와 같이 기존의 Widget 블루 프린트에서 2개의 자식 WBP를 만들었습니다.

이제 이 2개의 위젯을 배치한 Overlay Widget으로 가보겠습니다.

 

 

WBP_Overlay는 기존에 만든 WBP들과는 다르게 Canvas Panel을 사용합니다.

Canvas Panel은 기존에 사용하던 Box에 비해서는 사용비용이 비싸지만

보여지는 시야 전체를 표현할 때는 편리하게 사용이 가능합니다.

 

이제 이 WBP_Overlay를 화면에 표시하기 위한 HUD 클래스를 만들겠습니다.

1) Head Up Display를 표현하는 AuraHUD

#pragma once

#include "CoreMinimal.h"
#include "GameFramework/HUD.h"
#include "AuraHUD.generated.h"

class UAuraUserWidget;

/**
 * 
 */
UCLASS()
class AURA_API AAuraHUD : public AHUD
{
	GENERATED_BODY()
	
public:
	UPROPERTY()
	TObjectPtr<UAuraUserWidget> OverlayWidget;

protected:
	virtual void BeginPlay() override;

private:
	UPROPERTY(EditAnywhere)
	TSubclassOf<UAuraUserWidget> OverlayWidgetClass;
};

 

프로젝트에서 모든 위젯은 UAuraUserWidget으로부터 상속되어 만들어집니다.

따라서 위와 같이 구성하였고, BeginPlay 함수에서는 기본적으로 보여질 UI를 세팅하겠습니다.

 

#include "UI/HUD/AuraHUD.h"
#include "UnrealWidgetFwd.h"
#include "UI/Widgets/AuraUserWidget.h"

void AAuraHUD::BeginPlay()
{
	Super::BeginPlay();

	UUserWidget* Widget = CreateWidget<UUserWidget>(GetWorld(), OverlayWidgetClass);
	Widget->AddToViewport();
}

 

BeginPlay 함수에서는 지역변수 Widget을 설정합니다.

이때 블루 프린트에서 설정된 OverlayWidgetClass로 Widget을 설정합니다.

설정한 Wdiget은 AddToViewport 함수를 통해 뷰포트에서 보여집니다.

이제 AuraHUD를 GameMode에서 설정하겠습니다.

 

먼저 AuraHUD를 상속받은 블루 프린트를 만들고 OverlayWidgetClass를 설정합니다.

 

이후 GameMode에서 HUD를 설정하겠습니다.

 

실행하면 다음과 같이 화면이 나타납니다.