28-5. 로드 메뉴 UI - (3) MVVM - 뷰 모델 구성

1. MVVM 모델 기반 구성

(1) 뷰(View)의 부모가 되는 블루프린트 클래스 생성

AuraWidget의 역할을 하는 블루프린트 클래스를 생성한다.

이 위젯은 LoadScreenWidget C++ 클래스를 상속받는다.

앞으로 로드 메뉴의 위젯들은 WBP_LoadScreenWidget_Base을 상속받아 C++에서 구현한 기능을 사용하게 된다.

 

 

(2) 로드 메뉴의 위젯들의 부모를 WBP_LoadScreenWidget_Base로 교체

 

 

2. HUD에서 위젯 생성 후 뷰 포트에 추가

(1) LoadScreenHUD 클래스

#pragma once

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

class ULoadScreenWidget;

UCLASS()
class AURA_API ALoadScreenHUD : public AHUD
{
	GENERATED_BODY()
	
public:

	UPROPERTY(EditDefaultsOnly)
	TSubclassOf<UUserWidget> LoadScreenWidgetClass;

	UPROPERTY(BlueprintReadOnly)
	TObjectPtr<ULoadScreenWidget> LoadScreenWidget;

protected:
	virtual void BeginPlay() override;
};

#include "UI/HUD/LoadScreenHUD.h"
#include "Blueprint/UserWidget.h"
#include "UI/Widget/LoadScreenWidget.h"

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

	LoadScreenWidget = CreateWidget<ULoadScreenWidget>(GetWorld(), LoadScreenWidgetClass);
	LoadScreenWidget->AddToViewport();
}

로드 메뉴를 HUD에서 생성하고 뷰포트에 추가한다.

 

 

(2) BP_LoadScreenHUD에서 Load Screen Widget Class 지정

 

 

3. 뷰 모델 적용

(1) LoadScreenHUD에서 뷰 모델 생성 및 지정

UCLASS()
class AURA_API ALoadScreenHUD : public AHUD
{
	GENERATED_BODY()
	
public:
	// MVVM - 뷰(View)
	UPROPERTY(EditDefaultsOnly)
	TSubclassOf<UUserWidget> LoadScreenWidgetClass;

	UPROPERTY(BlueprintReadOnly)
	TObjectPtr<ULoadScreenWidget> LoadScreenWidget;

	// MVVM - 뷰 모델(ViewModel)
	UPROPERTY(EditDefaultsOnly)
	TSubclassOf<UMVVM_LoadScreen> LoadScreenViewModelClass;

	UPROPERTY(BlueprintReadOnly)
	TObjectPtr<UMVVM_LoadScreen> LoadScreenViewModel;
protected:
	virtual void BeginPlay() override;
};

#include "UI/HUD/LoadScreenHUD.h"
#include "Blueprint/UserWidget.h"
#include "UI/ViewModel/MVVM_LoadScreen.h"
#include "UI/Widget/LoadScreenWidget.h"

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

	// 뷰 모델 생성
	LoadScreenViewModel = NewObject<UMVVM_LoadScreen>(this, LoadScreenViewModelClass);

	// 뷰 생성
	LoadScreenWidget = CreateWidget<ULoadScreenWidget>(GetWorld(), LoadScreenWidgetClass);
	LoadScreenWidget->AddToViewport();
}

 

 

(2) MVVM_LoadScreen을 부모로 하는 BP_LoadScreenViewModel 블루프린트 클래스 생성

클래스 디폴트가 비어있고, 이벤트 그래프가 비어있는 블루프린트 클래스가 생성된다.

 

 

(3) BP_LoadScreenHUD에서 Load Screen View Model Class 지정

 

 

(4) 디자이너 패널에서 창 - 뷰모델 활성화

 

 

(5) 뷰 모델 패널 - UE 5.2 버전 기준

- 생성 타입(Creation Type) : 뷰 모델의 생성 방식을 설정한다.

1. 수동(Manual) : 뷰 모델을 뷰에서 나중에 수동으로 등록함

2. 인스턴스 생성(Create Instance) : 위젯 생성 시 뷰 모델의 인스턴스를 생성

3. 글로벌 뷰 모델 컬렉션(Global View Model Collection) : MVVMSubSystem에서 뷰 모델들을 관리하며 여기에 추가함

4. 속성 경로(Property Path) : 뷰 모델을 찾는 함수를 만들고, 해당 함수 이름을 적어서 뷰 모델을 찾게 함

---

- UE 5.3 버전부터 뷰 모델 플러그인의 변화가 있다.

---

 

(5-1) WBP_LoadScreenWidget_Base에서 뷰 모델 찾기 함수 생성

플레이어 컨트롤러에서 LoadScreenHUD를 가져오고 거기에서 뷰 모델인 LoadScreenViewModel를 가져와 BP 버전으로 캐스팅 한 후 반환하는 함수이다.

 

 

(5-2) WBP_LoadScreen(WBP_LoadMenu의 이름이 변경됨)에서 뷰모델 찾기

View Model Property Path에서 뷰 모델을 찾기 위한 함수의 이름을 적어준다.

 

---

- 컴파일 에러가 발생하면 해당 함수의 디테일 패널에서 Const를 true로 지정한다.

---

정상적으로 뷰 모델을 찾게 되면 Getter로 꺼내올 수 있게 된다.