26 - UMG. Start Screen, PlayerInfoBase Image

Overcle·2023년 3월 8일
0

학원

목록 보기
19/29

요약
1.

용어 설명
1.

Tip
1. UI Image를 렌더링 할 때 Draw Call을 조심해야한다.
1-1. 최적화하는 최적방법은 Draw Call을 줄이는 방법이다.
1-2. 그 때문에 나온 기법으로 아틀라스 기법이다.
1-3. 언리얼에서는 개별 이미지를 아틀라스로 변환 해주는 기능이 있다. (2019년부터 실험기능으로 남아있는 이상한 기능)

Start HUD


New Level 설정

새 레벨 > 빈 레벨 > "Start" 생성 및 저장

게임 시작 화면 설정.

1. 사용자 위젯 블루프린트 설정.

사용자 위젯 블루프린트로 "UI_StartHUD" 생성

Size는 Custom 1920 : 1080 으로 설정

크기박스 1920 : 1080 으로 설정

이미지는 BackGround으로 이름 변경, 이미지 설정

GmaeMode 설정

1. GameModeBase "StartGameMode" 생성.

StartGameMode.h 설정

#include "../GameInfo.h"
#include "GameFramework/GameModeBase.h"
#include "Blueprint/UserWidget.h"

#include "StartGameModeBase.generated.h"

/**
 * 
 */
UCLASS()
class UE11_API AStartGameModeBase : public AGameModeBase
{
	GENERATED_BODY()
	

private:
	TSubclassOf<UUserWidget>	m_StartHUDClass;
	UUserWidget*				m_StartHUD;

public:
	AStartGameModeBase();

public:
	virtual void BeginPlay() override;
	virtual void Tick(float DeltaTime) override;
};

StartGameMode.cpp 설정

AStartGameModeBase::AStartGameModeBase()
{
	ConstructorHelpers::FClassFinder<UUserWidget> Finder(TEXT("/Script/UMGEditor.WidgetBlueprint'/Game/Blueprints/IJH/UMG/UI_StartHUD.UI_StartHUD_C'"));

	if (Finder.Succeeded())
	{
		m_StartHUDClass = Finder.Class;
	}
}

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

	if (IsValid(m_StartHUDClass))
	{
		m_StartHUD = Cast<UUserWidget>(CreateWidget(GetWorld(), m_StartHUDClass));
		if (IsValid(m_StartHUD))
		{
			m_StartHUD->AddToViewport();
		}
	}
}

void AStartGameModeBase::Tick(float DeltaTime)
{
	Super::Tick(DeltaTime);
}

월드셋팅 게임 모드 설정

1. 게임모드 설정

기존 만들었던 GameMode를 부모 클래스로 지정해 블루 프린트 생성
이름은 : BPC_StartGameMode

그 후 위와 동일하게 게임모드 설정.
디폴트 폰 클래스는 None으로 설정.

Start,End 버튼 생성

버튼을 캔버스 패널 아래에 생성.
위치와 크기느 마음대로 설정.


노말, 호버, 눌림은 각각 평상시, 마우스 포커싱시, 눌렀을 시, 를 의미한다.
색조는 기존 리소스 색상에 해당 색소 값을 곱하여 이미지를 보여주니.
리소스 원본 그대로의 색상을 보여주고 싶으면 "1" 로 설정하면 된다.

버튼 실행 함수 c++로 구현

StartHUDBase.h

UCLASS()
class UE11_API UStartHUDBase : public UUserWidget
{
	GENERATED_BODY()

private:
	UButton* m_StartBtn;
	UButton* m_EndBtn;

	UPROPERTY(EditAnywhere, BlueprintReadWrite, meta = (AllowPrivateAccess = true))
	FName	m_NextLevelName;

public:
	virtual void NativeConstruct() override;
	virtual void NativeTick(const FGeometry& _geo, float _DeltaTime) override;

public:
	UFUNCTION()
	void OnStartBtnClicked();
	UFUNCTION()
		void OnStartBtnHover();
	UFUNCTION()
		void OnStartBtnUnhover();
	
};

StartHUDBase.cpp

oid UStartHUDBase::NativeConstruct()
{
	Super::NativeConstruct();

	m_StartBtn = Cast<UButton>(GetWidgetFromName(FName("StartButton")));
	m_EndBtn = Cast<UButton>(GetWidgetFromName(FName("EndButton")));

	m_StartBtn->OnClicked.AddDynamic(this, &UStartHUDBase::OnStartBtnClicked);
	m_StartBtn->OnHovered.AddDynamic(this, &UStartHUDBase::OnStartBtnHover);
	m_StartBtn->OnUnhovered.AddDynamic(this, &UStartHUDBase::OnStartBtnUnhover);


}

