一 , 获取资源的3种方式:
①:RES.getRes(name:string):any
同步获取资源 这种方式只能获取已经缓存过的资源
②:RES.getResAsync(name:string,compFunc:Function,thisObject:any):void
异步获取资源,这种方式可以获取配置中含有的所有资源项。如果缓存中存在,直接调用回调函数返回,若不存在,就启动网络加载文件并解析后回调。
③:RES.getResByUrl(url:string,compFunc:Function,thisObject:any,type:string=””):void
通过url获取不在配置中的资源,通常不建议使用这个接口,只有那些不合适填写在配置中,比如获取网络上其他服务器的资源时,才采用这种方式。
public constructor() {
super();
this.addEventListener(egret.Event.ADDED_TO_STAGE, this.onAddToStage, this);
}
private onAddToStage(event:egret.Event) {
RES.getResByUrl('/resource/assets/bg.jpg',this.onComplete,this,RES.ResourceItem.TYPE_IMAGE);
}
private onComplete(event:any):void {
var img: egret.Texture = <egret.Texture>event;
var bitmap: egret.Bitmap = new egret.Bitmap(img);
this.addChild(bitmap);
}
二 , 加载资源组的步骤
1 : 加载资源配置json文件,如resouce.res.json.
RES.addEventListener( RES.ResourceEvent.CONFIG_COMPLETE, this.onConfigComplete, this );
RES.addEventListener( RES.ResourceEvent.CONFIG_LOAD_ERROR, this.onConfigLoadErr, this );
RES.loadConfig("resources/resource.res.json","resources/");
解析 :
①:RES.loadConfig
参数1:json配置文件的路径 。 参数2 : 子资源的位置
2: 加载json配置中的某一个资源组 , 比如加载preload资源组
private onConfigComplete(event: RES.ResourceEvent): void {
RES.removeEventListener(RES.ResourceEvent.CONFIG_COMPLETE, this.onConfigComplete, this);
RES.addEventListener(RES.ResourceEvent.GROUP_COMPLETE, this.onResourceLoadComplete, this);
RES.addEventListener(RES.ResourceEvent.GROUP_LOAD_ERROR, this.onResourceLoadError, this);
RES.addEventListener(RES.ResourceEvent.GROUP_PROGRESS, this.onResourceProgress, this);
RES.addEventListener(RES.ResourceEvent.ITEM_LOAD_ERROR, this.onItemLoadError, this);
RES.loadGroup("preload");
}
3:侦听加载事件:
/**
* preload资源组加载完成
*/
private onResourceLoadComplete(event: RES.ResourceEvent) {
if (event.groupName == "preload") {
this.stage.removeChild(this.loadingView);
RES.removeEventListener(RES.ResourceEvent.GROUP_COMPLETE, this.onResourceLoadComplete, this);
RES.removeEventListener(RES.ResourceEvent.GROUP_LOAD_ERROR, this.onResourceLoadError, this);
RES.removeEventListener(RES.ResourceEvent.GROUP_PROGRESS, this.onResourceProgress, this);
RES.removeEventListener(RES.ResourceEvent.ITEM_LOAD_ERROR, this.onItemLoadError, this);
}
}
/**
* 资源组加载出错
*/
private onItemLoadError(event: RES.ResourceEvent) {
console.warn("Url:" + event.resItem.url + " has failed to load");
}
/**
* 资源组加载出错
*/
private onResourceLoadError(event: RES.ResourceEvent) {
console.warn("Group:" + event.groupName + " has failed to load");
//忽略加载失败的项目
this.onResourceLoadComplete(event);
}
/**
* preload资源组加载进度
*/
private onResourceProgress(event: RES.ResourceEvent) {
if (event.groupName == "preload") {
this.loadingView.setProgress(event.itemsLoaded, event.itemsTotal);
}
}
三 , 自定义加载组加载资源(重点)
在json中建立资源,这次资源不放在任何组中,本人使用代码自动构建组进行加载
加载管理器:
module app{
/**
* 构建组RES并加载
* @author Aonaufly
*/
export class AutoGroupResLoardManager{
private _loaderArr : Array<IAutoGroupResLoarData> = null;
private _is_loading : boolean = false;//是否正在加载中
private static _instance : AutoGroupResLoardManager = null;
/**当前正在加载的资源数据*/
private _cur_data : IAutoGroupResLoarData = null;
public static get Ins() : AutoGroupResLoardManager{
if( AutoGroupResLoardManager._instance == null ) AutoGroupResLoardManager._instance = new AutoGroupResLoardManager();
return AutoGroupResLoardManager._instance;
}
public constructor( ){
this._loaderArr = [];//数据加载的集合
}
/**
* 开始加载接口
* @param {app.IAutoGroupResLoarData} data
*/
public startLoader( data : IAutoGroupResLoarData ) : void{
if( this._is_loading ){
this._loaderArr.push( data );//放入加载列表等待加载
}else{
this.createGroup2Res( data );
}
}
/**
* 构建组并加载
* @param {app.IAutoGroupResLoarData} data
*/
private createGroup2Res( data : IAutoGroupResLoarData ) : void{
if( RES.createGroup( data._groupName , data._arr2Res , true )){
this._cur_data = data;
this.onConfigComplete(data);
}else{
//构建失败
data._callBack( TypeCallBack2AutoGroupResLoar.CREATE_GROUP_ERROR );
this.loaderNext();//继续加载下一个
}
}
/**
* 加载下一个
*/
private loaderNext() : void{
if( this._loaderArr.length > 0 ){
let data : IAutoGroupResLoarData = this._loaderArr.shift();
this.createGroup2Res( data );
}else{
RES.removeEventListener(RES.ResourceEvent.GROUP_COMPLETE,this.onResourceLoad, this);
RES.removeEventListener(RES.ResourceEvent.GROUP_LOAD_ERROR,this.onResourceLoad, this);
RES.removeEventListener(RES.ResourceEvent.GROUP_PROGRESS,this.onResourceLoad, this);
RES.removeEventListener(RES.ResourceEvent.ITEM_LOAD_ERROR,this.onResourceLoad, this);
}
}
/**
* 添加加载侦听
* @param {app.IAutoGroupResLoarData} data
*/
private onConfigComplete(data : IAutoGroupResLoarData): void {
RES.addEventListener(RES.ResourceEvent.GROUP_COMPLETE, this.onResourceLoad, this);
RES.addEventListener(RES.ResourceEvent.GROUP_LOAD_ERROR, this.onResourceLoad, this);
RES.addEventListener(RES.ResourceEvent.GROUP_PROGRESS, this.onResourceLoad, this);
RES.addEventListener(RES.ResourceEvent.ITEM_LOAD_ERROR, this.onResourceLoad, this);
RES.loadGroup(data._groupName);
}
/**
* 加载侦听处理
* @param {RES.ResourceEvent} $e
*/
private onResourceLoad( $e : RES.ResourceEvent ):void{
switch( $e.type ){
case RES.ResourceEvent.GROUP_COMPLETE:
if( $e.groupName == this._cur_data._groupName ){
this._cur_data._callBack( TypeCallBack2AutoGroupResLoar.GROUP_COMPLETE , this._cur_data._class );//加载完成
this.loaderNext();//加载下一个
}
break;
case RES.ResourceEvent.GROUP_LOAD_ERROR:
if( $e.groupName == this._cur_data._groupName ){
this._cur_data._callBack( TypeCallBack2AutoGroupResLoar.GROUP_COMPLETE , this._cur_data._class);//容错加载完成
this.loaderNext();
}
break;
case RES.ResourceEvent.GROUP_PROGRESS://加载进度
if($e.groupName == this._cur_data._groupName){
this._cur_data._callBack( TypeCallBack2AutoGroupResLoar.GROUP_PROGRESS , this._cur_data._class ,$e );
}
break;
case RES.ResourceEvent.ITEM_LOAD_ERROR:
if($e.groupName == this._cur_data._groupName){
this._cur_data._callBack( TypeCallBack2AutoGroupResLoar.ITEM_LOAD_ERROR , this._cur_data._class ,$e);
console.log("Url:" + $e.resItem.url + " has failed to load");
}
break;
}
}
}
/**
* 自动加载数据
* @author Aonaufly
*/
export interface IAutoGroupResLoarData{
/**
* 组名
*/
_groupName : string;
/**
* 资源名
*/
_arr2Res : Array<string>;
/**
* 回调方法
*/
_callBack : Function;
_class : any;
}
/**
* 毁掉类型枚举
*/
export enum TypeCallBack2AutoGroupResLoar{
/**构建失败*/
CREATE_GROUP_ERROR = 0,
/**组加载完成*/
GROUP_COMPLETE = 1,
/**组加载进度*/
GROUP_PROGRESS = 2,
/**组中元素加载失败*/
ITEM_LOAD_ERROR = 3
}
}
测试调用:
module app {
export class FntView extends eui.Component implements eui.UIComponent{
private group_number : eui.Group;
private img_webp : eui.Image;
public constructor() {
super();
this.skinName = "resource/eui_skins/FntView.exml";
}
protected childrenCreated():void{
super.childrenCreated();
this.showNumer( 1139 );
//this.img_webp.source = RES.getRes("bg_jpg");
var texture:egret.Texture = RES.getRes("aab_webp");
var result: egret.Bitmap = new egret.Bitmap();
result.texture = texture;
result.width = 500;
result.height = 500;
this.addChild(result);
this.loaderRES();
}
private showNumer( num : number ) : void{
let show : string = num.toString();
FntManager.showFnt( this.group_number , "" , show , 125 , 75 );
}
//////////////////////// RES加载器的使用
private loaderRES():void{
let resData : IAutoGroupResLoarData = {
_groupName : "test2create",
_arr2Res : [
"c_01_jpg",
"c_02_jpg"
],
_callBack : this.callBack2Res,
_class : this
};
AutoGroupResLoardManager.Ins.startLoader( resData );
}
private callBack2Res( type : TypeCallBack2AutoGroupResLoar , $class : FntView = null , $e : RES.ResourceEvent = null ) : void{
switch ( type ){
case TypeCallBack2AutoGroupResLoar.GROUP_COMPLETE:
//加载完成
let img01: eui.Image = new eui.Image();
img01.source = RES.getRes("c_01_jpg");
let img02: eui.Image = new eui.Image();
img02.source = RES.getRes("c_02_jpg");
img01.x = 100;
img01.y = 300;
img02.x = 300;
img02.y = 300;
$class.addChild(img01);
$class.addChild(img02);
break;
case TypeCallBack2AutoGroupResLoar.CREATE_GROUP_ERROR:
console.error("创建组 : test2create 失败");
break;
case TypeCallBack2AutoGroupResLoar.GROUP_PROGRESS:
console.log(`进度 : ${$e.itemsLoaded}/${$e.itemsTotal}`);//打印进度
break;
case TypeCallBack2AutoGroupResLoar.ITEM_LOAD_ERROR:
console.log(`自定义加载组 : ${$e.groupName} , 错误单元 : ${$e.resItem.url}`);
break;
}
}
}
}
结果:
控制台打印结果:
亿速云「云服务器」,即开即用、新一代英特尔至强铂金CPU、三副本存储NVMe SSD云盘,价格低至29元/月。点击查看>>
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。