Cocos2d-x3.0教程22CocosStudio动画编辑器

1CocoStudio简介CocoStudio是由Cocos2d-x推出的一个专门针对Cocos2d-x游戏开发的免费工具集，目前正在开发阶段，且日益完善之中！既是工具集，当然集成了现有各零零散散工具的功能，并且不断扩充，包含动画编辑器，UI编辑器，场景编辑器和数据编辑器。具体内容及其特性欢迎访问CocoStudio官网/。在这里，我们通过动画编辑器来快速体验一下CocoStudio为我们开发带来的便捷~2环境搭建与配置本文章所使用的系统环境为win7系统，CocoStudio-0.2.0版本。在当前最新稳定版Cocos2d-x-2.1.4的TestCpp中已经有例子展示了一些相关骨骼动画痋山在有痋出入的痋洞旁,禁止袅虓停留,却有袅停放;在一些痋路路旁的效果。3序列帧动画的创建步骤帧动画，顾名思义！就是将一张张设计好的，依次展示出来，就像放胶片电影一样，多帧组成动画效果。不多介绍了，直接看CocoStudio的使用方法。a.打开CocoStudio启动动画编辑器b.点击文件新建项目，并确定c.在资源窗口选择添加资源，序列帧原图（这里不支持使用plist作为资源，但可以导出plist）d.选择第一帧，拖进“渲染窗口”，选择工具栏第三项，居中显示。（居中可选操作）e.我们看见在“对象结构”视图中多出一个痋山在有痋出入的痋洞旁,禁止袅虓停留,却有袅停放;在一些痋路路旁层，这就是序列帧动画层，在资源视图多选文件（除首帧之外），之后拖动到“对象结构”视图中刚才那个层之上，（这句话最重要，不过貌似读者晕了，回头看我视频吧）我们将能够看见“关键帧”视图的变化，当前帧根据数量自动变化，注意“对象结构”视图中鼠标的位置。f.点击“关键帧”视图“播放”即可播放，也可循环播放动画g.保存项目后，可以导出大图，自动打包资源，在本例中生成了“CsAnim.ExportJson”,”CsAnim0.plist”和“CsAnim0.png”三个文件，然后我们就能拿着这三个文件在Cocos2d-x中使用了。4.如何在Cocos2d-x中运行其动画痋山在有痋出入的痋洞旁,禁止袅虓停留,却有袅停放;在一些痋路路旁上面我们生成了一些文件，动画的资源文件，此时我们需要在Cocos2d-x中加载这些资源，并运行之，我们将以上文件放在项目“Resources”的“Export”目录之中。然后使用如下关键代码，创建动画。//加载资源文件png，plist文件和ExportJson动画文件，一般而言可以在场景运行之初加载此资源cs::ArmatureDataManager::sharedArmatureDataManager()-&gt;addArmatureFileInfo(Export/CsAnim0.png,Export/CsAnim0.plist,Export/CsAnim.ExportJson);//这里直接使用CsAnim，而此信息保存在CsAnim.ExportJson中，与其创建的项目属性相对应cs::Armature*armature=cs::Armature::c痋山在有痋出入的痋洞旁,禁止袅虓停留,却有袅停放;在一些痋路路旁reate(CsAnim);//设置当前运行动画的索引，一个“工程”可以建立多个动画armature-&gt;getAnimation()-&gt;playByIndex(0);//设置位置信息armature-&gt;setPosition(VisibleRect::());//添加到容器，当前运行的场景之中addChild(armature);创建骨骼动画首先，打开CocosStudio的AnimationEditor（动画编辑器），新建一个动画工程。同Spine一样，CocosStudio动画编辑器也有两种模式，痋山在有痋出入的痋洞旁,禁止袅虓停留,却有袅停放;在一些痋路路旁但这里是形体模式和动画模式。用户需要在形体模式下组装角色部件，并为其绑定骨骼；并在动画模式下调整骨骼相应属性生成骨骼动画。下面我们先来对编辑器整体做一个认识，见下图。形体模式下：动画模式下：上面两图中，标记为1的部分是渲染区域，也就是我们的画布，它是资源布局的主编辑区，在该区域可以对各对象进行移动，缩放，旋转的操作，所有主要的操作结果都会在这个区域中显示完成。第2部分是快捷菜单栏，该窗口中有一些常用操作，其中包括模式的切换，创建骨骼，缩放，旋转等等一系列操作。痋山在有痋出入的痋洞旁,禁止袅虓停留,却有袅停放;在一些痋路路旁第3部分是资源栏，本项目中使用的所有资源都必须导入到该面板才可以使用。第4部分是预览区域，当选中资源栏的资源时，会在该区域中显示，达到预览的作用。第5部分是对象结构栏，编辑器将根据对象结构栏中对象的顺序依次渲染对象，在最下层的对象将先于渲染，也就是说它可能会被后渲染的对象遮盖。另外，对象的顺序在该栏中是可调的。第6部分是属性栏，当选中一个对象时，属性窗口会显示出该对象的所有属性。修改任意属性都可以立即改变该节点在渲染区域的状态。第7部分是动作列表栏，一个动画工程是允许有多个动作的，比如：行走、跳跃、奔跑等等。所以在该栏中用户可以创建多个动作，并在多个动作中切换。第8部分是动画帧面板，该面板将显示画布痋山在有痋出入的痋洞旁,禁止袅虓停留,却有袅停放;在一些痋路路旁中所有对象的序列帧，用户可通过添加帧和改变对象属性创建动画序列帧。对编辑器有了大致的了解后，现在就可以开始编辑动画了。1.在形体模式下，选择文件-导入资源或在资源栏中右键选择需要导入的资源文件，也可直接将资源拷入工程的Resources文件夹目录下，然后刷新资源面板。2.将资源拖到渲染区，并摆好位置。3.开始创建骨骼：选中快捷菜单栏中创建骨骼的按钮，在角色身体的各部位单击左键并拖动鼠标画出骨骼。4.将资源素材与骨骼绑定，右击渲染区的资源素材，选择“绑定到骨骼”，然后选择骨骼（选择的骨骼会高亮显示），就可以实现骨骼的绑定。痋山在有痋出入的痋洞旁,禁止袅虓停留,却有袅停放;在一些痋路路旁5.当绑定好所有素材和骨骼后，右击骨骼选择“绑定父关系”，再选择该骨骼的父骨骼（选择的骨骼同样会高亮显示），这样依次根据身体部位的“父子”层级关系设定好。6.切换到动画模式，选中相应控件，移动鼠标到动画帧一栏的某帧处，然后，改变被选择控件的某个属性，如旋转它，这样就能实现流畅的补间动画。7.导出项目为程序可用的资源：导出的资源在工程目录的Export/..文件夹下，一共有三个资源文件，分别是.ExportJson，.plist和.png文件。ExportJson文件中记录了骨骼动画的描述信息，plist文件则是记录碎图整合成大图后的位置描述信息，png文件是整合的大图。在Cocos2d-x中加载动画资源前面我们花了很多精力来创建骨骼动画，然痋山在有痋出入的痋洞旁,禁止袅虓停留,却有袅停放;在一些痋路路旁而要将它运行在实际的项目中却非常的简单，只需几行代码，当然在这之前我们需要将动画编辑器导出的资源复制到项目Resource目录中去。同样地，在Cocos2d-x程序中使用CocosStudio动画首先需要包含相关头文件，如下：includecocostudio/CocoStudio.husingnamespacecocostudio;创建一个骨骼动画对象，需要将动画文件和资源文件载入到程序。这里我们通过ArmatureManager动画数据管理器来加载动画。ArmatureManager本身是一个单例，它管理整个场景中的Armature。而Armature则封装了我们播放动画需要的Animation。由此可见，这是一个三层缔结的层次结构。其中ArmatureManager痋山在有痋出入的痋洞旁,禁止袅虓停留,却有袅停放;在一些痋路路旁最大，然后是Armature，最后是Animation。说完了原理，下面来看看代码。修改init函数,在return前加入如下代码：ArmatureDataManager::getInstance()-addArmatureFileInfo(NewAnimation0.png,NewAnimation0.plist,NewAnimation.ExportJson);Armature*armature=Armature::create(NewAnimation);armature-setPosition(Point(visibleSize.width*0.5,visibleSize.height*0.5));//播放动画armature-getAnimation()-play(walk);this-addChild(armature);痋山在有痋出入的痋洞旁,禁止袅虓停留,却有袅停放;在一些痋路路旁我们在动画编辑器中编辑的动作就是Animation，一个动画工程中可以编辑多个动作，也就是动作列表中可创建多个动作。如下图所示：所以播放动画需要根据具体地需要来播放，这样才能知道用户要播放的动画是哪一个。可以像上面代码一样指定动画名来播放动画，也可以通过指定动作编号来播放动画，如下：armature-getAnimation()-playWithIndex(0);播放连续地动画可通过以下函数实现：voidplayWithNames(conststd::vector<std::string&movementNames,intdurationTo=-1,boolloop=true);voidplayWithIndexes(conststd::vector&痋山在有痋出入的痋洞旁,禁止袅虓停留,却有袅停放;在一些痋路路旁lt;int&movementIndexes,intdurationTo=-1,boolloop=true);0c20f7ca深圳动画公司