cocosCreator 之 resources(一)

版本: v3.4.0

参考: resources资源加载


简介

项目中所有需要通过脚本动态加载的资源可以使用resources.load接口进行加载,且资源相关一定要放在assets\resources的目录或子目录下。

assets\resources目录下的资源要注意: 如果只是依赖于外部的资源,而不需要被resources.load接口调用,就不要放在该目录下。

这样会导致问题:

  • 增大config.json的大小
  • 项目中无用的资源,无法在构建的过程中自动剔除
  • 构建过程中,JSON的自动合并策略将受到影响,无法尽可能的合并零碎的JSON。

关于resource.load动态加载资源,它支持多种类型的添加:

  • 加载Prefab预制体资源
// 加载prefab某个UI页面
resources.load("prefab/shopLayer", Prefab, (err, prefab) => {if(err) {console.log("resource load failed:" + err.message);return;}const node = instantiate(prefab);node.parent = this.node;
});
  • 加载AnimationClip动画资源
// 加载 AnimationClip
resources.load("test assets/anim", AnimationClip, (err, clip) => {this.node.getComponent(Animation).addClip(clip, "anim");
});
  • 加载图片的SpriteFrameTexture2DSpriteAtlas图集资源
/*
* 图片相关,在creator中它的格式为ImageAsset,它一般会生成格式:SpriteFrame和Texture
* 动态加载要在路径的后方去增加SpriteFrame或Texture的格式,否则将默认为ImageAsset格式
*/// 通过加载SpriteFrame改变图片
const path = "textures/gold/spriteFrame";
resources.load(path, SpriteFrame, (err, spriteFrame) => {const sprite = this.node.getComponent(Sprite);sprite.spriteFrame = spriteFrame;
});
// 通过加载Texture2D来改变图片
const path = "textures/gold/texture";
resources.load(path, Texture2D, (err: any, texture: Texture2D) => {const spriteFrame = new SpriteFrame();spriteFrame.texture = texture;const sprite = this.node.getComponent(Sprite);sprite.spriteFrame = spriteFrame;
});
// 通过图集来改变改变图片
const path = "textures/fruit"
resources.load(path, SpriteAtlas, (err, atlas) => {// 获取精灵帧const frame = atlas.getSpriteFrame('fruit_0');sprite.spriteFrame = frame;
});
  • 加载模型的MeshMeterialSkeleton资源
// 加载模型中的网格资源
resources.load("Monster/monster", Mesh, (err, mesh) => {this.node.getComponent(MeshRenderer).mesh = mesh;
});// 加载模型中的材质资源
resources.load("Monster/monster-effect", Material, (err, material) => {this.node.getComponent(MeshRenderer).material = material;
});// 加载模型中的骨骼
resources.load("Monster/Armature", Skeleton, (err, skeleton) => {this.node.getComponent(SkinnedMeshRenderer).skeleton = skeleton;
});

reources常用接口

关于reources的接口实现,通过cc.d.ts可以看到:

// resources 是一个 bundle,用于管理所有在 assets/resources 下的资源
export const resources: AssetManager.Bundle;

Bundle可以简单理解为资源模块化,将贴图,脚本,场景等资源划分为一个Bundle。

有助于在游戏运行的过程中,通过加载不同的Bundle 减少启动是需要加载的资源数量。

更多参考:Asset Bundle

关于AssetManager需要注意:

// 通过cc.assetManager调用
export const assetManager: AssetManager;
export class AssetManager {};
// 使用的命名空间
export namespace AssetManager {// 管线能执行任务达到某个效果export class Pipeline {}// 任务用于在管线中运行以达成某种效果export class Task {}// 请求的相关信息集合export class RequestItem {}// 一个包含一定数量资源(包括场景)的包,你可以加载,预加载,释放此包内的资源 export class Bundle {}// 内置 bundleexport enum BuiltinBundleName {RESOURCES = "resources",MAIN = "main",START_SCENE = "start-scene"}
}

对于Bundle的主要接口如下:

