将Flash动画转换为Cocos2D

抽象

我需要的是一种技术,给定单个但分层的Flash动画,将每个关键影片剪辑的位置和旋转作为XML导出。

将此信息读入cocos2d-ready格式的代码可以节省大量时间,但不是必需的,因为我知道如何实现这一点。

我们的艺术家经常使用Flash绘制矢量,并拥有精彩和令人印象深刻的动画。 我们过去将这种艺术应用到我们的游戏中的技术是将单独的动画导出为一系列png,将它们粘贴在精灵表中,并将它们转换为CCAnimations。

这种技术效果很好,由于spritesheets和pvrtc,我们可以在20MB空中下载限制中获得相当多的艺术。 然而,随着我们的成长,我们希望制作更大更好的游戏,这意味着更多的艺术!

我现在想要实现的是通过使用关键帧技术来模仿Flash行为,删除重复的艺术作品, 大量减少艺术品的数量

即使用当前技术,一个角色将采取:

具有10帧(例如100 * 300分辨率,30k像素)的步行序列将在每个姿势中具有10个全尺寸人类。 (总共1000 * 300分辨率, 一个动画300k像素

说5个类似的动画总共150万像素

同一角色的理想结果:

1右腿:(40 * 30,1200像素)

1个左腿:(40 * 30,1200像素)

1躯干(50 * 50,2500像素)

1个左臂(40 * 30,1200像素)

1个右臂(40 * 30,1200像素)

1头(30 * 30,900像素)

所有动画的总计(8200像素)

和一个xml文件来解释每个帧的每个部分的转换。

我对Flash的了解有限。 我已经导出了很多艺术品,所以这不是问题,但我在Actionscript或导出其他信息方面没有多少经验。 我注意到Export Motion as XML选项,但它没有提供我需要的信息(它不会遍历影片剪辑的子节点来获取它们的变换)。

Objective-c方面的问题不是问题,我知道如何解析XML,但如果有人已经写过这个,我会非常感激,如果你想分享。

我从来没有找到任何现有的工具,因此最终学习了一些ActionScript并自己编写解决方案。

不幸的是,由于公司政策,我将无法共享我的代码,但我将概述我需要采取的步骤


ActionScript / Flash

  • 逐步完成每一帧
  • 让孩子们在那个框架上登台,并注意他们的变形
  • 通过他们的每个孩子,并注意他们与父母的关系
  • 递归执行此操作,直到孩子没有孩子或您已到达DrawingObject
  • 将信息另存为XML

艺术

  • 从库中导出所需的每个符号并添加到精灵表。 (我用JSFL做过这个)

Obj-C / Cocos2d

  • XML应该包含一组框架,每个框架包含一个子框列表,并且递归地表示每个框架的子框架。 每个子节点都包含转换信息。
  • 读入此XML,将子项添加到动画的帧中,同时将它们添加到各自的父项中。 应用儿童的变形。

希望这有助于其他人。

我假设你的问题是关于“减少质量”部分。 你一定要看看TexturePacker 。 使用TexturePacker,您可以创建纹理图集,其中仅包含多个相同动画帧的单个图像,同时保留使用其原始文件名处理该帧的function。

TexturePacker有一个cocos2d和flash导出器,可以从通常的文件格式导入。 如果您的需求不尽如人意,可以联系作者AndreasLöw。 他非常敏感,致力于提供最好的质地包装工具。

我写了自己的轻量级解决方案。

一个简单的库,用于在iOS / cocos2d中导出和动画Flash符号,包含示例。

工作流程:

  • 使用包含图形符号的动画图层在Flash中将动画创建为MovieClip。
  • 使用包含的JSFL脚本将动画导出为JSON +帧PNG。
  • 将PNG转换为精灵表(使用您自己的工具,我使用 – http://www.codeandweb.com/texturepacker
  • 在应用包中包含动画JSON文件和精灵表。
  • 加载纹理,使用简单命令在sprite上运行复杂的多层动画。

在github上查看:

  • Cxos2d 2.x的FxAnimation
  • Cocos2d V3 RC1的FxAnimation

这是我的第一个github提交,我很好奇人们如何找到它,所以让我知道。