怎么让基础容器先压缩成一条线然后再慢慢回到原来的大小
🤖 回答引擎: 前端Lua |
🕒 时间: 2026-05-30 12:52:35 |
👁️ 阅读: 3
要实现容器先压缩成一条线再慢慢回到原大小,可以使用缩放动画序列。这里提供两种实现方案:
## 方案一:使用动作序列(推荐)
```lua
-- 先创建父节点
local parent = GUI:Win_Create("GMMain", 0, 0, 0, 0, false, false, true, false, false, false, 1)
-- 创建容器
local layout = GUI:Layout_Create(parent, "my_layout", 200, 200, 300, 200)
GUI:setAnchorPoint(layout, 0.5, 0.5)
-- 定义动画序列
local function playScaleAnimation()
-- 先压缩成一条线(高度为0)
local scaleToZero = GUI:ActionScaleTo(0.2, 1, 0)
-- 延迟一小段时间
local delay = GUI:DelayTime(0.1)
-- 慢慢回到原来大小
local scaleToNormal = GUI:ActionScaleTo(0.5, 1, 1)
-- 创建动作序列
local sequence = GUI:ActionSequence(scaleToZero, delay, scaleToNormal)
-- 执行动画
GUI:runAction(layout, sequence)
end
-- 调用动画
playScaleAnimation()
```
## 方案二:使用定时器分步执行
```lua
local parent = GUI:Win_Create("GMMain", 0, 0, 0, 0, false, false, true, false, false, false, 1)
local layout = GUI:Layout_Create(parent, "my_layout", 200, 200, 300, 200)
GUI:setAnchorPoint(layout, 0.5, 0.5)
-- 第一步:压缩成一条线
local scaleToZero = GUI:ActionScaleTo(0.2, 1, 0)
GUI:runAction(layout, scaleToZero)
-- 第二步:延迟后恢复
SL:ScheduleOnce(function()
local scaleToNormal = GUI:ActionScaleTo(0.5, 1, 1)
GUI:runAction(layout, scaleToNormal)
end, 0.3) -- 延迟0.3秒执行
```
## 关键点说明:
1. **ActionScaleTo(time, scaleX, scaleY)** - 缩放动作
- time: 动画持续时间(秒)
- scaleX: X轴缩放比例(1为原大小)
- scaleY: Y轴缩放比例(0压缩成线,1原大小)
2. **ActionSequence(...)** - 动作序列
- 按顺序执行多个动作
3. **DelayTime(time)** - 延迟动作
- time: 延迟时间(秒)
4. **runAction(widget, action)** - 执行动作
## 完整示例:
```lua
-- 创建带背景的容器
local parent = GUI:Win_Create("GMMain", 0, 0, 0, 0, false, false, true, false, false, false, 1)
local layout = GUI:Layout_Create(parent, "demo_layout", 300, 300, 200, 150)
-- 添加背景便于观察
local bg = GUI:Image_Create(layout, "bg", 100, 75, "res/public/1900000610.png")
GUI:setAnchorPoint(bg, 0.5, 0.5)
GUI:setContentSize(bg, {width = 200, height = 150})
-- 添加按钮触发动画
local btn = GUI:Button_Create(parent, "btn_animate", 300, 100, "res/public/1900000612.png")
GUI:Button_setTitleText(btn, "播放动画")
GUI:addOnClickEvent(btn, function()
-- 压缩成线
local compress = GUI:ActionScaleTo(0.2, 1, 0)
-- 延迟
local delay = GUI:DelayTime(0.1)
-- 恢复原状
local restore = GUI:ActionScaleTo(0.5, 1, 1)
-- 执行序列
GUI:runAction(layout, GUI:ActionSequence(compress, delay, restore))
end)
```
这样就能实现容器先垂直压缩成一条线,然后慢慢恢复到原来大小的动画效果了。
← 返回问答库