Unreal Engine 5 中如何用蓝图控制 8 段独立图片组成的血条？

将 8 个 Image 的引用存入数组，在生命值变化时计算需要显示的段数，再逐个设置图片的 Visibility。图片名称只是标识，还需要在 Widget Blueprint 中获取实际控件引用。

以下方案假设 8 段代表相等的生命值区间，不足一整段的剩余生命值也显示为一段。提供的材料没有包含 UI 和蓝图截图，下面说明可以套用的连接方式。

1. 在 Widget Blueprint 中建立图片数组

在 Designer 中分别选中 HealthSegment1 到 HealthSegment8，勾选 Is Variable，使这些图片能在 Graph 中被引用。

创建一个 Image 对象引用数组，例如 HealthSegments。初始化 Widget 时，用 Make Array 按以下顺序填入控件引用，再赋值给数组：

HealthSegments = [
    HealthSegment1,
    HealthSegment2,
    HealthSegment3,
    HealthSegment4,
    HealthSegment5,
    HealthSegment6,
    HealthSegment7,
    HealthSegment8
]

数组顺序决定哪些分段优先保留。按上述顺序更新时，生命值下降会先隐藏 HealthSegment8，再隐藏 HealthSegment7。如果需要反向消失，调整数组顺序即可。

2. 根据生命值计算可见段数

在 Widget Blueprint 中创建一个函数，例如 UpdateHealthSegments，接收 CurrentHealth 和 MaxHealth。

计算逻辑如下，代码是用于搭建蓝图的伪代码：

if MaxHealth <= 0:
    return

HealthRatio = Clamp(CurrentHealth / MaxHealth, 0.0, 1.0)
VisibleCount = Ceil(HealthRatio * 8)

CurrentHealth / MaxHealth 必须使用浮点数除法。如果生命值变量是整数，先将其转换成浮点数。MaxHealth 应大于 0，提前检查可以避免除零。

这里使用向上取整 Ceil，因此只要生命值大于 0，就至少显示一段。例如，假设最大生命值为 100：

每段对应最大生命值的 1 / 8。按照这条规则，受到少量伤害后不一定立即少一段，需要降到下一个区间才会隐藏一段。

3. 遍历数组并设置 Visibility

使用 For Each Loop 遍历 HealthSegments，将 Array Index 与 VisibleCount 比较：

For Each Loop: HealthSegments
    if Array Index < VisibleCount:
        Array Element → Set Visibility → Visible
    else:
        Array Element → Set Visibility → Hidden

数组索引从 0 开始。例如，VisibleCount 为 4 时，索引 0、1、2、3 对应的图片显示，其余图片隐藏。

使用 Hidden 可以保留分段原本占据的布局空间。Collapsed 会移除布局占位，在 Horizontal Box 等容器中可能导致其余分段重新排列。固定分段血条通常更适合使用 Hidden。

4. 将生命值变化传给 Widget

角色或生命值组件负责修改生命值，Widget 接收更新后的数值并刷新显示。可以按以下顺序连接：

创建 Widget
→ 保存 Widget 引用
→ 初始化 HealthSegments 数组
→ 调用 UpdateHealthSegments(CurrentHealth, MaxHealth)

角色受到伤害
→ 更新 CurrentHealth
→ 通过保存的 Widget 引用调用 UpdateHealthSegments

回血、复活或修改最大生命值后，也调用同一个更新函数。也可以自行创建一个 Event Dispatcher，在生命值变化时通知 Widget 更新。

初始化数组后先刷新一次，让血条在创建时就反映实际生命值。后续在数值变化时刷新即可，无需为了这个效果在 Tick 中持续遍历图片。

备注：内容仅供参考。