关于pc上的flash动画转移到Cocos2d-x使用

关于pc上的flash动画转移到Cocos2d-x使用

Jetion:

某些时候，我们可能需要把pc上面的Flash动画拿到Cocos2d-x上面使用。

解决方案：

第一：

若你的.fla源文件中不带有骨骼动画，则你可以使用TexturePacker结合AnimatePacker来解决这个问题。

a.把.fla文件导出为.swf

b.把.swf文件直接丢到TexturePacker中，它会自动帮你解析出所有的帧，并导出为.plist文件，它附带一张.png图

c.把.plist文件丢到AnimatePacker中，它也会自动帮你解析出所有的帧，然后根据需要，制作你动画，AnimatePacker不知道怎么使用的，可以看我前面的文章。

这样你的Falsh动画就能转移到Cocos2d-x使用了。

这种方案在b这个步骤的时候经常会遇到一个问题，就是你丢进去的.swf文件只能帮你解析出来一帧，接下来我们来分析这种情况。

出现这种情况的原因：大部分的Flash动画都是比较复杂的，它包含了多套的动画方案，而且它们一般都不是设计在主场景中的，而是绑定在各个元件中的，主场景中只是丢了一张图片。这样就带来了问题了，因为TexturePacker只会解析你主场景中的帧动画，所以，你就只解析到了一张图片。

那这个问题我们要怎么解决呢？跟TexturePacker的作者商量一下吧。能不能把元件中的帧动画也解析了呢。或许以后可以，但是至少目前是不行的。所以，我们能做的就是如下：

a.在Flash cs6中文件->新建->ActionScript 3.0，新建一个.fla文件，假设我们命名为new.fla

b.选中原.fla文件中元件里面绑定的帧动画，右键复制帧，黏贴到new.fla的主场景中，你可以把所有元件中的动画都黏贴到new.fla中，这不会影响我们之后的读取。都完成之后，右键另存为new.swf。

c.然后把new.swf文件丢到TexturePacker中，怎么样，是不是所有帧都出来了？而且一样的帧TexturePacker还会自动帮你合并到一起，可以减少生成的.png图片大小。导出为.plist文件，附带一张.png图。

d.把.plist文件丢到AnimatePacker中，它也会自动帮你解析出所有的帧，然后根据需要，制作你动画。

这种方案或许比较繁琐，但是是目前我能实现的不带骨骼动画的.fla文件的移植到Cocos2d-x中使用的方法。接下来介绍一下带骨骼动画的.fla文件又是如何导出为Cocos2d-x可以使用的文件

第二：

第二个方案我们是要使用到的一个工具叫Flash2Cocos2d-x，至于安装方面问题，也可以看看我前面的文章。

当我们的.fla文件中不带骨骼数据的时候，我们使用的上面的方案。我也尝试使用Flash2Cocos2d-x来导出，但是在Import选项上面时，第一个和第二个都没有反映，第三个提示不包含骨骼数据，或许这个工具只能用来导出骨骼动画吧！

所以，你也可以把这个方案当作Flash2Cocos2d-x的一点资料吧。

大体步骤如下：

打开.fla文件，窗口->其他面板->SkeletonSWFPanel，打开面板，点击import（默认为All library items），若你有封装了骨骼信息的.swf文件，也可以选择第三项。waiting......然后所有的骨骼信息就都出来了。

至于具体的这个工具怎么做骨骼动画，可以参考作者的文章。

然后Export导出文件，

这边有4个选项，第一个会直接导出一张封装了骨骼信息的PNG图片，第二个导出带有骨骼信息的swf动画，第三个暂时不明白，第四个导出许多单张的PNG图片和XML文件。据论坛上面使用过这个工具的朋友说（这个方案本人没在Cocos2d-x中引用过），一般都是使用第四个选项，然后再使用TexturePacker工具，把所有的单张图片生成图片集.plist文件，这样需要放入到Cocos2d-x 资源文件夹中的文件就有.png   .plist    .xml 3个文件，跟第一种方案最后是一样的。但是它们在Cocos2d-x中引用需要使用不同的类库（关于类库在cocos2d-x2.0.4中报错的问题，应该改一下类的路径就可以了）。这边需要用到的类库就是在下载的工具里面的Flash2Cocos2d-X子文件夹中的类（大概有40+，是不是全部需要用到，我没实践过）。

最后在代码方面的实现：

// step 1: add your skeleton xml file
//CCConnectionData::sharedConnectionData()->addData("knight.xml");
CCConnectionData::sharedConnectionData()->addData( "zombie.xml" );

// step2: add plist and png to cache
CCSpriteFrameCache::sharedSpriteFrameCache()->addSpriteFramesWithFile( "zombie.plist" , "zombie.png" );

// step 3: create a CCSpriteBatchNode
//CCSpriteBatchNode *batchNode = CCSpriteBatchNode::create("knight.png");
CCSpriteBatchNode *batchNode = CCSpriteBatchNode::create( "zombie.png" );

// step 4: create a armature just need armature name, plist, picture, and a CCSpriteBatchNode
// armature = CCArmature::create("Knight_f/Knight", "Knight_f/Knight", "knight.plist", "knight.png", batchNode);
armature = CCArmature::create( "Zombie_f/Zombie" , "Zombie_f/Zombie" , batchNode);

armature->getDisplay()->setPosition(ccp(size.width/2, size.height/2));
armature->getDisplay()->setScale( 1 );

// step 5: play the animation
armature->getAnimation()->playTo( "stand" );

这个工具对于骨骼动画的支持还是挺好的，很期待作者继续更新。

当然我们也可以使用CocosBuilder来做骨骼动画，在CocosBuilder做骨骼动画的时候，遇到了一个骨骼动画和Cocos2d-x里面的action结合出现action只运行固定时间的异常，比如我action设置的是2s，但是它只运行0.5s就停止了，至于这个问题是什么导致的，暂时还没解决，以后解决了会在我的博客上面补上。如果有哪位朋友懂的，麻烦指导一下！

总结一下：

第一：PC上面的不带骨骼动画的.fla文件我们导出为.swf文件后，结合TexturePacker和AnimatePacker来开发

第二：带骨骼动画的.fla文件或者是分装了骨骼信息的.png和.swf文件，我们可以使用Flash2Cocos2d-x结合TexturePacker来开发。

第三：制作骨骼动画可以使用Flash2Cocos2d-x，也可以使用Cocosbuilder来制作，关于使用Cocosbuilder如何制作骨骼动画，可以看我前面的博客。

CocosBuilder2.1制作骨骼动画以及Cocos2d-x Windows下使用骨骼动画

Cocos2d-x结合Cocosbuilder开发游戏大致流程

（转载）Creating a Game with CocosBuilder

特别推荐第三篇文章，真的是一篇非常好的文章，感谢作者的分享！！！