在Haxe/OpenFL应用程序中使用SWF动画

Cre*_*gic 5 flash animation assets haxe openfl

正如Haxe与NME/OpenFL一样,从AS3开发过渡的大问题是资产.尽管Haxe与as3类似,OpenFL试图提供熟悉的API,但缺乏SWF支持会吓跑许多开发人员.我对这个主题的研究使我理解当前的SWF是相当弱的并且有很多错误,需要对SWF文件进行许多编辑才能在Haxe中运行它.

问题是你如何在OpenFL应用程序中使用SWF动画,或者如果你不使用SWW动画 - 你找到了关于渲染时间,处理器时间和文件大小的最佳解决方案.

Cre*_*gic 11

花了更多的时间在研究上并询问其他开发人员,我把一小部分可能的替代方案放在一起,将SWF资产用于动画.希望它能帮助其他开发人员,他们在SWF动画支持较弱时遇到类似问题.

注意:选择所有方法时考虑了三个对我很重要的因素:所有平台的可用性,性能和资产的文件大小.因此,并未包括所有可能的方法.

测试:HTML5,Android,iOS

  • 使用Haxe/OpenFL可以实现SWF动画,但是几乎没有规则:没有补间 - 所有动画都是逐帧的.矢量艺术应该被缓存为位图,保存为位图或预渲染为位图序列,就像在某些平台上一样(例如neko),矢量艺术正被转换为具有丑陋边缘的光栅.如果将MovieClip表示为图形,则会报告一些错误,反之亦然,但我没有注意到HTML5,Flash,iOS,Android版本上的任何错误.如果循环,嵌套动画有时可能会跳过帧(也没有看到,也许NME/OpenFL的旧版本可以做到这一点).我认为这是从文件大小和平台可用性的关注中动画内容的一种相当好的方法,但编辑所有资产以满足Haxe支持的要求是一件令人头疼的事.之后重用这些资产并不好玩,因为它们都是逐帧动画,而且很乱.

  • 雪碧表动画.由于更高的渲染性能,主要用于HTML5目标.这直接来自openGL标准,因此该方法应适用于所有openGL目标.我们的想法是拥有一个大文件,节省打开/加载多个较小文件的时间.性能良好,适用于所有经过测试的平台,但文件大小很快就会失控,很难用于对象大小变化的动画 - 不必要的大透明空间,旋转图像以最大限度地适应空间通过在运行时编辑转换矩阵来渲染性能.

  • 帧序列又名PNG序列动画.个人喜欢.它在所有平台上运行良好且速度快,可以预渲染动画(就像上面的任何其他方法一样),转换为BitmapData数组,流加载等.它确实需要大量的磁盘空间用于动画,但是可以通过在使用资产之前加载资产(HTML5,SWF)来软化,这对于移动设备来说并不重要 - 因为即使1-2GB的应用程序也适合市场.我发现自己的一大优势是,这种类型的资产可用于任何其他开发标准(C++,Java,cocos2d),并在需要时保存为Sprite表(例如cocos2d,像HTML5一样,喜欢Sprite表,而不是其他任何内容. Roger Engelbert的官方书籍COCOS2DX).
    有了这种灵活性,良好的性能是可以容忍的文件大小我比上面列出的任何其他方法更喜欢这种方法.

  • 骨骼动画 - PNG数组+属性列表.另一种方法是具有动画对象的单独图像和每帧的每个图像矩阵数据.这种方式使用最少的磁盘空间可以制作成千上万的动画.缺点是:为更复杂的动画制作嵌套动画更难(不是不可能),常量矩阵变换限制了显示列表上活动动画的数量(HTML5的可怕方法,其他平台保持良好)以及资产的可重用性很小.通常它是导出到此类型的相同的旧SWF资产,因此编辑FLA而不是骨骼动画本身是有意义的.

当然,我错过了一些很好的观点,有很多方法可以让图形动画效果,有些方法可能比其他方式更适合你,所以请随意留下评论和批评,但我仍然希望这个主题有用.


lar*_*ime 5

这个问题可能已经过时了.我在5分钟前在Haxe/OpenFL编译了一个C++应用程序,并且可以轻松获得SWF动画(使用补间动画).

这是一个gif录音:https: //imgflip.com/gif/7l02f

我有一个名为"library.swf"的资产,其中包含该动画,导出为"Oluv"​​类

这需要"swf"库,它现在是免费的,可以安装"haxelib install swf"

在我的示例中,我将其添加到我的application.xml文件中:

<haxelib name="swf" />
<library id="oluvLib" path="assets/library.swf" type="swf"/>
Run Code Online (Sandbox Code Playgroud)

然后把它放在一个标准的OpenFL模板项目中:

Assets.loadLibrary("oluvLib", swfAssetsLoaded);

private function swfAssetsLoaded(library:AssetLibrary):Void {
    var oluv = Assets.getMovieClip("oluvLib:Oluv");
    addChild(oluv);
    oluv.x = (stage.stageWidth - oluv.width) / 2;
    oluv.y = (stage.stageHeight - oluv.height) / 2;
}
Run Code Online (Sandbox Code Playgroud)

补间似乎不适用于neko目标,但它们在C++和flash(当然)中运行良好.