UE4：来为我们的角色制作一个血条吧

HelloWorld杰少

发布于 2022-12-17 16:06:06

8130

发布于 2022-12-17 16:06:06

文章被收录于专栏：HelloWorld杰少

前言

角色扮演类的游戏免不了要给角色添加一个血条来显示当前角色的生命值，所以血条对于玩家来说也是一个非常重要的提示工具，今天就让我来带大家用 UE4 的进度条制作一个简单的血条吧！

正文

本文制作血条分为俩个部分，分别是通过蓝图来设计UMG，然后再通过 C++ 代码去实现血条生命值。

蓝图

打开我们的虚幻编辑器，然后右键选择 UserInterface->Widget Blueprint 来创建一个UI，取名 Health_Widget。

image

双击打开它，然后我这边血条用的是Progress Bar来实现，于是找到控件 Progress Bar，将其拖入到UI中，并调整大小。

image

然后为了测试我们的血条是有进度的，我在UI中添加了一个测试按钮，点击按钮后，血条就会慢慢回血。最后的效果图如下：

image

接下来需要将这个 UI 关联到我们的代码，新建一个 C++ 类继承自 UserWidget, 我们取名 HealthWidget：

image

回到我们的 Health_Widget 中，然后在类设置中将其 Parent Class 设置为我们新创建的类：HealthWidget。

image

代码

蓝图设置完成以后，接下来就要来写我们的代码逻辑了，通过 VS 打开我们的UE项目工程，然后在 HealthWidget 中，通过UE的反射机制来获取控件的实例。这里为了测试，我使用了定时器的方式来给血条回血，代码比较简单，如下：

HealthWidget.h

#pragma once

#include "CoreMinimal.h"
#include "Blueprint/UserWidget.h"
#include "Components/Button.h"
#include "Components/ProgressBar.h"
#include "Components/TextBlock.h"
#include "HealthWidget.generated.h"

/**
 * 
 */
UCLASS()
class DP_API UHealthWidget : public UUserWidget
{
 GENERATED_BODY()

public:
    virtual bool Initialize() override;

 UFUNCTION()
 void TestLoadEvent();

 void Repeating();

public:
 UPROPERTY(Meta = (BindWidget))
 UProgressBar *HealthProgressBar;
 UPROPERTY(Meta = (BindWidget))
 UButton *TestBtn;
 UPROPERTY(Meta = (BindWidget))
 UTextBlock *processValue;

 float pValue;

 FTimerHandle MemberTimerHandle;
};

HealthWidget.cpp

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


#include "HealthWidget.h"
#include "TimerManager.h"

bool UHealthWidget::Initialize()
{
 if (!Super::Initialize())
 {
  return false;
 }

 if(TestBtn != nullptr)
 {
  TestBtn->OnClicked.__Internal_AddDynamic(this, &UHealthWidget::TestLoadEvent, FName("TestLoadEvent"));
 }

 return true;
}


void UHealthWidget::TestLoadEvent()
{
 FTimerManager& timerManager = GetWorld()->GetTimerManager();
 timerManager.SetTimer(MemberTimerHandle, this, &UHealthWidget::Repeating, 2.0f, true, 0);
}

void UHealthWidget::Repeating()
{
 pValue += 2.0f;
 if(pValue > 100)
 {
  GetWorld()->GetTimerManager().ClearTimer(MemberTimerHandle);
  return;
 }
 HealthProgressBar->SetPercent(pValue/100);
}

这里需要注意的是，通过 UPROPERTY(Meta = (BindWidget)) 来获取控件实例的时候，在我们的UMG里名称需要与我们的代码保持一致，如图：