actionscript 3 动画抖动问题答案

【问题标题】：actionscript 3 animation shaking problemactionscript 3 动画抖动问题
【发布时间】：2011-08-21 21:00:29
【问题描述】：

请帮帮我，我的客户要杀了我！

这是一个链接：http://aradon.co.il/test/circles.html

现在你看到圆圈是如何晃动的！！！我的客户不会这样批准它。

是什么原因造成的？

它是这样构建的

一个类调用 Path 有一个 EnterFrame 事件

和每个圈子都有的6个圈子：

    private var _aPosition:Number = 0;

    public function get aPosition():Number
    {
        return _aPosition;
    }

    public function get aRadians():Number
    {
        return  180 / Math.PI * _aPosition;
    }

    public function set aPosition(value:Number):void
    {
        _aPosition = value % 360;

        if(parentPath)
        {
            x = Math.cos(aRadians) * (parentPath.width / 2);
            y = Math.sin(aRadians) * (parentPath.height / 2);
        }
    }

我如何围绕路径旋转一个圆圈。

现在路径类在 enterframe 上有这个代码：

    private function this_enterframe(e:Event=null):void
    {
        for(var i:int = 0; i < numCircles; i++)
        {
            getCircleAt(i).aPosition += direction == RIGHT ? -speed : speed;


        }
    }

圆圈上的图像是动态的，文本也是动态的，但在我添加它们之前它在晃动。

帧率是 30 我也试过 25 20 40 并且一直在晃动？？

请给我一个线索。

更新：我在circle类构造函数中添加了：

      z = 1

就像@Sean Fujiwara 建议的那样，有很大的改进

这是一个链接：http://aradon.co.il/test2/circle.htm

但是客户对我说钢材不好。

【问题讨论】：

标签： flash actionscript-3 animation

【解决方案1】：

cacheAsBitmap 如果您在 Circle 类中设置它可能会有所帮助。如果您将其设置在主类上，它不会有帮助，实际上可能会受到伤害。将 cacheAsBitmap 设置在其子项没有更改的 DisplayObject 上时，您将获得最大的提升，因此它可以将其缓存一次，然后仅在舞台周围平移该对象。如果孩子们正在移动（就像你的parent 的情况一样），那么它必须每帧重绘和重新缓存该元素，并且你不会获得任何性能提升。 cacheAsBitmap 确实最适合具有复杂矢量图形的元素，这些矢量图形很难重绘但很少更改。

我不认为将 x 和 y 值四舍五入会有所帮助，我在设置小数 x,y 时从来没有遇到过什么问题。对于矢量图形，它通常在亚像素放置方面做得很好，而对于位图，它通常按我预期的方式工作。

我认为您可能想要使用一些与帧速率无关的动画。你的代码现在的结构方式，每一帧渲染你都在移动一个特定的度数。这意味着，如果帧率由于某种原因出现卡顿，那么您仍将移动相同数量的像素。

这是我要去的方向：

首先，您的输入帧事件处理程序会获得一些更新。 getTimer() 返回自 swf 启动以来的当前毫秒数。因此，通过记住我们渲染的lastTime 并减去currentTime，我们应该能够准确地确定自上一帧以来经过了多少毫秒。然后，我们可以使用该时间而不是任意速度/距离来更新我们的圈子。

private var lastTime:int;

private function this_enterframe(e:Event = null):void {
    var currentTime:int = getTimer();
    var elapsedTime:int = currentTime - lastTime;
    lastTime = currentTime;

    for(var i:int = 0; i<numCircles; i++)
    {
        getCircleAt(i).updatePosition(elapsedTime, direction)
    }
}

然后在您的 Circle 类中，我们应该能够计算它应该在一段时间内移动多远（在这种情况下，我输入了它的速度作为它应该移动的每秒弧度数）。

类似：

public class Circle extends MovieClip {

    // Set the default speed to 10 degrees per second
    public const DEFAULT_SPEED:Number = 10 * Math.PI / 180;

    private var _radiansPerSecond = Circle.DEFAULT_SPEED;
    private var _rotationPosition:Number = 0;

    public function updatePosition(elapsedTime:int, direction:*):void { 
        var chng:Number = _radiansPerSecond * (elapsedTime / 1000) * (direction == RIGHT ? -1 : 1);
        _rotationPosition += chng;
        this.x = Math.cos(_rotationPosition) * (parentPath.width / 2);
        this.y = Math.sin(_rotationPosition) * (parentPath.height / 2); 
    }
}

在使用弧度而不是度数和根据自上次渲染后经过的时间动态计算圆应该移动多远之间，我认为您应该能够减轻您所看到的抖动。

【讨论】：

感谢您提供非常有用的信息，但它不喜欢它

【解决方案2】：

既然听起来你很着急，请尝试将其放入 Path 构造函数中：

z = 1;

如果您设置speed = 0.00001，您可以看到它现在正在进行亚像素渲染。

另外，我看到您在路径对象中设置了cacheAsBitmap = true。这只对性能不利。

【讨论】：

我也试试，听起来很棘手（;
z = 1 技巧有很大的改进！！！检查：aradon.co.il/test2/circle.htm
太好了。如果你想知道我是怎么想出来的（除了知道那个技巧），我把你的 swf 放到SWFWire Debugger 并玩弄属性直到它变得流畅。

【解决方案3】：

尝试在每个移动的 DisplayObject 上将 cacheAsBitmap 设置为 true。这可能会使您的动画变得平滑。

如果您的圆圈是位图，那么您也可以尝试打开平滑。

【讨论】：

我在圈子或主类或路径中的任何地方都试过了，但它不起作用。 :(

【解决方案4】：

始终确保您的 x 和 y 位置是整数，没有半像素这样的东西，但 Flash 无论如何都会尝试实现它。*sigh*

它应该像四舍五入你的 x 和 y 值一样简单：

x = Math.round( Math.cos(aRadians) * (parentPath.width / 2) );
y = Math.round( Math.sin(aRadians) * (parentPath.height / 2) );

【讨论】：

这只会让他们更加颤抖！

【解决方案5】：

如果我尝试为文本设置动画，我会得到这个。因此，要修复它，我只需将文本分开（单击文本并按两次 CTRL+B）。

你对那些小人物的印象是否破碎了？尝试选择一个，然后打破它（按 CTRL+B）。此外，圆圈内的文本，如果是静态文本，只需尝试打破它，看看是否可以解决抖动问题。

【讨论】：

【解决方案6】：

将你的圆圈画成位图，然后应用平滑处理。

【讨论】：

【解决方案7】：

e.updateAfterEvent();。

但要使用它，您需要使用Timer 类。

这会在事情发生时增加平滑度。

【讨论】：