function qiehuan(actor)
local k = SL:GetMetaValue("SCREEN_WIDTH")
local g = SL:GetMetaValue("SCREEN_HEIGHT")
-- 创建父节点
local parent = GUI:Win_Create("MapChangeContainer", 0, 0, 0, 0, false, false, true, false, false, false, 1)
-- 创建容器在屏幕正上方
-- 容器宽20
🤖 回答引擎: 前端Lua |
🕒 时间: 2026-04-15 13:35:52 |
👁️ 阅读: 12
根据浮生梦老师前端课程内容，我来帮您完善这个容器动画效果。您希望实现一个复合动画：先缩小宽度为0，然后1.5秒内同时放大、拉伸、淡入，最后1秒后淡出并隐藏。
```lua
function qiehuan(actor)
local k = SL:GetMetaValue("SCREEN_WIDTH")
local g = SL:GetMetaValue("SCREEN_HEIGHT")
-- 创建父节点
local parent = GUI:Win_Create("MapChangeContainer", 0, 0, 0, 0, false, false, true, false, false, false, 1)
-- 容器宽200，高63
local containerWidth = 200
local containerHeight = 63
-- 计算容器位置（正上方居中）
local posX = k / 2 - containerWidth / 3
local posY = g - 163 -- 屏幕顶部
-- 创建容器
local container = GUI:Layout_Create(parent, "top_container", posX, posY, containerWidth, containerHeight, false)
-- 给容器添加背景
local bg = GUI:Image_Create(container, "bg_image", 0, 0, "res/xixi/ditu/3.png")
GUI:setContentSize(bg, containerWidth, containerHeight)
-- 设置容器初始透明度为0（淡入前不可见）
GUI:setOpacity(container, 0)
-- 第一步：先缩小宽度为0（0.3秒完成）
local scaleToZero = GUI:ActionScaleTo(0.3, 0, 1) -- 宽度缩放为0，高度保持1
-- 第二步：1.5秒内同时执行三个动作
-- 放大动作（从0放大到1）
local scaleAction = GUI:ActionScaleTo(1.5, 1, 1)
-- 拉伸动作（使用移动动作模拟拉伸效果）
local stretchAction = GUI:ActionMoveBy(1.5, 0, 20) -- 向下移动20像素模拟拉伸
-- 淡入动作
local fadeInAction = GUI:ActionFadeIn(1.5)
-- 将三个动作组合成同时播放
local spawnActions = GUI:ActionSpawn(scaleAction, stretchAction, fadeInAction)
-- 第三步：延迟1秒
local delay1 = GUI:DelayTime(1)
-- 第四步：淡出动作（1秒）
local fadeOutAction = GUI:ActionFadeOut(1)
-- 第五步：隐藏容器
local hideAction = GUI:ActionHide()
-- 创建完整的动作序列
local actionSequence = GUI:ActionSequence(
scaleToZero, -- 先缩小宽度为0
spawnActions, -- 同时放大、拉伸、淡入
delay1, -- 延迟1秒
fadeOutAction, -- 淡出
hideAction -- 隐藏
)
-- 播放动作
GUI:runAction(container, actionSequence)
-- 可选：在动作完成后移除容器
local function removeContainer()
if not GUI:Win_IsNull(container) then
GUI:removeFromParent(container)
end
end
-- 使用单次定时器在动画结束后移除容器（总时间：0.3 + 1.5 + 1 + 1 = 3.8秒）
SL:ScheduleOnce(removeContainer, 3.8)
end
```
**代码说明：**
1. **初始设置**：容器创建后设置透明度为0，确保淡入前不可见
2. **缩小动画**：使用`ActionScaleTo(0.3, 0, 1)`将宽度缩为0，高度保持1
3. **复合动画**：使用`ActionSpawn`让放大、拉伸、淡入三个动作同时进行
- 放大：`ActionScaleTo(1.5, 1, 1)`恢复到原始大小
- 拉伸：`ActionMoveBy(1.5, 0, 20)`向下移动模拟拉伸效果
- 淡入：`ActionFadeIn(1.5)`从透明到不透明
4. **延迟和淡出**：延迟1秒后执行`ActionFadeOut(1)`淡出效果
5. **隐藏和清理**：使用`ActionHide`隐藏容器，定时器移除容器避免内存泄漏
**注意**：如果您需要更精确的拉伸效果，可以调整`ActionMoveBy`的参数或使用其他动作组合。动画总时长3.8秒，您可以根据需要调整各个动作的时间参数。
← 返回问答库