void UStartHUDBase::NativeTick(const FGeometry& _geo, float _DeltaTime)
{
	Super::NativeTick(_geo, _DeltaTime);
}

void UStartHUDBase::OnStartBtnClicked()
{
	if (!m_NextLevelName.IsNone())
	UGameplayStatics::OpenLevel(GetWorld(), m_NextLevelName);
}

void UStartHUDBase::OnStartBtnHover()
{
}

void UStartHUDBase::OnStartBtnUnhover()
{
}

버튼 실행 블루프린트로 구현

버튼 Animation C++ 구현

위젯 애니메이션은 블루프린트로 하는걸 권장.


우선 Start, End 각각 Hover, Unhover 애니메이션 총 4개 생성

Hover시 스케일 값을 1.0 > 1.2로
Unhover시 스케일 값을 1.2 > 1.0 로 변경 시간은 0.0초에서 0.25초

동일하게 설정해서 총 4개 생성.

언리얼에서는 UPROPERTY로 EditAnywhere로 해도 애니메이션이 등록이 안된다. 그래서 코드로 진행할꺼면. 까다롭다

1. 해당 HUD가 가지고있는 모든걸 탐색해야하는 알고리즘을 추가한다

1-1 저장할 배열 . TMAP 추가

[StartHUDBase.h]

private:
	TMap<FString, UWidgetAnimation*> m_mapWidgetAnim;

StartHUDBase.cpp

void UStartHUDBase::NativeConstruct()
{
	Super::NativeConstruct();

	m_StartBtn = Cast<UButton>(GetWidgetFromName(FName("StartButton")));
	m_EndBtn = Cast<UButton>(GetWidgetFromName(FName("EndButton")));

	// StartBtn에 클릭, 호버, 언호버 상황이 발생할 때 시킬 델리게이트 등록
	m_StartBtn->OnClicked.AddDynamic(this, &UStartHUDBase::OnStartBtnClicked);
	m_StartBtn->OnHovered.AddDynamic(this, &UStartHUDBase::OnStartBtnHover);
	m_StartBtn->OnUnhovered.AddDynamic(this, &UStartHUDBase::OnStartBtnUnhover);


	//StartHUD가 보유하고 있는 위젯 애니메이션 탐색.
	UWidgetBlueprintGeneratedClass* WidgetClass = GetWidgetTreeOwningClass();

	for (int32 i = 0; i < WidgetClass->Animations.Num(); ++i)
	{
		FString name = WidgetClass->Animations[i].GetName();
		m_mapWidgetAnim.Add(name, WidgetClass->Animations[i]);
	}

}
void UStartHUDBase::OnStartBtnHover()
{
	UWidgetAnimation* pAnim = m_mapWidgetAnim.FindRef(TEXT("StartButtonHoverAnim_INST"));
	if(IsValid(pAnim))
	PlayAnimation(pAnim);
}

void UStartHUDBase::OnStartBtnUnhover()
{
	UWidgetAnimation* pAnim = m_mapWidgetAnim.FindRef(TEXT("StartButtonUnhoverAnim_INST"));
	if (IsValid(pAnim))
	PlayAnimation(pAnim);
}

for문으로 전부 탐색해서 Tmap하는 방법이 아닌 바로 Bind하는 방법

StartHUDBase.h

//변수 이름을 애니메이션 이름과 동일하게 해야함.
UPROPERTY(meta = (BindWidgetAnim), Translate)
	UWidgetAnimation* StartButtonHoverAnim;

StartHUDBase.cpp

void UStartHUDBase::OnStartBtnHover()
{
	PlayAnimation(StartButtonHoverAnim);
	/*UWidgetAnimation* pAnim = m_mapWidgetAnim.FindRef(TEXT("StartButtonHoverAnim_INST"));
	if(IsValid(pAnim))
	PlayAnimation(pAnim);*/
}

아틀라스 스프라이트 기능 하는법




블루 프린트로 애니메이션 구현

1. 클릭시 게임종료, Hover, Unhover 애니메이션 구현

PlayerInfoBase 이미지 추가






새머터리얼 추가

PlayerInfoBase 이미지를 Mtrl로 교체

profile
게임 프로그래머 지망생의 발자취

0개의 댓글