【前端接口】GUI:LoadingBar_Create：进度条与血条的表现实现

实战应用：用在哪里

BOSS 血条、经验条、加载进度、采集进度全是 GUI:LoadingBar_Create 的用武之地。进度条把数值的百分比翻译成贴图的填充比例，方向、颜色、渐变的表现参数让同一颗控件适配血条与进度两种语义。

创建与填充

---创建进度条 parent:父节点 ID:x/y:坐标 nimg:填充贴图 direction:方向
function GUI:LoadingBar_Create(parent, ID, x, y, nimg, direction) end

-- BOSS 血条：横向填充
local bar = GUI:LoadingBar_Create(win, "bossHp", 20, 18, "hp_fill.png", 0)
GUI:LoadingBar_setPercent(bar, 75)

填充贴图是进度条的视觉主体，direction 定填充方向（横向从左到右、纵向从下到上），setPercent 的 0 到 100 控制填充比例。BOSS 血条的服务端联动：sendluamsg 推送血量百分比，LoadingBar_setPercent 即时刷新，数值与表现的同步链路只有一步。血条的分层：红血（当前血量）与黄血（近期损失缓冲）用两颗 LoadingBar 叠加，缓冲条的延迟追随让掉血的视觉更柔和。

进度语义的表达

-- 采集进度：ProgressTimer 的环形变体
local ring = GUI:ProgressTimer_Create(win, "gatherRing", 300, 200, "ring_fill.png")
GUI:ProgressTimer_setPercentage(ring, 40)
GUI:ProgressTimer_progressTo(ring, 2.0, 100)

环形进度用 ProgressTimer 变体：采集读条的环形填充、转盘的扇形进度，圆形语义的进度用环形控件。进度条的动画接口（progressFromTo、progressTo）让数值的变化带缓动，血量的掉落与经验的增长不再生硬跳变。进度条的颜色（setColor）与方向（setDirection）的运行时切换支持同一控件在多场景复用。

验证与监控

进度条的刷新频率与数值变化的频率匹配，高频刷新（每帧）与低频刷新（每秒）的取舍按数值变化的粒度定。

踩坑记录

填充贴图的九宫格设置缺失曾经让进度条在拉宽后变形，贴图的 Scale9Slice 配置是宽度的前提。百分比的语义曾经混淆：LoadingBar 的 100 是满格，ProgressTimer 的语义相同但视觉旋转方向有正反两种，方向参数的正反在视觉验收时确认。

上线要点

进度条的贴图资源按 UI 主题统一，血条的红色系与经验条的金色系的主题色一致。进度变化的动画时长与数值变化的速率匹配：血条的缓冲追随 0.5 秒，经验条的增长 0.3 秒，动画时长的手感要在真机验证。进度条的可读性：底图的对比度要足，填充贴图与底图的层次关系是进度可读的前提。

本文由 996 技术组基于 996 引擎官方知识库与浮生梦老师课程体系整理。团队长期从事传奇类引擎 Lua 后端逻辑、客户端界面与商业版本交付，内容以官方知识库与真实项目为出处，按版本持续修订。