[언리얼엔진] 4-1. UI 위젯 설계와 실시간 데이터 연동

HUD (Heads-Up Display)

---

게임 상황을 이해하는데 도움이 되는 정보를 화면 상에 띄우는 기능을 제공

 

언리얼에서는 대표적으로 Canvas 기반 HUD와 UMG 방법이 존재한다.

Canvas 기반 HUD는 HUD Class를 상속해서 구현하는 방법으로 구방식에 해당하고, 요즘에는 UMG 방법을 채택한다고 한다.

---

 

UMG (Unreal Motion Graphics)

---

생성하는 방법

---

플랫폼별 호환 확인

 

해당 Screen Size 메뉴를 통해 각 화면별로 UI의 짤림 현상이 있는지 확인할 수 있다.

---

UI 바인딩

 

바인딩하고자 하는 UI를 클릭한 후 Content를 살펴보면 버튼이 하나 존재한다. 해당 버튼을 클릭하여 노드 기반 방식으로 바인딩을 할 수 있다.

하지만 노드 기반 바인딩에는 단점이 있는데, Tick 함수 기반으로 동작을 하기때문에 부하가 심하다는 것이다.

따라서, 부하를 방지하고자 UI를 최신화해줘야 할 때에만 함수를 호출할 수 있도록 C++ 코드 기반으로 구현하는 것이 적합하다.

---

C++ 코드 기반 바인딩

 

시작전 반드시 .Build.cs 파일에 "UMG"를 추가해주도록 하자.

PublicDependencyModuleNames.AddRange(new string[]
{
	"Core", 
	"CoreUObject", 
	"Engine", 
	"InputCore", 
	"EnhancedInput",
	"UMG"
});

//.h
UPROPERTY(EditAnywhere, BlueprintReadWrite, Category = "HUD")
TSubclassOf<UUserWidget> HUDWidgetClass;

UPROPERTY(EditAnywhere, BlueprintReadWrite, Category = "HUD")
UUserWidget* HUDWidgetInstance;
	
UFUNCTION(BlueprintCallable, Category = "HUD")
UUserWidget* GetHUDWidget() const;

//.cpp
if (HUDWidgetClass)
{
	HUDWidgetInstance = CreateWidget<UUserWidget>(this, HUDWidgetClass);
	if (HUDWidgetInstance)
	{
		HUDWidgetInstance->AddToViewport();	
	}
}

ASpartaGameState* SpartaGameState = GetWorld() ? GetWorld()->GetGameState<ASpartaGameState>() : nullptr;
if (SpartaGameState)
{
	SpartaGameState->UpdateHUD();
}

if (UUserWidget* HUDWidget = SparataController->GetHUDWidget())
{
	if (UTextBlock* TimeText = Cast<UTextBlock>(HUDWidget->GetWidgetFromName((TEXT("Time")))))
	{
		float RemainingTime = GetWorldTimerManager().GetTimerRemaining(LevelTimerHandle);
		TimeText->SetText(FText::FromString(FString::Printf(TEXT("Time : %.1f"), RemainingTime)));
	}

	if (UTextBlock* ScoreText = Cast<UTextBlock>(HUDWidget->GetWidgetFromName((TEXT("Score")))))
	{
		if (UGameInstance* GameInstance = GetGameInstance())
		{
			USpartaGameInstance* SpartaGameInstance = Cast<USpartaGameInstance>(GameInstance);
			if (SpartaGameInstance)
			{
				ScoreText->SetText(FText::FromString(FString::Printf(TEXT("Score : %d"), SpartaGameInstance->TotalScore)));
			}
		}
	}

	if (UTextBlock* LevelIndex = Cast<UTextBlock>(HUDWidget->GetWidgetFromName((TEXT("Level")))))
	{
		if (UGameInstance* GameInstance = GetGameInstance())
		{
			LevelIndex->SetText(FText::FromString(FString::Printf(TEXT("Level : %d"), CurrentLevelIndex+1)));
		}
	}
}

 

 

SpartaController에서 선언했던 HUDWidget을 받아온 후, HUDWidget->GetWidgetFromName((TEXT("위젯이름"))으로 해당 UI를 가져온다.

이후, SetText 메서드로 해당 UI의 필드를 채워주면 된다.

---

 

느낀 점

---

제가 직접 작성한 코드가 아니라, 튜터님께서 작성하신 코드를 보고 따라 입력하는 코드여서 그런지 눈에 안 읽히네요.

직접 팀프로젝트를 진행하면서 이것저것 적용해보며 제것으로 만드는 과정이 필요할 듯 합니다 !