名字描述
namebundle的名称
basebundle的根路径
getInfoWithPath(path, type)通过路径获取指定资源的配置信息
getDirWithPath(path, type, out)获取某个指定文件夹下的所有资源信息
getAssetInfo(uuid)通过uuid获取资源信息
getSceneInfo(name)通过场景名获取场景信息
load(path, type, onPrgress, onComplete)通过相对路径加载资源
loadDir(dir, type, onProgree, onComplete)加载目标文件夹中的所有资源
loadScene(name, optins, onProgress, onComplete)通过场景名称加载分包中的场景
preload(paths,type, onProgress, onComplete)通过相对路径预加载分包中的资源
preloadDir(dir, type, onProgress, onComplete)预加载目标文件夹中的所有资源
preloadScene(name, optins, onProgress, onComplete)通过场景名称预加载分包中的场景
releaseUnusedAssets()释放此包中的所有没有用到的资源
releaseAll()释放此包中的所有资源

接口当中所提到的onProgressonComplete是回调接口, 他们对应的主要参数:

/*
onProgress 加载进度改变时的回调
finished: 已完成的加载数目
total: 需要加载的总数目
item: 请求项相关
*/
onProgress: __private.cocos_core_asset_manager_shared_ProgressCallback | null
export type cocos_core_asset_manager_shared_ProgressCallback = (finished: number, total: number, item: AssetManager.RequestItem) => void;
/*
onComplete 加载完成回调
err: 错误信息相关,包含name, message, stack等
data: 对应的item数据
*/onComplete: __private.cocos_core_asset_manager_shared_CompleteCallbackWithData<T>
export type cocos_core_asset_manager_shared_CompleteCallbackWithData<T = any> = (err: Error | null, data: T) => void;interface Error {name: string;message: string;stack?: string;
}

对于load、preload、loadDir、preloadDir、loadScene、preloadScene 等,均提供了多种不同的函数重载的实现, 就不在重复赘述了。


预加载

在项目当中,使用resources.load动态加载资源,某些时候会出现卡顿。

我们可以调用preload、preloadDir等,对内置Bundle下的resources资源进行预加载,它的特点是:

  • 只会下载资源,不会对资源进行解析和初始化操作
  • 预加载的优先度很低,当多个资源等待下载的过程中,预加载相关会放在最后
  • 预加载属于异步加载

需要注意的是:预加载资源,并不影响我们使用正常加载接口。

简单的实例:

// 预加载resources目录下某个子目录
resource.preloadDir("prefab", Prefab, (err, data) => {});// 预加载某个资源
resources.preload("music/background", AudioClip, (err, data) => {});// 预加载某个SpriteFrame
const url = 'textures/bg_1/spriteFrame'
resources.preload(url, SpriteFrame);
resources.load(url, SpriteFrame, (err, spriteFrame) => {this.node.getComponent(Sprite).spriteFrame = spriteFrame;
});

以Loading页面的加载进度为例,假设我们想加载所有的resources资源,可以:

import { _decorator, assetManager, clamp01, Component, director, Label, ProgressBar, resources } from 'cc';
const { ccclass, property } = _decorator;@ccclass('UI_LoadingLayer')
export class UI_LoadingLayer extends Component {// 进度条@property(ProgressBar)loadBar: ProgressBar = null;// 描述文本@property(Label)desc: Label = null;                protected onLoad(): void {// 通过cc.assetManager获取内置的resources包cosnt bundle = assetManager.resources;// 获取resources下的所有资源信息const resourcePaths = bundle.getDirWithPath("./");// 获取文件最大个数const maxLen = resourcePaths.length;// 设置进度相关this.desc.string = ""this.loadBar.progress = 0;// 通过资源信息表获取路径,使用preload进行预加载let loadCount = 0;for(let i = 0; i < maxLen; ++i) {const uuid = resourcePaths[i].uuid;const path = resourcePaths[i].path;resources.preload(path, (err: Error | null, data: any) => {if (err) {console.log("preload failed: " + err.message);return;}loadCount++;// 通过文本显示加载的文件this.desc.string = `加载${path}`// 进度条改变this.loadBar.progress = clamp01(loadCount/maxLen);  })}}
}

关于resources Bundle的获取,主要通过cc.assetManager来获取

