Question

我正在尝试创建一个非常简单的动画，使用Flex（在浏览器中运行）连续在屏幕上移动300像素的图像。我发现动画非常不稳定。每次运行动画时，结果都不同。有时动画会在发生波动之前播放几秒钟，有时它会立即发生。这是在Internet Explorer和Firefox中的多台Windows 7计算机上测试的。

我尝试过几种不同的方法，似乎没有一种方法可以阻止这种不稳定/抖动。

方法1：使用s：move

<fx:Declarations>
<s:Power id="_powerEasing" exponent="1" />
<s:Move id="_moveRight" target="{_sword}" xFrom="{_swordMin}" xTo="{_swordMax}"
                duration="1000"
                easer="{powerEasing}" />
</fx:Declarations>

<s:BitmapImage id="_sword" visible="true" scaleX=".99" scaleY=".99"
    source="@Embed('/assets/images/combat2/attackbar/sword.png')" x="0" y="0" />

使用_moveRight.play（）;

调用

我尝试的第二种方法是在每个输入框架上移动图像对象。图像的新x位置是通过获取时间差并乘以速度来计算的。看起来像这样：

var now:Number = getTimer();
var toMove:Number = ((now - _lastTime) / 1000) * _speed;
_sword.x += toMove;
_lastTime = now;

尝试的第三种也是最后一种方法是将其创建为Flash中的影片剪辑。这也太不稳定了。

最好的结果是方法1。

我已尝试使用s：BitmapImage，mx：Image以及使用FlexSprite，但我开始认为必须有一些我缺少的东西才能使其顺利进行。

我遗漏的任何想法或最佳做法会对这个动画有所帮助吗？

修改：感谢所有建议，但一切都没有效果。

这是一个简单的例子。我启用了视图源，因此您可以看到实现。 http://legionofderp.com/sword-demo/SwordTestDemo.swf

它最初可能会平稳运行几秒钟，但动画开始变得非常不稳定

编辑2：这是另一个例子，这个是使用Flash创建的。 http://legionofderp.com/testing-sword-03.swf

回答感谢所有人的建议。通过将html模板中的wmode参数设置为direct，我能够让动画顺利运行。

Answer 1

尝试使用Enterframe event rathar而不是计时器（getTimer或setInterval）。根据我的经验，我注意到计时器是CPU密集型的，因此也会影响动画。虽然enterFrame事件运行更顺畅。试试吧。

addEventListener(Event.ENTER_FRAME , move ) 

function move ( e:Event)
{

  // your animation code here
}

Answer 2

当它抖动时，动画运动真的很慢（每次迭代都是<1px运动）？如果是这样，您可能想尝试将位图上的pixelSnapping属性强制为NEVER。

此外，您是否尝试过切换CPU或GPU加速 - 如果是这样，结果相同？

在独立的Flash播放器中运行会产生相同的效果吗？

编辑：刚刚注意到你添加了缩放属性，它应该覆盖像素捕捉。

使用Flex时非常不稳定的动画

2 个答案: