📝

[UE5]GASメモ5 -Attributeの変更をUIに反映しよう- 準備編

2024/06/22に公開

GAS

UE5

gameplayabilitysys

tech

前回の記事

更新情報

更新日	内容

前置き

読み飽きた方は飛ばしてください

この記事ではC++を使用します。
解説を挟みますが、ある程度わかる人向けです

また、現在個人製作中のゲーム"KillGurality"のプロジェクトを用いて記事を書いているので、プロジェクト名を使用するプレフィックスなどには"KG"を使用しています。
ソースコードをコピペする場合は、環境に合わせて置き換えてください。

環境
バージョン：UE5.2
エディタ：VSCode

C＋＋プロジェクトの作り方や勉強は、こちらの記事を参考にしてください
とてもわかりやすく、無料パートだけでも参考になるかと思います。おすすめです

VSCodeを使っている方は、この設定をしておくと便利です。

ここではウィジェットを使用するための準備を行っていきます。
長くなるので、Attributeの値を変更する実装は次回に分けます

構成

alt text
今回は複数のウィジェットを使用することを想定し、それらを管理するウィジェットコントローラを使用します。ウィジェットの数が増えてくると、ウィジェットがデータにアクセスする回数が増えて処理が煩雑になってしまいます。ここにウィジェットコントローラを挟むことで、参照を減らしたり、管理が容易になるというメリットがあります。

実装

UserWidget,WidgetControllerの作成

UserWidgetを継承してカスタムUserWidgetクラスを作成します。
私はパスをPublic/UI/Widgetにしました。コピペの際はincludeパスに気をつけてください。

alt text

ソースコードは以下の通りです。

UserWidget.h

#pragma once

#include "CoreMinimal.h"
#include "Blueprint/UserWidget.h"
#include "KGUserWidget.generated.h"


UCLASS()
class KILLGURALITY_API UKGUserWidget : public UUserWidget
{
	GENERATED_BODY()
	
public:
	UFUNCTION(BlueprintCallable)
	void SetWidgetController(UObject* InWidgetController);

	UPROPERTY(BlueprintReadOnly)
	TObjectPtr<UObject> WidgetController;

protected:
	UFUNCTION(BlueprintImplementableEvent)
	void WidgetControllerSet();
};

UserWidget.cpp

#include "UI/Widget/KGUserWidget.h"

void UKGUserWidget::SetWidgetController(UObject* InWidgetController)
{
	WidgetController = InWidgetController;
  WidgetControllerSet();
}

WidgetControllerSetは、後でブループリント側でイベントの内容を作成します。

同様に、Objectクラスを継承してWidgetControllerを作成します
パスはPublic/UI/WidgetControllerです

alt text

ソースコードは以下の通りです。

WidgetController.h

#pragma once

#include "CoreMinimal.h"
#include "UObject/NoExportTypes.h"
#include "KGWidgetController.generated.h"

class UAttributeSet;
class UAbilitySystemComponent;


UCLASS()
class KILLGURALITY_API UKGWidgetController : public UObject
{
	GENERATED_BODY()

protected:
	UPROPERTY(BlueprintReadOnly, Category = "WidgetController")
	TObjectPtr<APlayerController> PlayerController;

	UPROPERTY(BlueprintReadOnly, Category = "WidgetController")
	TObjectPtr<APlayerState> PlayerState;

	UPROPERTY(BlueprintReadOnly, Category = "WidgetController")
	TObjectPtr<UAbilitySystemComponent> AbilitySystemComponent;

	UPROPERTY(BlueprintReadOnly, Category = "WidgetController")
	TObjectPtr<UAttributeSet> AttributeSet;	
};

WidgetController.cpp

#include "UI/WidgetController/KGWidgetController.h"

ソースファイルは特に変更ありません。
ここで一度コンパイルしてください

HPバーを表示するBPの作成

先ほどC++で作成したカスタムUserWidgetを継承してブループリントを作成します。
alt text

名前はWBP_ProgressBarBaseにしました。
画像ではWBP_ProgressBarになってますがミスです

まずSizeBoxを配置します
alt text

見やすくするためスクリーンの表示を設定サイズに変更します。
IsVariable, WidthOverride, HeightOverrideにチェックを入れます。
alt text

画像のようにBPを組んでいきます。
float型の変数を2つ作成し、それぞれの初期値にいい感じの幅と高さの値を入れてください
alt text

デザイナーモードに戻り、SizeBoxの下にOverlay,ProgressBarを追加してください
ProgressBarの見た目をいい感じに変えてください
alt text

先ほど作成したWBPを継承し、HPバーを作成します
このWBPに対して特に変更はありません
alt text

C++で作ったカスタムUserWidgetを継承し、オーバーレイを作成します
alt text

root直下にCanvasPanelを追加します
alt text

Canvas内に先ほど作成したWBP_Healthを追加します
alt text

C++で、HUDクラスを継承してカスタムHUDを作成します。
ソースコードは以下の通りです。

HUD.h

#pragma once

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

class UKGUserWidget;

UCLASS()
class KILLGURALITY_API AKGHUD : public AHUD
{
	GENERATED_BODY()

public:
	UPROPERTY()
	TObjectPtr<UKGUserWidget> OverlayWidget;

protected:
	virtual void BeginPlay() override;

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

HUD.cpp

#include "UI/HUD/KGHUD.h"
#include "UI/Widget/KGUserWidget.h"

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

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