Javascript 为HTML5游戏添加游戏加载程序

我正在用HTML5和JavaScript创建一个简单的游戏

最初，当游戏开始时，加载图像和声音需要一些时间。 在此期间，用户必须等待，屏幕看起来不舒服

这就是我想做的

检查图像和声音的加载状态

加载资源时增加加载百分比，并分别增加进度条

---

我真的没有从哪里开始的钥匙。请指导我。

监控所有加载项目的加载状态可能会让人望而生畏，但简而言之，最好的方法是执行以下操作：

• 首先，添加到

  totalResources

  计数器，这样游戏就知道需要多少资源

• 将

  eventListeners

  添加到加载资源中，并添加到

  loadingResources

  计数器中。如果加载成功或失败，请添加到

  loadingResources

  计数器

• 计数器相等后，要么加载所有资源，要么加载某些文件时出错

这种方法的缺点是，

loadingResources

很少会过早地匹配

totalResources

变量。您可以通过创建一个标志来解决这个问题，该标志检查是否所有需要加载的资源都已经开始加载

现在，根据您制作游戏的方式，失败的资源加载不应该真正停止游戏的工作。例如，如果声音加载不正确，它就不会播放。如果需要加载资源，您可能需要重试或中止

至于基于%的加载，这有点不确定。HTML5规范包括一个进度条，但对于多个资源，您最好的选择可能是在加载资源时填充进度条

附录：

加载声音文件是一件非常痛苦的事情，我在所有浏览器中都没有成功地完善它。我是这样做的：

首先，不要依赖于

load（）

函数来调用加载

audio

元素。相反，强制它播放，如下所示：

sound.channels[i].音量=0

sound.channels[i].play（）

（另外，要重放声音，请在声音暂停时将
持续时间设置为接近0的值。）

为了允许同时播放多个声音，最好使用多个音频元素（因此上面的

频道

阵列）。但是，您不需要等待所有声道加载。加载后，克隆节点并再次强制静默播放以避免任何延迟

有趣的是，使用

canplaythrough

事件回调来查看声音是否准备就绪更可靠。如果无法加载声音，请使用

错误

回调。问题是有许多错误会导致声音文件无法加载

不要忘记使用

元素来支持多种音频格式

---

我想加上我的两分钱。除了有一个

loadCounter

，我建议您还有一个

errorCounter

，并根据当前文件是成功还是失败来增加这些变量。在循环结束时，您可以检查这两者之和是否等于

totalCounter

类似以下内容：

var assetsToLoad = [],
    assetsLoaded = 0;

var image = new Image();
image.addEventListener("load", loadHandler, false);
image.src = "image.png";
assetsToLoad.push(image);

//...Load other assests, following the same format...

function loadHandler() {
    assetsLoaded++;
    //Display "Loading" in the console while assets are being loaded
    console.log("Loading...");
    //If everthing is loaded, do this:
    if (assetsLoaded === assetsToLoad.length) {
      //Make the game play, possibly by changing its state from "loading" to "playing"
      console.log("All assets loaded");
    }
}

---

使用答案，或者你可以检测图像何时加载，然后以你想要的方式增加每个图像的进度。一个非常有启发性的答案Jeffrey。。。Thanx。。。你能让我知道我如何检查声音文件的加载…我添加了一些提示。这真的比我想发布（或应该发布）的要复杂得多，但是如果你想要更深入的技术，我可以在我的GameAPI中将我当前的加载方案通过电子邮件发送给你。给我发封电子邮件（个人资料）。这肯定很复杂。。。我给你发封信soon@AndroidDeveloper我刚刚完成了一个名为“ResourceLoader”的资源加载脚本。如果您仍在使用您的游戏加载代码，您可能想查看它：看起来很棒！！我很快会查到的。。。我有点怀疑。。这是否能够在苹果设备中预加载声音文件，因为它确实允许预加载声音文件。。。Thanx提前。。。