eui-eui.CollectionEventKind

eui.CollectionEventKind 使用範例


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 ac = new eui.ArrayCollection();
        ac.source = [1, 2, 3]; // 設置資料源
        ac.addEventListener(eui.CollectionEvent.COLLECTION_CHANGE, this.onCollectionChange, this);
        ac.addItem(5); // add 1,2,3,5 3
        ac.addItemAt(6, 1); // add 1,6,2,3,5 1
        ac.source.sort();
        ac.refresh(); // refersh 1,2,3,5,6 0
        ac.removeItemAt(2); // remove 1,2,5,6 2
        ac.removeAll(); // remove '' 0
        ac.source = [1, 2, 3]; // reset 1,2,3 0
        ac.replaceItemAt(7, 1); // replace 1,7,3 1
        ac.source[1] = 8;
        ac.itemUpdated(1); // update 1,8,3 0
        
        // ArrayCollection 比一般 number[], string[]..等 array 物件多了增刪修改監控事件
        // eui.DataGroup, eui.List 當元素修改視圖也會跟這修改, 
        // 就是善用 ArrayCollection 的事件機制來更新視圖

    }

    private onCollectionChange(e: eui.CollectionEvent): void {
        switch (e.kind) {
            case eui.CollectionEventKind.ADD: // 集合添加一個或多個項目時
                egret.log('add' + ' ' + e.currentTarget.source + ' ' + e.location);
                break;
            case eui.CollectionEventKind.REFRESH: // 集合應用排序或篩選
                egret.log('refersh' + ' ' + e.currentTarget.source + ' ' + e.location);
                break;
            case eui.CollectionEventKind.REMOVE: // 集合刪除一個或多個項目
                egret.log('remove' + ' ' + e.currentTarget.source + ' ' + e.location);
                break;
            case eui.CollectionEventKind.REPLACE: // 集合取代某一項目
                egret.log('replace' + ' ' + e.currentTarget.source + ' ' + e.location);
                break;
            case eui.CollectionEventKind.RESET: // 集合陣列置換時
                egret.log('reset' + ' ' + e.currentTarget.source + ' ' + e.location);
                break;
            case eui.CollectionEventKind.UPDATE: // 集合某一項目更新時, 受影響的項目存在 e.items 裡
                egret.log('update' + ' ' + e.currentTarget.source + ' ' + e.location);
                break;
        }
    }

}

spacer

沒有留言:

張貼留言