CHUAN2 DEV ENGINE
996 正版授权研发中心 · 360 授权合作教学中心 · 抖音传奇直播合作授权 · 快手推广运营商授权
OFFICIAL LICENSED ACADEMY 查验官方授权证书 →
// 威海旷世互娱教学基地 · 技术文章
界面UI

【界面UI】装备对比浮窗:属性差值的红绿提示

2026-09-21 18:14 作者:996 技术组 0 阅读 界面UI

实战应用:用在哪里

捡起一把井中月,穿不穿?装备对比浮窗把新装备与身上的现役装备并排一摆,属性差值红下绿上一目了然。对比浮窗是决策辅助的典范:玩家要的不是数据,是判断。

对比的结算

lua

---属性差值的计算与呈现
local ATTR_NAMES = {
    atk = "攻击", magic = "魔法", defense = "防御",
    hp = "生命",敏捷 = "敏捷",
}

function Compare.build(newItem, equipped)
    local diff = {}
    for _, key in ipairs(Compare.order) do
        local nv = newItem[key] or 0
        local ov = equipped[key] or 0
        if nv ~= ov then
            diff[#diff + 1] = {
                name = ATTR_NAMES[key] or key,
                delta = nv - ov,
            }
        end
    end
    table.sort(diff, function(a, b)
        return math.abs(a.delta) > math.abs(b.delta)
    end)
    return diff
end

对比按属性键逐一求差:只显示有差异的项,差值按绝对值降序——玩家第一眼看到的是最重要的变化。攻击加 15 排在敏捷减 1 前面,信息的主次由数值的幅度排定。差值的渲染分色:正差绿色带上箭头、负差红色带下箭头,零差异的属性不进列表,浮窗的高度随差异项数自适应。

浮窗的交互

lua

---浮窗的挂载:悬停新装备时展示
function Compare.attach(slotNode, newItem)
    GUI:addOnClickEvent(slotNode, function()
        local equipped = BagUI.equippedOf(newItem.slot)
        if not equipped then
            SL:ShowSystemTips("当前无同部位装备")
            return
        end
        local diff = Compare.build(newItem, equipped)
        Compare.render(slotNode, equipped, diff)
    end)
end

---浮窗的渲染:双方名字与差值列表
function Compare.render(anchor, equipped, diff)
    local win = GUI:Win_Create(Compare.layer, "cmp", 0, 0, 220, 60 + #diff * 18)
    GUI:Text_Create(win, "old", 10, 8, 12, "#CCCCCC",
        "当前:" .. equipped.name)
    GUI:Text_Create(win, "new", 10, 28, 12, "#FFFFFF",
        "新获:" .. anchor.item.name)
    for i, d in ipairs(diff) do
        local color = d.delta > 0 and "#66CC66" or "#FF6666"
        local sign = d.delta > 0 and "+" or ""
        GUI:Text_Create(win, "d" .. i, 10, 48 + (i - 1) * 18,
            12, color, d.name .. " " .. sign .. d.delta)
    end
end

浮窗锚定在新装备的格子旁,双方的名字先行、差值列表随后,井中月对裁决之杖的攻防差三秒看懂。无同部位装备时给一句提示不弹空窗,界面不做没有信息量的展示。浮窗的关闭走点击其他区域的统一手势,对比的入口同样挂在背包的长按与交易行的悬停——同一个组件服务三个场景。特殊属性的对比(吸血、暴伤)走扩展的属性键注册,新词条的接入不改骨架。

验证与监控

对比浮窗的展示与差值准确性的回归测试:构造攻防敏的差值矩阵逐项核对;浮窗的打开率与穿戴转化率的关联分析,对比的价值用数据验证。

踩坑记录

差值的正负曾经标反,穿上降攻的装备显示绿箭头,方向的语义集中在一个渲染函数后不再漂移。浮窗曾经被屏幕边缘裁剪,靠右格子的浮窗露一半,锚点的翻转定位修复。特殊属性曾经不进对比,吸血差 3% 的关键决策没有提示,扩展键的注册表补齐。

上线要点

对比的属性清单进配置,新词条上线登记即生效。浮窗的字号与配色进皮肤,视障模式的加粗差值文本可开。对比的入口在掉落提示里直供:捡起即弹对比,决策的路径缩到最短。

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

作者履历与出处

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

← 返回文章地图返回研学路径

最新技术文章 · 实战干货

LATEST ARTICLES

全站技术干货持续更新:996 引擎 / Lua 实战帖,语法、参数与示例一篇讲透。进入文章地图 · 查看全部 →

玩法策划沙巴克税收

【玩法策划】沙城税务官:税收分配与廉政度的玩法设计

实战应用:用在哪里 沙巴克占领行会坐收税收却只进不出,非占领行会的玩家心里不平衡。税务官玩法把税收做成明账:占领行会对摆摊与…

2026-09-23 01:24 996 技术组 · 0 阅读
玩法策划比武社交

【玩法策划】比武招亲:比武切磋与社交绑定的玩法设计

实战应用:用在哪里 高端玩家婚姻系统只有仪式没有过程,社交绑定缺一个高光事件。比武招亲做成擂台玩法:擂主设擂摆彩头,攻擂者报…

2026-09-23 01:24 996 技术组 · 0 阅读
案例复盘限时礼包日期

【案例复盘】限时礼包少发一天的事故复盘

实战应用:用在哪里 开服七日限时礼包发到第六天断了粮,9 月 1 日当天领奖按钮灰的,投诉当天破千。事故根因是一条数字日期循…

2026-09-23 01:24 996 技术组 · 0 阅读
网络通信心跳假在线

【网络通信】心跳探测:半开连接的主动识别

实战应用:用在哪里 玩家拔线不退游戏,连接半开着,人不在指令也没有,在线数虚高,容量预案被假数据带着跑。心跳探测给每个在线玩…

2026-09-23 01:24 996 技术组 · 0 阅读
运维发布发布日历

【运维发布】发布日历:全月变更的集中排期

实战应用:用在哪里 周三发了合成系统补丁,周四又改强化概率,两条变更叠加后玩家分不清是哪个改出来的。发布日历把全月变更集中排…

2026-09-23 01:24 996 技术组 · 0 阅读
Lua实战滑动窗口计数

【Lua实战】时间窗口计数:滑动窗口的环形数组实现

实战应用:用在哪里 容量预案需要知道滚动一小时的副本进入峰值,而不是全天累计。滑动窗口用 60 个槽位每槽记一分钟的进入数,…

2026-09-23 01:24 996 技术组 · 0 阅读