0

私は HTML5 オーディオ API にかなり慣れていません。HTML5 Rocksで関連記事をいくつか読んだことがありますが、Javascript と Dart を切り替えるのは少し難しい場合があります。

いずれにせよ、私は Dart で HTML5 Audio を試してきました。単純なゲームの効果音を生成するために、次のようなクラスを作成しました。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」フォルダにあります。コードを見てみると、データを整理するためのより良い方法がおそらく 100 万ありますが、それは今のポイントではありません。) 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 または (dart2js Javascript を使用して) Chrome で再生すると、効果音が歪むことです。(Firefox では、さらに悪い問題があります!)

私が怠ってきた、または考慮しなければならない明らかなことはありますか? それ以外の場合、できれば Dart のコンテキストで役立つ参考文献やチュートリアルはありますか?

4

1 に答える 1

1

Dartを試してくれてありがとう！

まず、Firefox は Web Audio API をサポートしていません (まだ?)。Chrome と Safari は Web Audio API をサポートしています。ここで Web Audio API の採用を追跡できます: http://caniuse.com/#feat=audio-api

次に、Dartium でこの Web オーディオ API サンプルを試してください: https://github.com/dart-lang/dart-html5-samples/tree/master/web/webaudio/intro 最初にレポを複製して実行する必要があります。ローカル。このサンプルはローカルで機能します。

これはバグレポートのように聞こえます。dart-html5-samples のサンプルは機能するが、上記のコードが依然として歪んでいる場合は、http://dartbug.com/newでバグを開いて確認してください。

考慮すべきことの 1 つは、keyUp ハンドラを接続する前に、特定の MISSLE サウンドがロードされるまで待機することです。

于 2012-10-17T20:10:34.507 に答える