HTML5 游戏开发 之 资源加载篇(2)

       四) 下载过程的管理<br> <br>        4.1) 如何管理成千上百的资源<br> <br>        在游戏开发的过程中，很有可能会有成千上百张图片。最直接的方式，是将这些图片编写在代码中，但是图片的名字很容易改变的，会造成大量的维护工作，甚至影响代码的打包和发布。我的同事Boris，在他的代码演示库中，给出了一个参考实现方式，如下。这种方式，可以保证，在需要修改或者调整资源名称或者路径的时候，不需要接触代码。<br> <br>

{<br>
  "assetRoot": "url/to/assets",<br>
  "bundles": [<br>
  {<br>
        "name": "unique bundle name",<br>
        "contents": [<br>
        "relative/path/to/asset.jpg",<br>
        "another/asset.mp3"<br>
          ]<br>
  },<br>
  "autoDownload": true<br>
}<br>
var gal = new GameAssetLoader("http://path.to/gal.manifest");<br>
// Load the GAL. If manifest indicates autoDownload, this call will<br>
// start loading assets one by one.<br>
gal.init(function() {<br>
// Called when the library is initialized<br>
});

<br>        更完整的代码，可以参考GitHub上的源代码<br> <br>        4.2) 如何实现批处理的下载<br> <br>        再获得了资源列表之后，就要开始资源的下载。显然，需要这样的方法。<br> <br>

AssetManager.prototype.downloadAll = function(downloadCallback) {<br>
  for (var i = 0; i
  var path = this.downloadQueue[i];<br>
  var img = new Image();<br>
  var that = this;<br>
  img.addEventListener("load", function() {<br>
        // coming soon<br>
  }, false);<br>
  img.addEventListener("error", function() {<br>
  // coming soon<br>
  }, false);<br>
  img.src = path;<br>
}<br>
}<br>
<br>
下载的过程中，一般情况下都需要一个进度条，来显示完成的情况，所以必须对AssetManager进行计数。<br>

<br>
 <br>
<br>
function AssetManager() {<br>
  this.successCount = 0;<br>
  this.errorCount = 0;<br>
  this.downloadQueue = [];<br>
}<br>
 <br>
AssetManager.prototype.isDone = function() {<br>
  return (this.downloadQueue.length == this.successCount + this.errorCount);<br>
}<br>
AssetManager.prototype.getProcess = function() {<br>
  return (this.successCount + this.errorCount)/this.downloadQueue.length;<br>
}

<br>        显然，也需要对每个img的load和error事件，进行计数。还请注意downloadAll函数有个参数叫做downloadCallback，在资源下载完成以后，通知此函数，进入游戏过程中。<br> <br>

img.addEventListener("load", function() {<br>
  that.successCount += 1;<br>
  if (that.isDone()) {<br>
        downloadCallback();<br>
  }<br>
}, false);<br>
img.addEventListener("error", function() {<br>
  that.errorCount += 1;<br>
  if (that.isDone()) {<br>
        downloadCallback();<br>
  }<br>
}, false

<br>        4.3) 游戏中的不同关卡<br> <br>        游戏通常是分关卡的，完全没有必要在一开始就将游戏的所有资源下载到本地，毕竟不是每个玩家都会将游戏通关。为了按需下载，比较完备的资源加载器，应该可以对每个资源配上一个标签或者属性，可以标志它属于哪一关。每一关的开始，只下载和本关相关联的资源，在每一关结束的时候，在去下载下一关的资源。不仅减少用户的不必要的等待时间，还可以有效的减少服务器的压力。<br> <br>        5.资源加载器的具体实现<br> <br>        5.1 PreloadJS<br> <br>        官方网站：http://www.createjs.com/#!/PreloadJS/download<br> <br>        开源代码：https://github.com/CreateJS/PreloadJS/<br> <br>        专门用于资源下载的类库，非常好用，考虑的也非常全面，首先推荐的一款软件，尤其是读者不希望加载特别大的游戏引擎是，这款软件可以作为首选。<br> <br>        具体的例子可以参考：https://github.com/CreateJS/PreloadJS/tree/master/examples<br> <br> （未完待续）<br> <br>