这里说的是在需要的使用加载图片,比如游戏中的某个关卡的图片,不用在游戏一开始就加载(万一用户玩不到那关,岂不是很冤,流量费了那么多),否则载入速度也慢。这种方式加载资源要用到cc.loader官方文档上有介绍(http://www.cocos2d-x.org/docs/manual/framework/html5/v3/cc-loader/zh),主要有

  • loadJs
  • loadJsWithImg
  • loadTxt
  • loadBinary
  • loadImg
  • loadJson

文档给出了一个例子如下:

cc.loader.loadTxt("res/a.txt", function(err, data){
if(err) return console.log("load failed");
//success
});

可见loadTxt中的第二个是一个回调函数(等待ajax数据返回后调用),文档中对启动load系列函数参数都没有说,其实都是如此,回调函数第一个参数表示是否有错误发生(成功的话是null),第二个参数data表示本次请求返回的数据(不同load系列函数会对返回数据进行一个解析,就是解析的结果了,比如loadImg)。其实第一次看文档的时候没看到这段示例代码,全是回调函数只有一个参数的示例代码,当时我就想啊,尼玛这异步调用数据怎么取啊?文档也不说一声,只好去看源码,开源的好处就是这样,以下是loadBinary的代码:

/**
* Load binary data by url.
* @function
* @param {String} url
* @param {Function} [cb]
*/ cc.loader.loadBinary = function (url, cb) {
var self = this;
var xhr = this.getXMLHttpRequest(),
errInfo = "load " + url + " failed!";
xhr.open("GET", url, true);
if (/msie/i.test(navigator.userAgent) && !/opera/i.test(navigator.userAgent)) {
// IE-specific logic here
xhr.setRequestHeader("Accept-Charset", "x-user-defined");
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && xhr.status == 200) {
var fileContents = cc._convertResponseBodyToText(xhr["responseBody"]);
cb(null, self._str2Uint8Array(fileContents));
} else cb(errInfo);
};
} else {
if (xhr.overrideMimeType) xhr.overrideMimeType("text\/plain; charset=x-user-defined");
xhr.onload = function () {
xhr.readyState == 4 && xhr.status == 200 ? cb(null, self._str2Uint8Array(xhr.responseText)) : cb(errInfo);
};
}
xhr.send(null);
}; cc.loader._str2Uint8Array = function (strData) {
if (!strData)
return null; var arrData = new Uint8Array(strData.length);
for (var i = 0; i < strData.length; i++) {
arrData[i] = strData.charCodeAt(i) & 0xff;
}
return arrData;
};

可以看到这里对回调函数的调用:

xhr.readyState == 4 && xhr.status == 200 ? cb(null, self._str2Uint8Array(xhr.responseText)) : cb(errInfo);

再来给出一个自己的使用实例(加载游戏关卡的参数和图片):

/* helper function to fetch level data using ajax */
var fetch_level = function(level, callback, callback_data) {
cc.loader.loadJson("api/level/" + level, function (x, new_level_data) {
cc.log("fetch level json data:", new_level_data);
current_level_data = new_level_data;
cc.loader.loadImg(current_level_data.photo, function (x, img) {
cc.log("fetch level photo img:", img);
current_level_data.img = img;
if (!!callback) {
callback(callback_data);
}
})
})
};

Cocos2d-js 开发记录:图片数据资源等的异步加载的更多相关文章

  1. Android之数据存储----使用LoaderManager异步加载数据库

    一.各种概念: 1.Loaders: 适用于Android3.0以及更高的版本,它提供了一套在UI的主线程中异步加载数据的框架.使用Loaders可以非常简单的在Activity或者Fragment中 ...

  2. Android 异步加载图片,使用LruCache和SD卡或手机缓存,效果非常的流畅

      Android 高手进阶(21)  版权声明:本文为博主原创文章,未经博主允许不得转载. 转载请注明出处http://blog.csdn.net/xiaanming/article/details ...

  3. [置顶] 异步加载图片,使用LruCache和SD卡或手机缓存,效果非常的流畅

    转载请注明出处http://blog.csdn.net/xiaanming/article/details/9825113 异步加载图片的例子,网上也比较多,大部分用了HashMap<Strin ...

  4. 转:web前端面试题合集 (Javascript相关)(js异步加载详解)

    1. HTTP协议的状态消息都有哪些? 1**:请求收到,继续处理2**:操作成功收到,分析.接受3**:完成此请求必须进一步处理4**:请求包含一个错误语法或不能完成5**:服务器执行一个完全有效请 ...

  5. 解决ListView滑动时卡的问题,实现异步加载图片解决

    ListView是最为常见的空间之一,现在的应用的呈现形式大多数都需要用到ListView来呈现,以列表的方式最直观最便于操作. 那么在使用的过程中大家一定使用adapter适配器来匹配这个ListV ...

  6. Android批量图片加载经典系列——使用xutil框架缓存、异步加载网络图片

    一.问题描述 为提高图片加载的效率,需要对图片的采用缓存和异步加载策略,编码相对比较复杂,实际上有一些优秀的框架提供了解决方案,比如近期在git上比较活跃的xutil框架 Xutil框架提供了四大模块 ...

  7. volley 应用 GET POST请求 图片异步加载

    package com.example.volleydemo; import java.util.HashMap; import java.util.Map; import org.json.JSON ...

  8. 简单的ListView中item图片异步加载

    前言:     在android开发当中,从目标地址获取图片往往都是采用异步加载的方法.当完全加载完图片后在进行显示,也有些是直接将加载的图片一点一点的显示出来. 这两个区别只是对流的处理不同而已.现 ...

  9. android的progressDialog 的使用。android数据异步加载 对话框提示

    在调用的Activity中定义一个全局的 progressDialog 点击按钮的时候调用下面这句 progressDialog = ProgressDialog.show(SearchActivit ...

随机推荐

  1. c语言数据结构学习心得——图

    图G由顶点集V和边集E组成,记为G=(V,E) 图不可为空,一定有顶点集不为空 有向图:有向边(弧)的有限集合 无向图:无向边的有限集合 连通:顶点V到顶点V'有路径 连通分量:无向图中的极大连通子图 ...

  2. Python如何在子类里扩展父类的property?

    <python cookbook>8.8节讨论子类扩展property时,一开始都晕了,思考了半天才勉强弄懂一点,赶快记下来.废话不多说,先上代码: class Person: def _ ...

  3. 使用过多的递归出现错误,“System.StackOverflowException”类型的未经处理的异常在 mscorlib.dll 中发生

    class Program { static void Main(string[] args) { sub(0); }     private static void sub(int count) { ...

  4. 怎样将结构完全一样的两个表的内容合并到一个表中,SQL语句

      标签: SQL合并数据 2013-08-21 10:41 489人阅读 评论(0) 收藏 举报  分类: Oracle数据库(14)  select * into 新表名 from (select ...

  5. Optimizing and caching browser bundles...

    扎心了,老铁!!! 他妈的,弄了几天都是卡在这里!!上网查了一下.说是我的内存不够,好吧.我慢慢等,然而让我等了好几天都没什么反应..两天了,一直卡在这里.今天在虚拟机也是发狠了. 我直接把虚拟机的内 ...

  6. javascript的代码块

    a block of code 注意到这个问题是在看书的时候,中文版中出现“代码片段”这样的词语,于是就去翻看了英文版的原书.书中的用了a block of code,难道不应该翻译成代码块吗?(作为 ...

  7. 老男孩python作业2-购物车程序

    购物车程序要求: 1.启动程序后,输入用户名密码后,如果是第一次登录,让用户输入工资,然后打印商品列表 2.允许用户根据商品编号购买商品 3.用户选择商品后,检测余额是否够,够就直接扣款,不够就提醒 ...

  8. P4331 [BOI2004]Sequence 数字序列 (左偏树)

    [题目链接] https://www.luogu.org/problemnew/show/P4331 题目描述 给定一个整数序列\(a_1, a_2, ··· , a_n,\)求出一个递增序列\(b_ ...

  9. hdu3068 最长回文 马拉车模板题

    题目传送门 马拉车算法模板题. 学习博客 #include<bits/stdc++.h> #define clr(a,b) memset(a,b,sizeof(a)) using name ...

  10. [转] 【译】让人倾倒的 11 个 npm trick

    [From] https://segmentfault.com/a/1190000006804410 本文转载自:众成翻译译者:文蔺链接:http://www.zcfy.cc/article/1206 ...