23.07.03 ~ 2023.07.09 개발일지

추가한 부분

UI제작

체력바 추가

간단하게 ProgressBar를 통해 체력바를 만들어주었다

IFHpBarWidget.cpp

// Fill out your copyright notice in the Description page of Project Settings.


#include "UI/IFHpBarWidget.h"
#include "Components/ProgressBar.h"
#include "AI/IFEnemy.h"

UIFHpBarWidget::UIFHpBarWidget(const FObjectInitializer& ObjectInitializer) : Super(ObjectInitializer)
{
    MaxHp = 100;
    CurrentHp = 100;
}

void UIFHpBarWidget::InitializeHp(float InMaxHp)
{
    MaxHp = InMaxHp;
    CurrentHp = MaxHp;
    HpBar->SetPercent(CurrentHp / MaxHp);
}

void UIFHpBarWidget::UpdateHp(float InHealth)
{
    CurrentHp = InHealth;
    HpBar->SetPercent(CurrentHp / MaxHp);
}

바인딩은 UPROPERTY(meta = (BindWidget)) 를 통해 시켜주었으며, 적에게는 위젯 컴포넌트를 통해 그려주었고,

캐릭터는 HUD에 포함시키는 방식으로 체력바를 만들어주었다

IFEnemy.cpp

{
	...

	HpBarWidget = CreateDefaultSubobject<UWidgetComponent>(TEXT("HpBarWidget"));
	HpBarWidget->SetupAttachment(RootComponent);
	HpBarWidget->SetRelativeLocation(FVector(0.0f, 0.0f, 120.0f));

	static ConstructorHelpers::FClassFinder<UIFHpBarWidget>HpBarWidgetRef
	(TEXT("/Game/InFiniteFighter/Widget/Hp/HpBar.HpBar_C"));
	if (::IsValid(HpBarWidgetRef.Class))
	{
		HpBarWidget->SetWidgetClass(HpBarWidgetRef.Class);
		HpBarWidget->SetWidgetSpace(EWidgetSpace::Screen);
		HpBarWidget->SetDrawSize(FVector2D(180.0f, 15.0f));
		HpBarWidget->SetCollisionEnabled(ECollisionEnabled::NoCollision);
	}
    
    ...
    
}

---

처형 아이콘 표시

스턴 상태일때 처형 커맨드가 뜨도록 설정하였다

키보드 마우스 기준으로는 마우스 휠 버튼, 게임 패드 기준으로는 R3 버튼인데,

이를 Dynamic 하게 표현하고 싶었다(현재 내 입력장치를 판별해 자동으로 아이콘이 나오도록)

이를 위해 Common UI를 사용하였다 (링크)

내용이 많기 때문에 따로 정리해놓은 글이다

Common Action Widget 또한 위젯 컴포넌트를 통해 Enemy에서 불러오도록 선언해주었다

IFEnemy.cpp

{
	...

	ExecutionWidget = CreateDefaultSubobject<UWidgetComponent>(TEXT("ExecutionWidget"));
	ExecutionWidget->SetupAttachment(RootComponent);
	ExecutionWidget->SetRelativeLocation(FVector(30.0f, 0.0f, 30.0f));

	static ConstructorHelpers::FClassFinder<UCommonUserWidget>ExecutionWidgetRef
	(TEXT("/Game/InFiniteFighter/Widget/Game/Execution.Execution_C"));
	if (::IsValid(ExecutionWidgetRef.Class))
	{
		ExecutionWidget->SetWidgetClass(ExecutionWidgetRef.Class);
		ExecutionWidget->SetWidgetSpace(EWidgetSpace::Screen);
		ExecutionWidget->SetDrawSize(FVector2D(32.0f, 32.0f));
		ExecutionWidget->SetCollisionEnabled(ECollisionEnabled::NoCollision);
	}
    
    ...
    
}

R3키와 마우스 중간 클릭 키가 입력에 따라 Dynamic하게 바뀌는것을 볼 수 있다

---

도끼 주먹 아이콘 표시

본격적으로 HUD에 작업을 추가하였다

투명한 유리 모양 베이스에

도끼 아이콘과

주먹 아이콘을 겹쳐서 표현해주었다

겹쳐지게 표현될 수 있도록 Overlay를 활용해주었다

추가로 우측 상단에는 도끼를 던진 이후 Recall 버튼이 나오도록 Common Action Widget을 추가해주었다

---

HUD 완성시키기

마지막으로 여기에 원래 위젯 컴포넌트를 통해 불러오던 Aim 위젯을 HUD에 추가시켜주었고,

만들어둔 체력바, 주먹<->도끼 아이콘, 에임바가 알맞게 나오도록 배치해주었다

게임에서 배치되는 모습은 이러하다

(도끼의 발납 상태에 따라 아이콘이 바뀌는 모습)

(입력 받는 장치에 따라 키보드의 R, 게임패드의 Y 아이콘이 Dynamic 하게 나오게 된다)