cocos2d-x开发记录：二，基本概念（骨骼动画）

九，骨骼动画

1.骨骼动画vs Sprite sheets

你能使用sprite sheets 创建动画，它很快又容易。直到你意识到你的游戏需要大量的动画并且内存消耗越来越高，并且需要时间载入全部数据。为了限制大小，你需要为动画限制到比较低的FPS，然后动画看起来不会如你所期望的那么平滑。这时你就需要骨骼动画了。

 

2.骨骼动画简介

骨骼动画在cocos2d-x动画是一个技术，一个角色由两部分组成：一个显示的表皮和类似人骨头样的网格。

Cocos2d-x提供了一种方式来在你的应用程序中使用2 D骨骼动画。骨骼动画设置的过程可能有些复杂，但使用起来很容易，当然有一些工具能简化这个过程。当使用骨骼动画时，动画是由几个骨头批次连接组成。影响一个骨头也会影响它下面的所有子元素。通过在每个骨头不同的组合转换,你可以获得不同姿势的骨架。

如果对于一个时间点的每个骨骼使用某个转换定义关键帧，你能插入关键帧来让骨骼动画更为平滑。附加代码中，我使用一个类，名叫Transformation，它包含2D转换数据，如平移，旋转，缩放。然后一个关键帧通过一个帧数被定义成一个这样的转换。一个关键帧定义了一个KeyframeAnimation的集合。最后一个SkeletonAnimation是一个KeyframeAnimations集合,一个用于每个骨骼。另外,你使用一个骨骼,保持关节的列表定义骨骼的层次结构。不同于sprite sheets每个骨头分配特定的纹理，如下图所示：

 

 

3.骨骼动画的工具

据我们所知，CocosBuilder 是一个很好的免费的创建骨骼动画的工具。CocosBuilder于Javascript绑定构建Cocos2d，这意味着你的代码，动画，接口将会在cocos2d-x中无修改运行。

4.使用cocosbuilder动画

你能使用CocosBuilder来创建角色动画 ，场景动画或任何你能想象到的动画。动画编辑器已经完全支持多个解决方案，关键帧，骨骼动画和多个时间线等。在主窗口的底部你可以找到时间轴。你使用时间线来创建你的动画。

默认情况下你的ccb-file文件有一个单独的10秒长度的时间线。CocosBuilder编辑动画在每秒30帧的帧率下，当你在cocos2d中你的应用在播放动画时，却是60帧/每秒（默认）。当前时间显示在右上角，格式为分钟：秒钟：帧。蓝色的垂直线显示当前时间。点击time显示改变当前时间线的间隔。

 

5.添加关键帧

在CocosBuilder中动画是基于关键帧的。你能添加关键帧到不同属性的一个节点中并且CocosBuilder会自动插入到关键帧之间，任意不同类型的容位中。为了添加一个关键帧，首先通过点击名字右边的三角形来展开视图节点。它会展示所有的节点动画属性。取决于你选择的节点类型，动画会有略微不同。一旦属性可见，那么你能点击时间线中用可选的属性。在点击的时候这会创建一个新的关键帧。或者,你可以通过选择一个节点创建一个新的关键帧,然后选择插入关键帧动画菜单。如果你在画布局域转换一个节点，关键帧会自动添加到当前时刻，考虑到转换后的属性在时间轴上已经有一个或多个关键帧。

 

6.编辑关键帧

你编辑一个特定节点的关键帧通过移动时间标记到关键帧的时刻并选择这个节点。通过双击它你能集中一个关键帧。通过拖动它们周围的选择框，你能选择关键帧并且一起移动它们。你也可以在节点之间复制和粘贴关键帧。在粘贴关键帧时确保你仅有一个已选择的关键帧。这个关键帧将会粘贴到时间标记是起始位置。如果你选择一组关键帧，那么通过选择反向选择关键帧动画菜单可以扭转他们的顺序。使用拉伸选择关键帧选项来加快或减慢一个动画的一个比例系数。

 

7.导入一个图像序列

如果你有一个通过sprite创建出来的帧动画，它被乏味到移动到时间线每一个帧中。CocosBuilder简化了这个过程通过自动导入一个图像序列。在工程视图的左手边选择你想要导入的关键帧，然后在时间线上选择一个CCSprite。现在在动画菜单中选择Create Frames from Selected Resources。这关键帧将会自动被创建在标记的起始位置。如果你需要让动画慢下来，选择新创建的关键帧并使用Stretch Selected Keyframes命令

8.使用 Easing

CocosBuilder提供一个可选的cocos2d提供的easings子集。在2个关键帧中右键并选择你想要应用的easing。

一些easings有额外的选项，在easing之后你能再次点击右键运用

 

9.使用多个时间线

CocosBuilder的动画编辑器一个非常强大的特性就是在一个单一的文件中可以有多个时间线。你能为不同的序列命名并使用它们的名字在代码中播放它们。在不同的时间线中它们也能平滑的转换。

使用时间线弹出菜单，选择，添加，编辑你的时间线。

在编辑时间线的对话框中你能获得你时间线的概述并重命名它们，添加新的一个并设置一个时间线当ccbi-file装入你的应用程序直接自动开始播放。

在时间线中没有关键帧设置可以跨时间线来共享它们的属性值。例如，如果你在一个时间线中移动一个节点，只要它们没有一个关键帧设置position属性，它将被移到所有时间线中。有时添加一个单一的关键帧到一个属性中，为一个特定的时间线，覆盖了共享值是很有用的。

 

10.链接时间线

你可以自动播放时间序列通过链接它们。你还可以使用这个特性来自动循环的时间表。

在有时间线的播放序列中，点击No chained timeline文本并选择你想要播放当前帧之后的时间线。

 

11.在代码中播放动画

以编程方式控制你通过CocosBuilder创建的动画，你就需要找到CCBAnimationManager。当ccbi-file被载入时，动画manager将分配到节点userObject。

CCNode *myNodeGraph = ccbReader->readNodeGraphFromFile("myFile.ccbi", this);

 

动作管理器将返回一个autoreleased对象。播放一个特定的时间线调用runAnimationsForSequenceNamed方法。如果一个时间线是当前正在被播放，当调用这个方法时，它将立即停止。

animationManager->runAnimationsForSequenceNamed("My Timeline");

 

还有一种可选的情况,你能使用一个在间隔时间期间到平滑转换的新时间线。在可能的情况下线性加速器将被用于转换。

animationManager->runAnimationsForSequenceNamedTweenDuration("My Timeline",0.5f);

 

也可以检索一个回调，每当一个时间线完成播放时。在序列中你将接收这些回调，即使另一个时间线被链接了。使用CCBAnimationManagerDelegate来接收这些回调。