2

html5 キャンバスに描画する Renderer クラスがあり、ウィンドウのサイズが変更されたときに再描画したいと考えています。問題は update() コードが一度しか実行されないことです - initialize() の中で - ウィンドウのサイズを変更しても何も起こりません。一方、ウィンドウのサイズが変更されるたびに onWindowResized() が実行されます。では、どこが間違っているのでしょうか。

/// <reference path="../lib/easeljs.d.ts" />
/// <reference path="../lib/tweenjs.d.ts" />
/// <reference path="../lib/soundjs.d.ts" />
/// <reference path="../lib/preloadjs.d.ts" />

class Renderer
{
    private mStage:createjs.Stage;
    private mShape:createjs.Shape;

    public initialize (stage:createjs.Stage):void
    {
        this.mStage = stage;
        this.mStage.autoClear = true;
        this.update ();

        window.onresize = this.onWindowResized;
    }

    public update ():void
    {
        if (this.mStage)
        {
            this.mStage.canvas.width = window.innerWidth;
            this.mStage.canvas.height = window.innerHeight;

            this.mShape = new createjs.Shape();
            this.mShape.graphics.beginFill("#dddddd");
            this.mShape.graphics.drawRect(0, 0, this.mStage.canvas.width, this.mStage.canvas.height);
            this.mShape.graphics.beginFill("#ff4400");
            this.mShape.graphics.drawCircle(this.mStage.canvas.width / 2, this.mStage.canvas.height / 2, 25);

            this.mStage.addChild(this.mShape);
            this.mStage.update();
        }
    }

    private onWindowResized (event:UIEvent):void
    {
        this.update();
    }
}
4

1 に答える 1

2

ここでの問題は、イベントが実行されると、クラスではなく、イベントのコンテキスト (サイズ変更のウィンドウ、クリックの DOM 要素、マウスオーバーなど) にthisなることです。クラス。

あなたはそれを使用してそれを解決することができます...

window.onresize = this.onWindowResized.bind(this);

これはbind、ファットアロー構文よりも優雅な 1 つの例です。

于 2013-10-07T12:31:14.917 に答える