tween-egret.Tween

egret.Tween 使用範例

class Main extends eui.UILayer {

    protected createChildren(): void {
        super.createChildren();
        egret.lifecycle.onPause = () => egret.ticker.pause();
        egret.lifecycle.onResume = () => egret.ticker.resume();
        egret.registerImplementation('eui.IAssetAdapter', new AssetAdapter());
        egret.registerImplementation('eui.IThemeAdapter', new ThemeAdapter());
        this.runGame();
    }

    private async loadResource() {
        let loadingView = this.stage.addChild(new LoadingUI()) as LoadingUI;
        await RES.loadConfig('resource/default.res.json', 'resource/');
        await new Promise(resolve => new eui.Theme('resource/default.thm.json', this.stage).once(eui.UIEvent.COMPLETE, resolve, this));
        await RES.loadGroup('preload', 0, loadingView);
        this.stage.removeChild(loadingView);
    }

    private async runGame() {
        await this.loadResource();
        // --- Edwin 給你最乾淨的程式碼, 從這行以下開始寫喔 ---

        // 繪製圓型元件
        const s = new egret.Shape();
        s.graphics.beginFill(0xFFCC00);
        s.graphics.drawCircle(50, 50, 50);
        s.graphics.endFill();
        this.addChild(s);

        // 物件用 get 綁定動畫
        egret.Tween.get(s, {
            // 讓動畫循環播放
            loop: true,
            // 每次動畫變化執行一次
            onChange: () => { 
                // 查看位移變化
                egret.log(s.x, s.y); 
            }
        }).set({ // 設定起始座標與透明度
            x: 0, 
            y: 0,
            alpha: .1
        }).to({ // 設定終止座標與透明度
            x: 100, 
            y: 100,
            alpha: 1
        }, 1000, egret.Ease.circOut) // 執行 1 秒 circOut 動畫
        .wait(1000) // 等待 1 秒
        .to({ // 沒設置 Ease 會勻速移動
            x: 200,
            y: 0
        },1000) 

    }

}