要实现点击按钮后其他按钮动态下移的效果,我们需要调整动画逻辑和位置计算。以下是修改后的代码:
```lua
function npc.main()
local parent = GUI:Win_Create(npc.__cname, 0, 0, 0, 0, false, false, true, true, true, 0)
GUI:LoadExport(parent, "UI/XingShiHuFuUI")
npc._parent = parent
npc.ui = {}
npc.ui = GUI:ui_delegate(parent)
ssrSetWidgetPosition(parent, npc.ui.Image_1, 2, 0, 0, true, true)
-- 关闭按钮
GUI:addOnClickEvent(npc.ui.close, function()
npc.Close()
end)
-- 存储当前显示的克隆组件和选中的按钮索引
npc.currentClone = nil
npc.selectedIndex = nil
-- 获取ListView中的主按钮
local mainButtons = {}
for k, child in ipairs(GUI:ListView_getItems(npc.ui.ListView_1)) do
local name = GUI:getName(child)
SL:print("按钮名称:", name, "索引:", k)
-- 只处理Button_1到Button_4
if name == "Button_1" or name == "Button_2" or name == "Button_3" or name == "Button_4" then
mainButtons[k] = child
-- 为每个主按钮添加点击事件
GUI:addOnClickEvent(child, function()
local currentIndex = k
-- 如果点击的是已选中的按钮,则收起
if npc.selectedIndex == currentIndex then
-- 移除克隆组件
if npc.currentClone and not GUI:Win_IsNull(npc.currentClone) then
GUI:removeFromParent(npc.currentClone)
npc.currentClone = nil
end
-- 重置所有按钮位置
for i = npc.selectedIndex + 1, 4 do
local btn = mainButtons[i]
if btn and not GUI:Win_IsNull(btn) then
local pos = GUI:getPosition(btn)
GUI:setPosition(btn, pos.x, pos.y - 100) -- 上移100像素
end
end
npc.selectedIndex = nil
return
end
-- 移除之前显示的克隆组件
if npc.currentClone and not GUI:Win_IsNull(npc.currentClone) then
GUI:removeFromParent(npc.currentClone)
npc.currentClone = nil
-- 重置之前选中的按钮位置
for i = npc.selectedIndex + 1, 4 do
local btn = mainButtons[i]
if btn and not GUI:Win_IsNull(btn) then
local pos = GUI:getPosition(btn)
GUI:setPosition(btn, pos.x, pos.y - 100) -- 上移100像素
end
end
end
-- 克隆新的Panel
local newPanel = GUI:Clone(npc.ui.Panel_1)
GUI:setVisible(newPanel, true)
-- 插入到当前按钮后面
local itemIndex = GUI:ListView_getItemIndex(npc.ui.ListView_1, child)
GUI:ListView_insertCustomItem(npc.ui.ListView_1, newPanel, itemIndex + 1)
npc.currentClone = newPanel
npc.selectedIndex = currentIndex
if GUI:Win_IsNull(newPanel) then
SL:print("容器不存在")
return
end
-- 先设置初始状态:从Y轴最高点开始(缩放为0)
GUI:setScaleY(newPanel, 0)
-- 创建展开动画:从0到1的Y轴缩放
local expand = GUI:ActionScaleTo(0.5, 1, 1)
-- 执行动画
GUI:runAction(newPanel, expand)
-- 将后续按钮下移
for i = currentIndex + 1, 4 do
local btn = mainButtons[i]
if btn and not GUI:Win_IsNull(btn) then
local pos = GUI:getPosition(btn)
-- 使用动作平滑下移
local moveDown = GUI:ActionMoveTo(0.3, pos.x, pos.y + 100)
GUI:runAction(btn, moveDown)
end
end
SL:print("点击了按钮:", name, "插入位置:", itemIndex + 1)
end)
end
end
-- 入场动画(注意:Action_slow_appear函数需要确保存在)
Action_slow_appear(npc._parent, 200, 3, 1)
end
```
**关键修改点:**
1. **添加选中状态管理**:使用`npc.selectedIndex`记录当前选中的按钮索引
2. **按钮位置动态调整**:
- 点击按钮时,后续按钮下移100像素
- 再次点击同一按钮时,后续按钮上移100像素恢复原状
- 点击不同按钮时,先恢复之前按钮位置,再调整新按钮位置
3. **使用动作动画**:`GUI:ActionMoveTo(0.3, pos.x, pos.y + 100)`让按钮平滑移动
4. **位置计算**:通过`GUI:getPosition(btn)`获取当前坐标,然后计算新位置
**注意事项:**
- `Action_slow_appear`函数需要确保在脚本中存在
- 100像素的移动距离可以根据实际UI高度调整
- 如果按钮数量超过4个,需要修改循环条件
这个实现实现了点击按钮展开内容,其他按钮下移,再次点击收起,其他按钮上移的交互效果。