0

我对 HTML5 音频 api 还很陌生：我已经阅读了HTML5 Rocks上的一些相关文章，但有时在 Javascript 和 Dart 之间切换可能有点棘手。

无论如何，我一直在 Dart 中试验 HTML5 音频。为了给一个简单的游戏产生声音效果，我创建了一个如下的类。我创建了一个 AudioContext，将声音数据加载到 SoundBuffers 中，当需要播放声音时，创建一个 AudioBufferSourceNode 来播放存储在缓冲区中的数据：

class Sfx {
  AudioContext audioContext;
  List<Map> soundList;
  int soundFiles;

  Sfx() {
    audioContext = new AudioContext();
    soundList = new List<Map>();
    var soundsToLoad = [
      {"name": "MISSILE", "url": "SFX/missile.wav"},
      {"name": "EXPLOSION", "url": "SFX/explosion.wav"}
    ];
    soundFiles = soundsToLoad.length;

    for (Map sound in soundsToLoad) {
      initSound(sound);
    }
  }

  bool allSoundsLoaded() => (soundFiles == 0);

  void initSound(Map soundMap) {
    HttpRequest req = new HttpRequest();
    req.open('GET', soundMap["url"], true);
    req.responseType = 'arraybuffer';
    req.on.load.add((Event e) {
      audioContext.decodeAudioData(
        req.response,
        (var buffer) {
            // successful decode
            print("...${soundMap["name"]} loaded...");
            soundList.add({"name": soundMap["name"], "buffer": buffer});
            soundFiles--;
        },
        (var error) {
          print("error loading ${soundMap["name"]}");
        }
      );
    });
    req.send();
  }

  void sfx(AudioBuffer buffer) {
    AudioBufferSourceNode source = audioContext.createBufferSource();
    source.connect(audioContext.destination, 0, 0);
    source.buffer = buffer;
    source.start(0);
  }

  void playSound(String sound) {
    for (Map m in soundList) {
      print(m);
      if (m["name"] == sound) {
        sfx(m["buffer"]);
        break;
      }
    }
  }
}

（音效在文件夹“SFX”中。现在我查看代码，可能有上百万种更好的方法来组织数据，但现在还不是重点。）我可以通过创建来播放音效Sfx 的一个实例并调用 playSound 方法。

例如

#import('dart:html');

#source('sfx.dart');

Sfx sfx;
void main() {
  sfx = new Sfx();
  window.on.keyUp.add((KeyboardEvent keX) {
    sfx.playSound("MISSILE");
  });
}

（编辑：添加代码以在按键时播放声音。）

问题是：尽管使用 dart2js Javascript，声音效果在 Safari 中按预期播放，但当它们在 Dartium 或 Chrome 中（使用 dart2js Javascript）播放时，它们会失真。（在 Firefox 中，还有更严重的问题！）

有什么明显的我忽略或需要考虑的吗？否则，是否有任何参考或教程，最好是在 Dart 上下文中，这可能会有所帮助？

4

1 回答 1

1

感谢您尝试飞镖！

首先，Firefox 不支持 Web Audio API（还没有？）Chrome 和 Safari 支持 Web Audio API。您可以在此处跟踪 Web Audio API 的采用情况：http: //caniuse.com/#feat=audio-api

其次，请在 Dartium 中尝试这个 Web Audio API 示例：https ://github.com/dart-lang/dart-html5-samples/tree/master/web/webaudio/intro 您需要先克隆 repo 并运行它本地。此示例在本地适用于我。

这听起来更像是一个错误报告。如果 dart-html5-samples 中的示例对您有用，但您的上述代码仍然被扭曲，请在http://dartbug.com/new上打开一个错误，以便我们查看。

要考虑的一件事是等到特定的 MISSLE 声音加载后，再连接 keyUp 处理程序。

于 2012-10-17T20:10:34.507 回答