Question

我正在尝试翻译＆＃34; Actionscript 3.0：Game Programming University＆＃34;转到HTML5 Canvas渲染，更具体地说，是Create / EaselJS。

这是我正在处理的代码：

    private var flipStep:uint;
    private var isFlipping:Boolean = false;
    private var flipToFrame:uint;

    // begin the flip, remember which frame to jump to
    public function startFlip(flipToWhichFrame:uint) {
        isFlipping = true;
        flipStep = 10;
        flipToFrame = flipToWhichFrame;
        this.addEventListener(Event.ENTER_FRAME, flip);
    }

    // take 10 steps to flip
    public function flip(event:Event) {
        flipStep--; // next step

        if (flipStep > 5) { // first half of flip
            this.scaleX = .20*(flipStep-6);
        } else { // second half of flip
            this.scaleX = .20*(5-flipStep);
        }

        // when it is the middle of the flip, go to new frame
        if (flipStep == 5) {
            gotoAndStop(flipToFrame);
        }

        // at the end of the flip, stop the animation
        if (flipStep == 0) {
            this.removeEventListener(Event.ENTER_FRAME, flip);
        }
    }

我知道它之前已经过了一半，只需要逐步推动每一帧正确地制作动画。这是我在HTML5中的JS等价物：

function FlipTile(e)
{
    if (!TileFlipping)
    {
        var flipStep = 30;
        var sprite = e.currentTarget;
        console.log(sprite);

        TileFlipping = true;

        flipStep--;

        if (flipStep > 15)
        {
            sprite.scaleX = .02 * (flipStep-6);
        } else {
            sprite.scaleX = .02 * (5 - flipStep);
        }


        if (flipStep == 0)
        {
            TileFlipping = false;
        }

    }
}

然而，效果表现为卡片在中心周围翻转这打破了＆＃39;倾斜＆＃39;精灵没有一步一步地翻转得很厉害。它也只发射一次，打破了翻转计数器。这使得它寻找ENTER_FRAME等价物..或另一种方法来处理它。此刻，我很难过。

Answer 1

我不确定我的问题是否正确 - 但您应该使用CreateJS Ticker来更新舞台上的内容，请查看以下文档： http://www.createjs.com/docs/easeljs/classes/Ticker.html 您只需将Event.ENTER_FRAME替换为"tick"，并保持逻辑与AS3示例中的逻辑相同。

Ticker在内部使用window.requestAnimationFrame，通常每秒运行60次（= 60fps）。 https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame

CreateJS是否包含类似于＆＃34; ENTER_FRAME＆＃34;的事件监听器。在AS3？

1 个答案: