cocosCreator 實現加載場景進度

當某個場景的東西太多 通過 各種優化還是 不能達到 切換 特別順暢的情況下（一般是h5端） 我們可能需要 給玩家一些 假象 或者 使切換場景 “卡得理所當然” ，於是通過 cocoscreator的預加載 增加一個加載場景進度功能 是一個不錯的選擇呢

當前版本是cocoscreator 2.4.x

思路：通過預加載的 回調函數 實現 一個進入場景的 進度功能

首先先看一下 preloadScene的實現

preloadScene (sceneName, onProgress, onLoaded) {
        var bundle = cc.assetManager.bundles.find(function (bundle) {
            return bundle.getSceneInfo(sceneName);
        });
        if (bundle) {
            bundle.preloadScene(sceneName, null, onProgress, onLoaded);
        }
        else {
            cc.errorID(1209, sceneName);
            return null;
        }
    },
    

參數列表：

sceneName: String 要加載的場景名字

onProgress: Function 回調函數，當加載資源進度變化時調用

completedCount: Number 當前已經加載完的資源數目

totalCount: Number 要加載的總資源數

onLoaded: Function 回調函數, 場景加載完成後調用.

然後我們可以 在進入該場景之前 在onProgress回調中實現 加載進度功能，加載完畢 隱藏相關組件。

代碼：

TS實現

 joinScene(eventMsg) {
        cc.find("Canvas/di").active = true;
        cc.director.preloadScene("GameScene", this.onProgress.bind(this), ()=>{    
            console.log("加載成功")
            cc.find("Canvas/di").active = false;
            cc.director.loadScene("GameScene");
        })
        
    }
    onProgress(completedCount,totalCount,item){
        //可以把進度數據打出來
        console.log("completedCount",completedCount)
        console.log("totalCount",totalCount)
        
        this.loading.progress = completedCount/totalCount;
        this.loadLabel.string = Math.floor(completedCount/totalCount * 100) + "%";
    }

閱讀更多技術