Question

我正在不同程度地绘制一条圆形线。我希望动画持续约0.5秒。由于我无法解决其运行速度的问题。

奇怪的是，如果我跳过补间并调用函数tweenToNext，它会立即呈现。

        var degrees:int;
        var posX:int = 102;
        var posY:int = 102;
        var rad:int = 100;
        var mc:MovieClip = new MovieClip();
        addChild(mc);

        mc.graphics.lineStyle(5, 0xFF0000, 1);
        mc.graphics.moveTo(posX, posY - rad)
        mc.i = -Math.PI / 2;

        tweenToNext();

        function tweenToNext(per:Number = 360):void {

            degrees += 1;

            if (mc.i <= (3 * Math.PI / 2) && degrees < per) {

                var x:Number = posX + Math.cos(mc.i) * rad;
                var y:Number = posY + Math.sin(mc.i) * rad;

                mc.graphics.lineTo(x, y); 
                mc.i += Math.PI / 180;

                TweenLite.to(mc, 0.001, {onComplete:tweenToNext});
            }

        }

我已经尝试过Timer和setTimeout但这些产生的速度相同。

Answer 1

Flash应用程序在帧到帧的基础上运行：帧渲染 - 脚本执行 - 帧渲染 - 脚本执行 - 帧渲染 - 脚本执行 - 等等。这也意味着无论你在那里放置什么最小的延迟，下一次调用都不会在下一个脚本执行阶段之前发生，基本上是下一帧。因此 - 猜猜是什么 - 你的圆形绘图需要360帧。例如，如果您有30 FPS，则为12秒。

如果您想使某些内容与实时同步，则需要采用不同的方法。我没有检查这是否有效，但我希望你能得到这个想法并修复错误。

var degrees:int;

var posX:int = 102;
var posY:int = 102;

var rad:int = 100;

var mc:MovieClip = new MovieClip;

addChild(mc);

mc.graphics.lineStyle(5, 0xFF0000, 1);
mc.graphics.moveTo(posX, posY + rad);

// Now, magic time.
// Save time since app start (in milliseconds).
var startTime:int = getTimer();

// 1000 milliseconds = 1 second.
var drawingTime:int = 1000;

// Store the maximum degree to draw.
var degreeLimit:int = 360;

// Call it every frame.
mc.addEventListener(Event.ENTER_FRAME, onDraw);

function onDraw(e:Event):void
{
    // Now we need to check how much time passes since last frame
    // and update the drawing accordingly.
    var timeProgress:Number = (getTimer() - startTime) / drawingTime;
    var drawingProgress:Number = degrees / degreeLimit;

    // When the drawing progress catches the time progress
    // the loop will end. It will resume on the next frame.
    while (drawingProgress < timeProgress)
    {
        degrees += 1;

        // It's better than a property on target canvas,
        // which could be Sprite or Shape, they wouldn't take random fields.
        var anAngle:Number = degrees * Math.PI / 180;

        var tox:Number = posX + Math.cos(anAngle) * rad;
        var toy:Number = posY + Math.sin(anAngle) * rad;

        mc.graphics.lineTo(tox, toy);

        // We should know when to stop it.
        if (dergees >= degreeLimit)
        {
            mc.removeEventListener(Event.ENTER_FRAME);
            return;
        }

        // Update the drawing progress.
        drawingProgress:Number = degrees / degreeLimit;
    }
}

Actionscript：非常慢的movieclip

1 个答案: