Egret分步加载资源改写loading界面

第一步: (在配置文件default.res.json中)先确定好分步加载资源的资源列表,将loading界面所需要的资源区分出来.

第二步:(在脚本入口文件Main.ts中)修改资源加载顺序以使用loading界面所需的资源!

private async loadResource() {
    try {
        await RES.loadConfig("resource/default.res.json", "resource/");
        await RES.loadGroup("start");  /*加载start组的资源*/
        const loadingView = new LoadingUI();
        this.stage.addChild(loadingView);
        await RES.loadGroup('preload', 0, loadingView)
        this.stage.removeChild(loadingView);
    }
    catch (e) {
        console.error(e);
    }
}

第三步:(在LoadingUI.ts文件中)修改Loading界面的加载时机

public constructor() {
    super();
    this.addEventListener(egret.Event.ADDED_TO_STAGE,this.createView,this);
    // this.createView();
}

第四步:(同第三步文件)绘制界面,使用加载好的资源,并获取stage属性调整资源

//例如:
private async createView() {
    this.width = this.stage.stageWidth;
    this.height = this.stage.stageHeight;
    // 加载背景图
    let bg: egret.Bitmap = new egret.Bitmap(RES.getRes('UI_jiazai_Img_ditu_jpg'));
    bg.width = this.width;
    bg.height = this.height;
    this.addChild(bg);
}

      注意:这个步骤使用了异步加载的资源,所以该方法也要作为异步方法使用