SL:print("打开图鉴界面")
local npc = {}
npc.config = {
-- 套装1：烈焰战神
[1] = {
name = "烈焰战神",
itemsIdx = {50037, 50038, 50039, 50040, 50041},
itemsName = {"屠龙", "骨玉权杖", "裁决之杖", "凝血", "霸者之刃"},
attrs = {
{id
🤖 回答引擎: 前端Lua |
🕒 时间: 2026-03-12 14:42:20 |
👁️ 阅读: 10
要实现点击其他按钮时先删除之前的图鉴内容再更新新的内容，你需要在创建新图鉴前先清理`layoutRefs`表中存储的旧组件。
以下是修改后的代码：
```lua
GUI:addOnClickEvent(btn_Item, function()
-- 恢复上一个按钮颜色
if selectBtn and not GUI:Win_IsNull(selectBtn) then
GUI:Button_setTitleColor(selectBtn, "#ffffff")
end
-- 设置当前按钮选中颜色
GUI:Button_setTitleColor(btn_Item, "#00ff00")
selectBtn = btn_Item -- 记录当前选中按钮
-- 删除之前的图鉴内容
for i, widget in ipairs(layoutRefs) do
if not GUI:Win_IsNull(widget) then
GUI:removeFromParent(widget)
end
end
layoutRefs = {} -- 清空表
-- 创建新图鉴
local itemsConfig = npc.config[k].itemsIdx
local itemName = npc.config[k].itemsName
local imgStart_x = 10
local imgStart_y = 200
for i = 1, #itemsConfig do
local itemIdx = itemsConfig[i] -- 装备IDX
local name = itemName[i] -- 装备名称
if itemIdx then
local img_x = (i - 1) % 3 * 162 + imgStart_x -- itemShow.x坐标
local img_y = imgStart_y - math.floor((i-1)/3) * 160 -- itemShow.y坐标
local itemShowBg = "itemShowBg"..i -- 图鉴背景ID
local itemShow = "itemShow"..i -- 图鉴装备itemShowID
local nameText = "nameText"..i -- 装备名ID
local stateText = "stateTxext"..i -- 放入状态ID
-- 创建背景
local itemShow_bg = GUI:Image_Create(npc.ui.content_Layout, itemShowBg, img_x, img_y, "res/public/1900000610.png")
GUI:setContentSize(itemShow_bg, 165, 150)
-- 创建装备显示
local itemShowOut = GUI:ItemShow_Create(itemShow_bg, itemShow, 63, 100, {index = itemIdx, count = 1, look = true, bgVisible = true, color = 255})
local centerX = 80 - string.len(name)*2.8 -- 设置文字居中
local itemName_Txt = GUI:Text_Create(itemShow_bg, nameText, centerX, 45, 16, "#ffffff", name)
GUI:Text_setTextHorizontalAlignment(itemName_Txt, 1) -- 文字水平居中
local state_Txt = GUI:Text_Create(itemShow_bg, stateText, 60, 10, 16, "#ffffff", "0 / 1")
GUI:Text_setTextHorizontalAlignment(state_Txt, 1) -- 文字水平居中
table.insert(layoutRefs, itemShow_bg)
end
end
end)
```
**关键修改点：**
1. **清理旧组件**：在创建新图鉴前，遍历`layoutRefs`表，使用`GUI:removeFromParent(widget)`移除所有旧组件
2. **清空表**：清理后重置`layoutRefs = {}`，避免内存泄漏
3. **文字居中优化**：添加了`GUI:Text_setTextHorizontalAlignment()`函数让文字水平居中
4. **背景图修正**：将背景图路径修正为`res/public/1900000610.png`
这样每次点击不同套装按钮时，都会先清理之前显示的图鉴内容，然后显示新的图鉴，避免了内容重叠的问题。
← 返回问答库