引擎： CocosCreator 3.8.0

环境： Mac

Gitee: oops-game-kit

注： 作者dgflash的oops-framework框架QQ群： 628575875

简介

---

在CocosCreator中，资源可以分为两大类：

1. 静态引用资源
2. 动态引用资源，包含动态加载和远程下载

放置在 assets 目录下的所有资源，均继承于Asset，而这些资源的动态加载主要是通过 Bundle。

Bundle 存在多个，主要有两类：

• 内置Bundle， 主要是resources、start-scene、main等
• 自定义Bundle， 由开发者设定文件夹自定义的，用于对资源进行更好的管理和使用

Bundle 的使用主要通过CocosCreator引擎封装的AssetManager进行资源的远程下载、加载和释放等。

更多关于CocosCreator资源管理的详情可参考博客：

CocosCreator 之 resources动态加载

CocosCreator 之 Bundle的使用

CocosCreator 之 AssetManager资源管理和释放

了解这些，对了解dgflash作者分享的oops-framework框架下的资源管理是有帮助的。

ResLoader

oops-framework 中的资源管理主要被 ResLoader管理，用于管理各种不同类型资源的加载和释放。

在 Oops.ts中的定义如下：

// ../oops-plugin-framework/assets/core/Oop.ts
export class oops {/** 资源管理 */static res = new ResLoader();
}

使用的简单方式是：

let url = `game/textures/image/spriteFrame`;
oops.res.load(url, SpriteFrame, (err, spriteframe) => {if (err) {return console.error("load spriteframe failed:" + err.message);}this._blockSprite.spriteFrame = spriteframe;
});

这种方式同resources.load的方式很是相像。在框架中使用ResLoader对于资源的管理特点是：

• 加载默认 resources 文件夹中资源
• 加载默认 bundle 远程资源
• 主动传递 bundle 名时，优先加载传递 bundle 名资源包中的资源

主要接口有：

参数或接口	说明
defaultBundleName	全局默认加载的资源包名，默认resources
load()	加载单一任意类型资源
loadAsync()	异步加载单一任意类型资源
loadDir()	加载文件夹中资源
loadRemote()	加载远程资源
loadBundle()	加载资源包
get()	根据路径，资源类型获取资源
dump()	打印缓存中所有资源信息
release()	通过相对路径释放资源
releaseDir()	通过文件夹路径释放所有文件夹中资源

在项目启动InitRes.ts中加载必备资源或可选资源时，就能够看到资源管理的使用。

// 加载远程资源，使用loadBundle进行加载
private loadBundle(queue: AsyncQueue) {queue.push(async (next: NextFunction, params: any, args: any) => {// 设置默认加载的外部资源包名oops.res.defaultBundleName = oops.config.game.bundleName;if (oops.config.game.bundleEnable) {await oops.res.loadBundle(oops.config.game.bundleServer, oops.config.game.bundleVersion);}else {await oops.res.loadBundle(oops.config.game.bundleName);}next();});
}// 加载自定义内容 使用load进行单一资源加载
private loadCustom(queue: AsyncQueue) {queue.push(async (next: NextFunction, params: any, args: any) => {// 加载多语言对应字体oops.res.load("language/font/" + oops.language.current, next);});
}// 加载公共资源, 使用loadDir进行目录加载
private loadCommon(queue: AsyncQueue) {queue.push((next: NextFunction, params: any, args: any) => {oops.res.loadDir("common", next);});
}

示例

---

图片动态加载、图片远程加载、Spine动态加载的示例：

export class UIResLoadLayer extends Component {@property(Sprite) sprite: Sprite = null; @property(sp.Skeleton) spine: sp.Skeleton = null; // 图片动态加载public clickImgLoad() {let url = "game/texture/game1/spriteFrame"oops.res.load(url, (err, spriteframe) => {if (err) {console.log("资源加载失败", err);return;}this.sprite.spriteFrame = spriteframe;})}// 图片远程加载public clickRemoteLoad() {let url = "https://oops-1255342636.cos-website.ap-shanghai.myqcloud.com/img/bg.png";var opt = { ext: ".png" };var onComplete = (err: Error | null, data: ImageAsset) => {const spriteFrame = new SpriteFrame();const texture = new Texture2D();texture.image = data;spriteFrame.texture = texture;this.sprite.spriteFrame = spriteFrame;}oops.res.loadRemote<ImageAsset>(url, opt, onComplete);}// spine动态加载public clickSpineLoad() {let url = "game/spine/model1"oops.res.load(url, sp.SkeletonData, (err, sd: sp.SkeletonData) => {if (err) {return console.error(err.message);}this.spine.skeletonData = sd;this.spine.setAnimation(0, "AttackCritical_Arch", true);});}
}

注：在ResLoader.ts提供的接口中，有着相关的代码示例，这里就不复制粘贴了。

有一点需要注意，如果存在 Bundle ，在项目启动的时候会优先加载

// InitRes.ts
entityEnter(e: Initialize): void {var queue: AsyncQueue = new AsyncQueue();/** 加载远程资源配置 */this.loadBundle(queue);// ...queue.play();
}private loadBundle(queue: AsyncQueue) {queue.push(async (next: NextFunction, params: any, args: any) => {// 设置默认加载的外部资源包名oops.res.defaultBundleName = oops.config.game.bundleName;// 加载外部资源包// ...next();});
}

这里会默认将defaultBundleName修改为指定的BundleName, 如果需要动态加载 resources 目录中的资源，就需要设置下名字：

let bundleName = "resources";
let path = "common/texture/img/spriteFrame";
oops.res.load(bundleName, path, spriteFrame, (err, spriteFrame) => {});

感谢作者dgflash的分享，作者CSDN博客： dgflash CSDN

最后，祝大家学习和生活愉快!