动画制作
通过编译器可以对某个控件进行动画制作, 实现倾斜,缩放,移动等动画的实现,甚至可实现帧动画相关。大概步骤如下:
-
添加 + 号按钮添加动画名,设定名称,起始帧,结束帧。
设定成功后, 在-- ALL --
中选择自己设定的动画相关
-
选定动画后,千万注意勾选上开始记录动画,否则添加帧的时候其属性不会改变,且代码中不能识别帧事件回调相关
-
使用 + 号按钮可添加多个不同的动画, 可通过动画列表进行管理
这样做的优点:通过动画名播放指定的动画比通过帧数播放更容易让人理解。
另外注意: 设定多个动画名的情况下,结束帧数不要与下个动画名的起始帧数相同,否则播放会出现问题 -
cocosStudio 支持序列帧动画,只需要创建一个精灵, 然后选择对应的多个图片拖拽到精灵节点中,即可:
实质就是: 在指定的帧数上添加指定的图片资源即可。
-
在测试动画使用的时候, 可点击如下标记位置查看不同动画的效果。
修改FPS的数目,相当于修改动画的播放速度, 数字越小越慢。
代码实现
调用UI编译器制作的动画, 主要通过接口: createTimeline
。其主要使用的方法有:
- isPlaying 是否播放中
- start/play/pause/resume 开始/播放/暂停播放/恢复播放
- setTimeSpeed/getTimeSpeed 播放速度相关
- setDuration/getDuration 动画持续时间
- setCurrentFrame/getCurrentFrame 设置动作的当前帧数相关
- clearFrameEventCallFunc/clearFrameEndCallFuncs 清空帧事件相关
- setFrameEventCallFunc/setAnimationEndCallFunc 设置帧事件相关
- gotoFrameAndPlay 从指定的起始帧数到结束帧数进行播放
针对于最后一个接口,为函数重载:
// 接口默认endIndex为结束帧数,loop为true
void gotoFrameAndPlay(int startIndex)
void gotoFrameAndPlay(int startIndex, bool loop)
void gotoFrameAndPlay(int startIndex, int endIndex, bool loop)
void gotoFrameAndPlay(int startIndex, int endIndex, int currentFrameIndex, bool loop)
Lua代码示例:
-- 方式1: 根据帧数播放动画
local action = cc.CSLoader:createTimeline("asset/ui/uiAni.csb")
action:clearFrameEventCallFunc()
action:setFrameEventCallFunc(function(frame)
if frame == nil then return end
local frameName = frame:getEvent()
if frameName == "endAni" then
print("动画播放结束")
end
end)
action:gotoFrameAndPlay(0, false)
action:setTimeSpeed(1)
view:runAction(action)
-- 方式2: 根据动画名播放指定动画
local action = cc.CSLoader:createTimeline("asset/ui/uiAni.csb")
local standAni = ccs.AnimationInfo("standAni", 0, 15)
action:addAnimationInfo(standAni)
action:addAnimationInfo(ccs.AnimationInfo("runAni", 16, 30))
action:play("standAni", false)
End