Laya资源加载小记 (2)

资源加载完成后,触发onLoaded方法,将加载完的数据根据类型进行封装或者后续加载(如atlas类型加载完资源后,会解析配置,再去加载对应的图片)。

调用complete方法,将data缓存在loader中,再将loader放入到完成队列。

执行endload方法,缓存资源,通知COMPLETE事件,LoaderManager触发传入的complete方法。

如果累计回调时长大于100毫秒时,延时一帧再执行后续loader的endload方法。

/** * 加载完成。 * @param data 加载的数据。 */ protected function complete(data:*):void { this._data = data; if (_customParse) { event(Event.LOADED, data is Array ? [data] : data); } else { _loaders.push(this); if (!_isWorking) checkNext(); } } /** @private */ private static function checkNext():void { _isWorking = true; var startTimer:Number = Browser.now(); var thisTimer:Number = startTimer; while (_startIndex < _loaders.length) { thisTimer = Browser.now(); _loaders[_startIndex].endLoad(); _startIndex++; //@防止单次回调事件太长,卡进程 if (Browser.now() - startTimer > maxTimeOut) { console.warn("loader callback cost a long time:" + (Browser.now() - startTimer) + " url=" + _loaders[_startIndex - 1].url); Laya.timer.frameOnce(1, null, checkNext); return; } } _loaders.length = 0; _startIndex = 0; _isWorking = false; } /** * 结束加载,处理是否缓存及派发完成事件 <code>Event.COMPLETE</code> 。 * @param content 加载后的数据 */ public function endLoad(content:* = null):void { content && (this._data = content); if (this._cache) cacheRes(this._url, this._data); event(Event.PROGRESS, 1); event(Event.COMPLETE, data is Array ? [data] : data); } 图片资源加载

后缀为png、jpg、jpeg以及类型为htmlimage或者nativeimage的资源,是使用图片类型加载。

图片类型的加载使用过使用H5的Browser.window.Image方式加载。

创建一个Browser.window.Image的实例。

设置src、onload、onerror方法。

使用imgCache缓存image对象,防止被gc掉。

当图片被加载完时,会触发onload回调,清理image的onerror和onload方法,传递给下级。

nativeimage类型的图片,会直接将Image的数据传递下去。其他类型图片会使用HtmlImage(Canvas模式下)/WebGLImage(WebGL模式下)将原生Image数据包装,然后再传递给后续调用。

/** * @private * 加载图片资源。 * @param url 资源地址。 */ protected function _loadImage(url:String):void { url = URL.formatURL(url); var _this:Loader = this; var image:*; function clear():void { image.onload = null; image.onerror = null; delete imgCache[url] } var onload:Function = function():void { clear(); _this.onLoaded(image); }; var onerror:Function = function():void { clear(); _this.event(Event.ERROR, "Load image failed"); } if (_type === "nativeimage") { image = new Browser.window.Image(); image.crossOrigin = ""; image.onload = onload; image.onerror = onerror; image.src = url; //增加引用,防止垃圾回收 imgCache[url] = image; } else { new HTMLImage.create(url, {onload: onload, onerror: onerror, onCreate: function(img:*):void { image = img; //增加引用,防止垃圾回收 imgCache[url] = img; }}); } } 文本类型加载

简单类型如json、buffer等类型,直接通过http请求下载。

Atlas/Font类型,会先通过这种方式下载配置文件,再执行后续操作。

var contentType:String; switch (type) { case ATLAS: contentType = JSON; break; case FONT: contentType = XML; break; case PKM: contentType = BUFFER; break default: contentType = type; } if (preLoadedMap[url]) { onLoaded(preLoadedMap[url]); }else { if (!_http) { _http = new HttpRequest(); _http.on(Event.PROGRESS, this, onProgress); _http.on(Event.ERROR, this, onError); _http.on(Event.COMPLETE, this, onLoaded); } _http.send(url, null, "get", contentType); } 声音类型加载

对声音资源的加载,Laya封装到Sound类里面。Laya支持三种sound类型:H5方式、web audio api方式、微信小游戏方式。

H5方式通过原生audio标签去加载声音。

web audio方式是通过http请求方式下载。

微信小游戏是微信提供方式下载。

声音加载完成后,外部接受的为Sound对象,而不是语音的数据。

/** * @private * 加载声音资源。 * @param url 资源地址。 */ protected function _loadSound(url:String):void { var sound:Sound = (new SoundManager._soundClass()) as Sound; var _this:Loader = this; sound.on(Event.COMPLETE, this, soundOnload); sound.on(Event.ERROR, this, soundOnErr); sound.load(url); function soundOnload():void { clear(); _this.onLoaded(sound); } function soundOnErr():void { clear(); sound.dispose(); _this.event(Event.ERROR, "Load sound failed"); } function clear():void { sound.offAll(); } } 图集加载

图集类型一般包含一份配置文件和一张或多张贴图。

先用Http方式下载配置文件。并且设置当前类型为ATLAS类型。

当配置文件下载完成后,解析meta字段,获取需要下载的图片地址,使用下载图片的方式下载对应图片。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wpzssd.html