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

【界面UI】聊天气泡与自定义表情的实现

2026-09-23 15:12 作者:996 技术组 996引擎Lua教程传奇脚本

实战应用:用在哪里

聊天气泡是玩家社交的第一现场:文字、表情、道具链接混排在气泡里,飘在角色头顶。气泡的实现是 RichText 与 Image 控件、文本解析、表情资源管理三件事的组合,做好了聊天频道才会热闹。

气泡的组装

lua

---聊天消息的气泡渲染
function Bubble.render(actor, text)
    local bubble = GUI:Image_Create(sceneLayer, "bubble_" .. actor:GetUserId(), actor.x, actor.y - 60, "bubble_bg.png")
    local rich = GUI:RichText_Create(bubble, "msg", 12, 8, parseEmoji(text), 200, 13, "#FFFFFF")
    QF_Delay(6000, function()
        bubble:removeFromParent()
    end)
    return bubble
end

气泡由底图与富文本两层组成:Image 做气泡底,RichText 承载混排内容。文本先经过 parseEmoji 解析:[微笑] 这类表情标记被替换成表情图的富文本元素。气泡 6 秒后自动消失,QF_Delay 的定时销毁让气泡的节奏与聊天频率同步。

表情的解析

lua

-- 表情标记解析:[名字] 换成图片元素
function parseEmoji(text)
    local parts = SL:Split(text, "%[")
    local out = ""
    for i, part in ipairs(parts) do
        local close = string.find(part, "]")
        if i > 1 and close then
            local emojiName = string.sub(part, 1, close - 1)
            if EMOJI_TABLE[emojiName] then
                out = out .. "#<img=" .. EMOJI_TABLE[emojiName] .. ">#" .. string.sub(part, close + 1)
            else
                out = out .. part
            end
        elseif i == 1 then
            out = part
        end
    end
    return out
end

表情名查表换图片标记,不存在的表情名原样保留文本。表情资源表管理上传与审核:玩家自定义表情经审核入库,表情的名字与资源 ID 绑定。气泡的层级在角色头顶、名字下方,多个气泡的重叠按聊天时间错开纵坐标。表情的滥用防护:单条消息的表情数上限 3 个,表情刷屏与文字刷屏同规则限频。

验证与监控

气泡的渲染数量同屏监控,超过 10 个气泡时按时间淘汰最旧的,渲染的开销不失控。

踩坑记录

表情图片的异步加载曾经让气泡先出现后图才到,气泡的尺寸跳动,图片预加载进表情表的管理流程。富文本的转义遗漏让尖括号内容被当成标记吞掉,内容转义在解析前统一处理。

上线要点

气泡与聊天频道的消息流共享一份解析逻辑,频道里怎么渲染气泡就怎么渲染,一致性避免玩家困惑。表情的审核标准与聊天敏感词同源,表情同样可能被用来传话。气泡的点击透传要处理好:点击气泡查看聊天详情,拖动气泡不移动角色,触摸的优先级配置决定交互的舒适度。

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

作者履历与出处

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

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

幂尔框架 · 实战干货 · 接口调用

LATEST ARTICLES

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

引擎触发烈火剑法连击战士

【引擎触发】疾风烈火斩:烈火剑法连击的判定触发设计

实战应用:用在哪里 战士的烈火剑法一击熄火后要等八秒冷却,连招断档感强烈。疾风烈火斩在烈火剑法命中后给一次连击窗口:三秒内再…

2026-09-23 15:45 996 技术组
玩法策划阵营声望声望压制

【玩法策划】阵营声望:声望等级与敌对压制设计

实战应用:用在哪里 阵营对抗打到中期容易疲软:打赢没有额外好处,输掉也没有代价。阵营声望体系给阵营战装上荣誉刻度:个人与阵营…

2026-09-23 15:45 996 技术组
玩法策划城主施政市政建设

【玩法策划】城主施政:市政令牌与城市建设玩法

实战应用:用在哪里 拿下沙巴克之后呢?城主除了名字挂在城墙上,对城市毫无影响。城主施政玩法让占领变成治理:城主每周获得市政令…

2026-09-23 15:45 996 技术组
运维发布备用线路切换演练

【运维发布】备用线路:主线路故障的自动切换演练

实战应用:用在哪里 主线路光缆被挖断的深夜,全服掉线 20 分钟,玩家以为游戏倒闭。备用线路方案给接入层配第二条出口:主线路…

2026-09-23 15:44 996 技术组
后端接口行会选举换届

【后端接口】行会选举:官员换届的投票与任期接口

实战应用:用在哪里 行会官员由帮主任命的老模式弊端明显:任人唯亲、能上不能下。行会选举接口把官员换届做成投票制:每两个月一次…

2026-09-23 15:44 996 技术组
前端接口技能悬浮卡片说明

【前端接口】技能说明悬浮:技能详情卡片的前端实现

实战应用:用在哪里 烈火剑法的伤害加成、冷却时间、下一级提升,全靠玩家记忆或去官网查。技能说明悬浮卡片在鼠标悬停技能图标零点…

2026-09-23 15:44 996 技术组