Question

我不是专家所以请耐心等待我。

我想知道如何从文件加载音频并播放精灵。这是伪代码，希望它能帮助你理解：

询问音频的路径
以毫秒为单位写入timeA（当程序必须开始播放时）
以毫秒为单位写入timeB（当程序必须停止播放时）
从时间A到时间B

我正在使用此库https://github.com/goldfire/howler.js。有没有办法用这个自动创建精灵？

请帮帮我！提前谢谢。

我知道发布一些代码会更好，但我真的不知道从哪里开始。

Answer 1

如果我理解正确，你想要加载声音文件并将其中的一部分从一个给定位置播放到第二个给定位置。

所以请记下你的时间戳并构建精灵，如下所示。为方便起见，我添加了一些代码。如果您知道声音文件的持续时间之前很容易计算时间戳，那么从具有未知持续时间的文件末尾计算时间戳也可能很有趣。因此，您必须加载文件，然后您可以获得持续时间（请参阅“onload”中的部分）

<html>

<head>
  <script src="howler.min.js"></script>
</head>

<body>
  <button id="buttonBefore">Loading...</button>
  <button id="buttonToPlay">Loading...</button>
  <button id="buttonAfter">Loading...</button>
  <button id="buttonLastSecond">Loading...</button>
  <script>
    var timeA = 100;
    var timeB = 200;
    var soundFile = new Howl({
      urls: ['./sound.mp3'],
      onload: function () {
        document.getElementById('buttonBefore').onclick = function () {
          soundFile.play('before')
        }
        document.getElementById('buttonBefore').firstChild.data = "Play before";

        document.getElementById('buttonToPlay').onclick = function () {
          soundFile.play('toplay')
        }
        document.getElementById('buttonToPlay').firstChild.data = "Play toplay";

        document.getElementById('buttonAfter').onclick = function () {
          soundFile.play('after')
        }
        document.getElementById('buttonAfter').firstChild.data = "Play after";

        document.getElementById('buttonLastSecond').onclick = function () {
          soundFile.play('lastSecond')
        }
        document.getElementById('buttonLastSecond').firstChild.data = "Play lastSecond";

        soundFile.sprite({
          "before": [0, timeA - 1],
          "toplay": [timeA, timeB],
          "after": [timeB + 1, soundFile._duration * 1000],
          "lastSecond": [soundFile._duration * 1000 - 1000, soundFile._duration * 1000 - 1],
        });

      }
    });
  </script>
</body>

</html>

从本地内存加载音频并播放精灵

1 个答案: