【cocos2d-js官方文檔】九、cc.loader

概述

原來的cc.Loader被改造爲一個單例cc.loader,採用了插件機制設計,讓loader做更純粹的事。

各種資源類型的loader可以在外部註冊進來,而不是直接將所有的代碼雜揉在cc.Loader中,更好的方便管理以及用戶自定義loader的創建。

cc.loader中包含了一些網絡資源獲取的基本api,例如加載js、加載image等。

API描述

(注:以下描述中,全路徑的意思爲 "資源的根路徑" + "資源路徑", 例如設置圖片資源根路徑(cc.loader.resPath)爲"res",圖片資源路徑爲"a.png", 那麼全路徑爲"res/a.png",非全路徑爲"a.png"。)

resPath

資源的根路徑(音頻資源除外)。

audioPath

音頻資源的根路徑。

getXMLHttpRequest

獲取XMLHttpRequest對象。

loadJs

加載js文件。

參數:
url     資源路徑(注意,必須是全路徑)
cb      回調函數

返回值: 無
  • 用法1:
cc.loader.loadJs("src", [
    "a.js", "b.js"
], function(err){
    if(err) return console.log("load failed");
    //success
});
  • 用法2:
cc.loader.loadJs([
    "src/a.js", "src/b.js"
], function(err){
    if(err) return console.log("load failed");
    //success
});
  • 用法3:
cc.loader.loadJs("src/a.js", function(err){
    if(err) return console.log("load failed");
    //success
});
loadJsWithImg

用法同loadJs,只是在加載js文件的時候會顯示一個loading的圖片而已。

loadTxt

加載文本資源。

參數:
url     資源路徑(注意,必須是全路徑)
cb      回調函數

返回值: 無

用法:

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

加載圖片資源。

參數:
url         資源路徑(注意,必須是全路徑)
option      選項,目前結構如:`{isCrossOrigin : true}`,`isCrossOrigin`默認爲`true`(可選)
cb          回調函數

返回值: Image對象。
loadBinary

加載二進制文件(異步)。

參數:
url         資源路徑(注意,必須是全路徑)
cb          回調函數

返回值: 二進制數據。
loadBinarySync

加載二進制文件(同步,不推薦使用)。

參數:
url         資源路徑(注意,必須是全路徑)
cb          回調函數

返回值: 二進制數據。
getUrl

獲取到資源全路徑。

參數:
basePath    資源的根路徑
url         資源路徑

返回值:資源全路徑。

用法:

cc.loader.getUrl("res", "a.png");//-->"res/a.png"
cc.loader.getUrl("a.png");//(set cc.loader.resPath = "res")--->"res/a.png"。
load

加載資源的入口api。相當於原來的cc.Loader.preload

參數:
res         資源列表,可以是一個數組或者一個string或者一個包含`src`屬性的對象。
option      選項(可選),有以下屬性:
            cb              回調函數
            cbTarget        回調函數的執行者
            trigger         觸發器(函數)
            triggerTarget   觸發器的執行者
cb          回調函數(可選)

用法:

var res = ["res/a.png", "res/a.plist", "audio/b.mp3"];
var testTarget = {
    name : "the name is testTarget",
    trigger : function(){...},
    cb : function(err){...}
};
var option = {
    trigger : testTarget.trigger,
    triggerTarget : testTarget,
    cbTarget : testTarget
}
//用法1:
cc.loader.load(res, option, function(err){
    if(err) return console.log("load failed");
    console.log(this.name);//the name is testTarget
});

//用法2:
cc.loader.load(res, function(err){
    if(err) return console.log("load failed");
});

//用法3:
option.cb = testTarget.cb;
cc.loader.load(res, option);

//用法4:
cc.loader.load(res);

loadAliases

加載plist配置文件從而獲得別名。

參數:
url             配置文件url
                配置文件的格式如下:
                    <?xml version="1.0" encoding="UTF-8"?>
                    <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
                    <plist version="1.0">
                    <dict>
                        <key>metadata</key>
                        <dict>
                            <key>version</key>
                            <integer>1</integer>
                        </dict>
                        <key>filenames</key>
                        <dict>
                            <key>grossini.bmp</key>
                            <string>res/Images/grossini.png</string>
                        </dict>
                    </dict>
                    </plist>

cb              回調

用法:

cc.loader.loadAliases("res/lookup-html5.plist", function(){
    var sprite = cc.Sprite.create("grossini.bmp");
    self.addChild( sprite );
    sprite.x = winSize.width/2;
    sprite.y = winSize.height/2;
});

register

註冊loader。

參數:
extNames        後綴名(String數組或者String)
loader          loader對象,
                必須包含一個名爲"load"的方法,
                方法將接受四個個參數:realUrl, url, res, cb,分別表示資源全路徑、原來的路徑、res對象(就是cc.loader.load方法的資源列表的項),回調函數。
                可能包含一個名爲"getBasePath"的方法,該方法返回該類型資源的根路徑,不設置該方法默認爲cc.loader.resPath。

返回值:無

用法:

cc.txtLoader = {
    load : function(realUrl, url, res, cb){
        cc.loader.loadTxt(realUrl, cb);
    }
}
cc.loader.register(["txt", "xml", "tmx", "tsx"], cc.txtLoader);
getRes

獲取資源緩存數據。

參數:
url         資源路徑(非全路徑)

返回值:     資源數據

用法:

var img = cc.loader.getRes("a.png");
release

釋放資源緩存數據。

參數:
url         資源路徑(非全路徑)

返回值:     無

用法:

cc.loader.release("a.png");
releaseAlll

釋放所有的資源緩存數據

參數:         無

返回值:       無

用法:

cc.loader.releaseAll();

註冊loader插件

引擎自帶loader寫在CCLoaders.js中。實現方式也很簡單,相信看下源碼就懂了,這裏就不多說了。

資源配置格式

這次cc.loader的改造,也廢除了v2版本中一直讓人詬病的資源列表的配置。

v2:

var resources = [
    {src:"res/a.png"},
    {fontName:"Marker Felt",src:[{src:"res/cocosgui/Marker Felt.ttf",type:"truetype"}]},
    {
        fontName:"Schwarzwald Regular",
        src:[
            {src:"res/fonts/Schwarzwald_Regular.eot", type:"embedded-opentype"},
            {src:"res/fonts/Schwarzwald Regular.ttf",type:"truetype"}
        ]
    }
]

v3:

var resources = [
    "res/a.png",
    "res/cocosgui/Marker Felt.ttf",
    {
        type:"font",
        name:"Schwarzwald Regular",
        srcs:["res/fonts/Schwarzwald_Regular.eot", "res/fonts/Schwarzwald Regular.ttf"]
    }
]

在v3中,通常情況下只要配路徑就行,這樣簡化了配置,同時減少了對象的頻繁創建。 如果有特殊需求,例如font,就使用{type:"resType", name:"resName"}的數據結構自定義自己的資源加載配置方案。 type字段指定註冊的loader插件,name加上"."再加上type來作爲緩存資源的key值。

注意,v2版本中的資源列表配置在v3中是不支持的。


轉載:http://www.douapp.com/post/2452

發佈了51 篇原創文章 · 獲贊 73 · 訪問量 52萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章