// 通过变量
let resourceBundle = assetManager.resources;
let mainBundle = assetManager.main;
// 使用getBundle来获取
let resourceBundle = assetManager.getBundle("resources");
// 通过集合来获取
let bundle = assetManager.bundles.get("resources");

简单的写下这个,就当是对代码有个简单的理解吧。


本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/23775.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

8.1Jmeter5.1:Jmeter SSL

Jmeter配置证书请求双向认证SSL的web接口 需求:需要通过Jmeter配置证书请求双向认证SSL的web接口 提供的证书:P12格式 备注:Jmeter需要导入的证书是keystore证书 那么要先把P12转成keystore文件 1、使用p12生成keystore文件 keytool介绍 这里需要提到提到jdk自带的key…

K8S系列文章之 使用Kind部署K8S 并发布服务

简单介绍 kind 即 Kubernetes In Docker&#xff0c;顾名思义&#xff0c;就是将 k8s 所需要的所有组件&#xff0c;全部部署在一个docker容器中&#xff0c;是一套开箱即用的 k8s 环境搭建方案。使用 kind 搭建的集群无法在生产中使用&#xff0c;但是如果你只是想在本地简单…

网络安全 Day13-Linux三剑客awk知识

Linux三剑客awk知识 1. awk 介绍2. awk 语法3. 练习 1. awk 介绍 awk 是一门语言, 也是一个命令,Linux 有三剑客命令: grep/sed/awk三剑客的特长 grep 过滤内容sed 取行awk 取列 2. awk 语法 取列 取第一列文件($1): awk {print $1} 文件指定分隔符为文件: awk -F "指…

队列中offer,add;poll,remove;peek,element之间的区别

offer和add的区别 offer() 和 add() 都是向队列中加入新项。 一些队列有大小限制&#xff0c;因此如果想在一个满的队列中加入一个新项&#xff0c;多出的项就会被拒绝。 这时新的offer方法就可以起作用了。它不是对调用add()方法抛出一个unchecked异常&#xff0c;而只是得…

查看linux 所有运行的应用和端口命令

要查看 Linux 中所有运行的应用程序及其对应的端口&#xff0c;可以使用以下命令&#xff1a; 1. 使用 netstat 命令&#xff08;已被弃用&#xff0c;建议使用 ss 命令&#xff09;&#xff1a; netstat -tuln 这会显示当前系统上所有打开的网络连接和监听的端口。其中&#…

初阶C语言——特别详细地介绍函数

系列文章目录 第一章 “C“浒传——初识C语言&#xff08;更适合初学者体质哦&#xff01;&#xff09; 第二章 详细认识分支语句和循环语句以及他们的易错点 第三章 初阶C语言——特别详细地介绍函数 目录 系列文章目录 前言 一、函数是个什么鬼东西&#xff1f; 二、C语…

企业级Vue路由角色权限应该怎么做?

角色权限 角色权限&#xff0c;简单来说就是登录的用户能看到系统的哪些页面&#xff0c;不能看到系统的哪些页面。一般是后台管理系统才会涉及到如此复杂的角色权限。 对于 vue 技术栈&#xff0c;实现角色权限一般有两种方式。 第一种是利用 beforeEach 全局前置守卫。 第…

css中的bfc是什么?

什么bfc&#xff1f; BFC&#xff08;Block Formatting Context&#xff09;块级 格式化 上下文。 BFC就是页面上的一个隔离的独立盒子&#xff0c;容器里面的子元素和外面的元素不会相互影响。 为什么要bfc? bfc是我们去主动触发的,并不是自动就存在的,它是帮助我们解决cs…

【雕爷学编程】MicroPython动手做(28)——物联网之Yeelight 2

知识点&#xff1a;什么是掌控板&#xff1f; 掌控板是一块普及STEAM创客教育、人工智能教育、机器人编程教育的开源智能硬件。它集成ESP-32高性能双核芯片&#xff0c;支持WiFi和蓝牙双模通信&#xff0c;可作为物联网节点&#xff0c;实现物联网应用。同时掌控板上集成了OLED…

数据库与数据仓库的区别及关系

