local MainTop = {}
SL:Print("=========MainTop加载成功!")
-- 顶部按钮配置数据(示例)
local Topui = {
{ name = "id1", x = 0.64, y = -30, res = "res/custom/tops/1.png", cmd = {1234, 5011} }, -- 首冲
{ name = "id2", x = 0.57, y = -30, res = "res/custom/tops/2.
🤖 回答引擎: 前端Lua |
🕒 时间: 2026-04-12 15:50:22 |
👁️ 阅读: 8
你的代码有几个关键问题需要修正:
## 主要问题分析
1. **初始状态设置错误**:你在`main()`函数最后调用了`MainTop.showWithEffect(topui)`,导致一开始就显示图标
2. **位置计算问题**:使用`- v.x * screenW`可能导致按钮位置不正确
3. **锚点设置时机不当**:在创建按钮后才设置容器锚点
## 修正后的代码
```lua
local MainTop = {}
SL:Print("=========MainTop加载成功!")
-- 顶部按钮配置数据(示例)
local Topui = {
{ name = "id1", x = 0.64, y = -30, res = "res/custom/tops/1.png", cmd = {1234, 5011} }, -- 首冲
{ name = "id2", x = 0.57, y = -30, res = "res/custom/tops/2.png", cmd = {1234, 5012} }, -- VIP特权
{ name = "id3", x = 0.50, y = -30, res = "res/custom/tops/3.png", cmd = {1234, 5013} }, -- 福利礼包
{ name = "id4", x = 0.43, y = -30, res = "res/custom/tops/4.png", cmd = {1234, 5014} }, -- 开服活动
{ name = "id5", x = 0.36, y = -30, res = "res/custom/tops/5.png", cmd = {1234, 5015} }, -- 交易行
{ name = "id6", x = 0.29, y = -30, res = "res/custom/tops/6.png", cmd = {1234, 5016} }, -- 福利活动
{ name = "id7", x = 0.22, y = -30, res = "res/custom/tops/7.png", cmd = {1234, 5017} }, -- 充值
}
function MainTop.main()
-- 获取屏幕宽高
local screenW = SL:GetMetaValue("SCREEN_WIDTH")
local screenH = SL:GetMetaValue("SCREEN_HEIGHT")
-- 创建界面
local topwin = GUI:Win_Create("NPC_Window", screenW, screenH)
if not topwin then
SL:Print("创建主窗口失败")
return
end
-- 设置折叠按钮位置(固定在屏幕右侧)
GUI:removeChildByName(topwin, "id8")
local zhedie = GUI:Button_Create(topwin, "id8", screenW - 100, -85, "res/custom/tops/8.png")
GUI:setTag(zhedie, 1)
-- 获取折叠按钮位置作为缩放中心点
local foldPos = GUI:getPosition(zhedie)
-- 创建容器节点,初始不可见且缩放为0
local topui = GUI:Node_Create(topwin, "topui", 1, 1)
GUI:setVisible(topui, false)
GUI:setScale(topui, 0)
-- 设置容器锚点为中心(先设置锚点再创建子节点)
GUI:setAnchorPoint(topui, 0.5, 0.5)
-- 设置容器位置到折叠按钮处
GUI:setPosition(topui, foldPos.x, foldPos.y)
-- 遍历配置创建按钮
for _, v in ipairs(Topui) do
-- 删除同名子节点
GUI:removeChildByName(topui, v.name)
-- 计算按钮相对位置(相对于容器中心)
local btnX = - (v.x * screenW - foldPos.x)
local btnY = v.y
-- 创建按钮
local btn = GUI:Button_Create(topui, v.name, btnX, btnY, v.res)
GUI:setAnchorPoint(btn, 1, 1)
-- 绑定点击事件
GUI:addOnClickEvent(btn, function()
SL:Print("按钮被点击:", v.name)
end)
end
-- 折叠按钮点击事件
GUI:addOnClickEvent(zhedie, function()
local isExpanded = (GUI:getTag(zhedie) == 1)
if isExpanded then
-- 收起
GUI:Button_loadTextureNormal(zhedie, "res/custom/tops/9.png")
GUI:setTag(zhedie, 0)
MainTop.hideWithEffect(topui)
else
-- 展开
GUI:Button_loadTextureNormal(zhedie, "res/custom/tops/8.png")
GUI:setTag(zhedie, 1)
MainTop.showWithEffect(topui)
end
end)
-- 移除延迟执行的展开动画,让初始状态为收起
-- 这样第一次加载时图标不会显示
SL:Print('主界面创建完成')
end
-- 展开特效函数
function MainTop.showWithEffect(widget)
if GUI:Win_IsNull(widget) then return end
GUI:setVisible(widget, true)
GUI:setOpacity(widget, 0) -- 先设置透明度为0
-- 使用动作序列实现淡入+放大
local fadeIn = GUI:ActionFadeTo(0.3, 255)
local scaleTo = GUI:ActionScaleTo(0.3, 1)
local seq = GUI:ActionSequence(fadeIn, scaleTo)
GUI:runAction(widget, seq)
end
-- 收起特效函数
function MainTop.hideWithEffect(widget)
if GUI:Win_IsNull(widget) then return end
local fadeOut = GUI:ActionFadeTo(0.3, 0)
local scaleTo = GUI:ActionScaleTo(0.3, 0)
local callback = GUI:CallFunc(function()
GUI:setVisible(widget, false)
GUI:setScale(widget, 0)
end)
local seq = GUI:ActionSequence(fadeOut, scaleTo, callback)
GUI:runAction(widget, seq)
end
-- 启动模块
MainTop.main()
return MainTop
```
## 关键修改点
1. **移除了`SL:ScheduleOnce`调用**:这样初始状态就是收起的
2. **修正位置计算**:使用`btnX = - (v.x * screenW - foldPos.x)`确保按钮相对位置正确
3. **调整锚点设置顺序**:在创建子节点前设置容器锚点
4. **折叠按钮位置**:使用绝对位置`screenW - 100`确保在屏幕右侧
现在代码会在第一次加载时保持收起状态,只有点击折叠按钮才会展开显示图标。
你的代码有几个关键问题需要修正:
## 主要问题分析
1. **初始状态设置错误**:你在`main()`函数最后调用了`MainTop.showWithEffect(topui)`,导致一开始就显示图标
2. **位置计算问题**:使用`- v.x * screenW`可能导致按钮位置不正确
3. **锚点设置时机不当**:在创建按钮后才设置容器锚点
## 修正后的代码
```lua
local MainTop = {}
SL:Print("=========MainTop加载成功!")
-- 顶部按钮配置数据(示例)
local Topui = {
{ name = "id1", x = 0.64, y = -30, res = "res/custom/tops/1.png", cmd = {1234, 5011} }, -- 首冲
{ name = "id2", x = 0.57, y = -30, res = "res/custom/tops/2.png", cmd = {1234, 5012} }, -- VIP特权
{ name = "id3", x = 0.50, y = -30, res = "res/custom/tops/3.png", cmd = {1234, 5013} }, -- 福利礼包
{ name = "id4", x = 0.43, y = -30, res = "res/custom/tops/4.png", cmd = {1234, 5014} }, -- 开服活动
{ name = "id5", x = 0.36, y = -30, res = "res/custom/tops/5.png", cmd = {1234, 5015} }, -- 交易行
{ name = "id6", x = 0.29, y = -30, res = "res/custom/tops/6.png", cmd = {1234, 5016} }, -- 福利活动
{ name = "id7", x = 0.22, y = -30, res = "res/custom/tops/7.png", cmd = {1234, 5017} }, -- 充值
}
function MainTop.main()
-- 获取屏幕宽高
local screenW = SL:GetMetaValue("SCREEN_WIDTH")
local screenH = SL:GetMetaValue("SCREEN_HEIGHT")
-- 创建界面
local topwin = GUI:Win_Create("NPC_Window", screenW, screenH)
if not topwin then
SL:Print("创建主窗口失败")
return
end
-- 设置折叠按钮位置(固定在屏幕右侧)
GUI:removeChildByName(topwin, "id8")
local zhedie = GUI:Button_Create(topwin, "id8", screenW - 100, -85, "res/custom/tops/8.png")
GUI:setTag(zhedie, 1)
-- 获取折叠按钮位置作为缩放中心点
local foldPos = GUI:getPosition(zhedie)
-- 创建容器节点,初始不可见且缩放为0
local topui = GUI:Node_Create(topwin, "topui", 1, 1)
GUI:setVisible(topui, false)
GUI:setScale(topui, 0)
-- 设置容器锚点为中心(先设置锚点再创建子节点)
GUI:setAnchorPoint(topui, 0.5, 0.5)
-- 设置容器位置到折叠按钮处
GUI:setPosition(topui, foldPos.x, foldPos.y)
-- 遍历配置创建按钮
for _, v in ipairs(Topui) do
-- 删除同名子节点
GUI:removeChildByName(topui, v.name)
-- 计算按钮相对位置(相对于容器中心)
local btnX = - (v.x * screenW - foldPos.x)
local btnY = v.y
-- 创建按钮
local btn = GUI:Button_Create(topui, v.name, btnX, btnY, v.res)
GUI:setAnchorPoint(btn, 1, 1)
-- 绑定点击事件
GUI:addOnClickEvent(btn, function()
SL:Print("按钮被点击:", v.name)
end)
end
-- 折叠按钮点击事件
GUI:addOnClickEvent(zhedie, function()
local isExpanded = (GUI:getTag(zhedie) == 1)
if isExpanded then
-- 收起
GUI:Button_loadTextureNormal(zhedie, "res/custom/tops/9.png")
GUI:setTag(zhedie, 0)
MainTop.hideWithEffect(topui)
else
-- 展开
GUI:Button_loadTextureNormal(zhedie, "res/custom/tops/8.png")
GUI:setTag(zhedie, 1)
MainTop.showWithEffect(topui)
end
end)
-- 移除延迟执行的展开动画,让初始状态为收起
-- 这样第一次加载时图标不会显示
SL:Print('主界面创建完成')
end
-- 展开特效函数
function MainTop.showWithEffect(widget)
if GUI:Win_IsNull(widget) then return end
GUI:setVisible(widget, true)
GUI:setOpacity(widget, 0) -- 先设置透明度为0
-- 使用动作序列实现淡入+放大
local fadeIn = GUI:ActionFadeTo(0.3, 255)
local scaleTo = GUI:ActionScaleTo(0.3, 1)
local seq = GUI:ActionSequence(fadeIn, scaleTo)
GUI:runAction(widget, seq)
end
-- 收起特效函数
function MainTop.hideWithEffect(widget)
if GUI:Win_IsNull(widget) then return end
local fadeOut = GUI:ActionFadeTo(0.3, 0)
local scaleTo = GUI:ActionScaleTo(0.3, 0)
local callback = GUI:CallFunc(function()
GUI:setVisible(widget, false)
GUI:setScale(widget, 0)
end)
local seq = GUI:ActionSequence(fadeOut, scaleTo, callback)
GUI:runAction(widget, seq)
end
-- 启动模块
MainTop.main()
return MainTop
```
## 关键修改点
1. **移除了`SL:ScheduleOnce`调用**:这样初始状态就是收起的
2. **修正位置计算**:使用`btnX = - (v.x * screenW - foldPos.x)`确保按钮相对位置正确
3. **调整锚点设置顺序**:在创建子节点前设置容器锚点
4. **折叠按钮位置**:使用绝对位置`screenW - 100`确保在屏幕右侧
现在代码会在第一次加载时保持收起状态,只有点击折叠按钮才会展开显示图标。
← 返回问答库