COCOS学习笔记--序列帧动画

Cocos引擎中的序列帧动画使用过程一般是先在Cocos Studio里编辑帧动画，然后在在工程代码中加载和使用帧动画，这篇博客就来详细介绍下具体步骤：

 

一．使用Cocos Studio编辑序列帧动画

1.首先创建一个场景：文件->新建文件，名字叫“AnimationTest”：

 

2.向场景添加一个基础容器，相当于一个层，并设置其坐标、尺寸：

 

 

3.导入帧动画资源，帧动画资源其实就是一系列有序图片：

 

 

4.导入帧动画资源后，就可以创建帧动画了，帧动画是通过精灵来表现的，所以我们要创建一个精灵。然后在Cocos Studio下面的动画窗口勾选“开始记录动画”，创建帧动画其实就是选择关键帧然后向精灵上拖每帧的图片。

 

 

5.编辑完帧动画别忘了保存和发布项目，这样会在我们的项目工程中Resources/res目录下会生成一个AnimationTest.csb文件，这个文件就是我们所创建的这个场景的配置文件，代码中就是通过加载这个文件使用帧动画的。

 

二．在代码中使用Cocos Studio编辑的序列帧动画

打开项目工程文件，在HelloWorldScene.cpp的init()方法中添加代码：

//加载帧动画所在的node，并将其添加到父节点
auto rootNode = CSLoader::createNode("AnimationTest.csb");
addChild(rootNode);

//创建帧动画
auto rootNodeAni = CSLoader::createTimeline("AnimationTest.csb");

//设置播放速度
rootNodeAni->setTimeSpeed(0.5);

//设置起始帧、是否循环播放
rootNodeAni->gotoFrameAndPlay(0,true);

//执行帧动画
rootNode->runAction(rootNodeAni);

运行项目，就可以看到我们之前编辑的帧动画了，由于是动态的，效果图我就放个截图吧：

注意，加载帧动画我们是通过CSLoader类的createNode()方法创建了一个node对象，创建帧动画则是过CSLoader类的createTimeline()方法，这个类在cocos\editor-support\cocostudio\ActionTimeline目录下可以看到源码。播放帧动画依旧是node对象调用其runAction()方法。

以上。