数据库与数据仓库的区别及关系 数据库数据仓库异同差异联系例子 数据库 数据库是结构化信息或数据的有序集合&#xff0c;一般以电子形式存储在计算机系统中。通常由数据库管理系统 (DBMS) 来控制。它是一个长期存储在计算机内的、有组织的、可共享的、统一管理的大量数据的集…

任务 13、MidJourney种子激发极致创作,绘制震撼连贯画作

13.1 任务概述 通过本次实验任务&#xff0c;学员将深入了解Midjourney种子的概念和重要性&#xff0c;以及种子对生成图像的影响。他们将学会在Midjourney平台中设置种子值并调整其参数&#xff0c;以达到所需的效果。此外&#xff0c;任务还详细介绍了Midjourney V4.0版本中…

openSUSE安装虚拟化 qemu kvm

1) 第一种&#xff1a;图形界面yast安装虚拟化 左下角开始菜单搜索yast 点一下就能安装&#xff0c;是不是很简单呢 2&#xff09;第二种&#xff1a; 命令行安装 网上关于openSUSE安装qemu kvm的教程比较少&#xff0c;可以搜索centos7 安装qemu kvm的教程&#xff0c;然后…

ZAFUACM - 23.8.5个人赛补题

文章目录 A - Lucky Conversion题意思路代码 B - Constanzes Machine题意思路代码 C - Maximum Median题意思路代码 D - Remove Extra One题意思路代码 E - A Determined Cleanup题意思路代码 F - Minimal k-covering A - Lucky Conversion 原题链接 题意 给出两个只包含“4…

vue3登录页面

使用了element-plus <template><div class"login-wrapper"><!-- 背景图或者视频 --><div class"background" style"width: 100%; height: 100%; position: absolute; top: 0px; left: 0px;overflow: hidden;z-index:50;&qu…

vue-baidu-map-3x 使用记录

在 Vue3 TypeScript 项目中&#xff0c;为了采用 标签组件 的方式&#xff0c;使用百度地图组件&#xff0c;冲浪发现了一个开源库 ovo&#xff0c;很方便&#xff01;喜欢的朋友记得帮 原作者 点下 star ~ vue-baidu-map-3xbaidu-map的vue3/vue2版本&#xff08;支持v2.0、v…

使用LLM插件从命令行访问Llama 2

大家好&#xff0c;最近的一个大新闻是Meta AI推出了新的开源授权的大型语言模型Llama 2&#xff0c;这是一项非常重要的进展。Facebook最初的LLaMA模型于今年2月发布&#xff0c;掀起了开源LLM领域的创新浪潮——从微调变体到从零开始的再创造。 如果在Llama 2版本发布之日&a…

《面试1v1》ElasticSearch 和 Lucene

&#x1f345; 作者简介&#xff1a;王哥&#xff0c;CSDN2022博客总榜Top100&#x1f3c6;、博客专家&#x1f4aa; &#x1f345; 技术交流&#xff1a;定期更新Java硬核干货&#xff0c;不定期送书活动 &#x1f345; 王哥多年工作总结&#xff1a;Java学习路线总结&#xf…

DLA 神经网络的极限训练方法:gradient checkpointing

gradient checkpointing 一般来说&#xff0c;训练的过程需要保存中间结果&#xff08;不管是GPU还是CPU&#xff09;。前向传播根据输入(bottom_data)计算输出(top_data)&#xff0c;后向传播由top_diff计算bottom_diff&#xff08;如果某个变量打开梯度进行训练的话&#xff…

Vue 动态引入外部js文件

场景 最近在做项目优化时&#xff0c;发现一个特殊依赖&#xff0c;全局只有一个页面会用到。这个依赖很大&#xff0c;而且这个页面极少有人会打开&#xff08;隐藏页&#xff0c;留给开发或交付人员调试使用的&#xff09;。 那么我们考虑通过引入外部js的形式来处理&#…

5个顶级的开源有限元分析软件

每当我参加数值分析课程的教学时&#xff0c;都会回顾有限元方法的基础知识&#xff0c;很自然地就会出现使用哪种软件的问题。 以下讨论基于三个基本考虑&#xff1a; 在实际应用中&#xff0c;很少有人从头开始编写 FEM 代码。商业 FEM 软件通常在某些预定义的情况下非常易于…