Skip to content

Working with sound

Mark Knol edited this page Jan 17, 2018 · 25 revisions

📢 Play a sound

To play a cross-platform Sound, you need to save/encode your sound to different extensions (like this: mySound.m4a, mySound.mp3, mySound.ogg). When grabbing the sound out of the AssetPack, you don't need to add the extension, Flambe will use the right sound for the right platform. For example, Flambe will try to load the MP3 if the environment supports it, otherwise (such as in Firefox) the OGG will be loaded.

⚠️ Important note: Read this if you want to use MP3 in your game https://www.scirra.com/blog/64/why-you-shouldnt-use-mp3-in-your-html5-games

More on loading (external) assets, read Working with assets.
Once you have the asset pack, this will play the sound.

pack.getSound("mySound").play();

Tip: Convert sounds using Audacity
Make sure you've also installed LAME MP3 encoder and the FFmpeg import/export library.

Controlling playback

The play() and loop() of a Sound instance returns a Playback instance. You can use the Playback object to manipulate the volume, get the duration or pause/stop the sound.

var myPlayback:PlayBack = pack.getSound("mySound").play(); // play a sound
var myPlayback:PlayBack = pack.getSound("mySound").loop(); // loop a sound

Alter sample volume

Volume values are from 0-1.

// directly set volume when you start the sound to half volume (0.5)
pack.getSound("mySound").play(0.5);
// .. or set the volume afterwards
myPlayback.volume._ = 0.5; // set volume to half volume
// .. or fade the sound in one second to half volume
myPlayback.volume.animateTo(0.5, 1); 

To understand the animate and underscore syntax, read Working with values.

Pause/play/stop

Calling dispose() on it will stop the sound prematurely.

myPlayback.paused = true; // set to pause
myPlayback.dispose(); // stop sound and remove

Detect when sound completed

myPlayback.complete.connect(onSoundCompleted);
function onSoundCompleted(to:Bool, from:Bool)
{
   trace("onSoundCompleted. " + to);
}

More on signals over here

Controlling global volume

If you want to alter the global volume which affects all samples, or want to mute all sounds, you should do that using the System.volume value.

System.volume._ = 0; // mute all sounds
System.volume._ = 1; // unmute
System.volume.animateTo(0.5, 1); // fade global volume to half volume (0.5) in 1 second.

Loading external sounds

You have to add all formats to your manifest. Because there are multiple assets with the same name, Flambe will pick the best one when loading. If your file names don't end in .ogg, .m4a or .mp3, pass an explicit AssetFormat to add().

var manifest = new Manifest();
manifest.add("mysound", "mysound.ogg");
manifest.add("mysound", "mysound.m4a");
manifest.add("mysound", "mysound.mp3");

System.loadAssetPack(manifest).get(function (pack) {
     pack.getSound("mysound"); // either came from the ogg, m4a or mp3 depending on browser support
}); 

Support

  • You need to test where sound is actually playing. If it works in Flash, does not automatically mean it works in the HTML version. It varies in mobile browsers. Your as good as safe when you encode to all given extensions, then it's up to the browser to support playing that sounds.
  • Not all Android devices seems to play sound. On slow/older Android devices sound seem too laggy or don't play instantly which could cause timing issues.
  • Some devices are blacklisted for playing sound. You'll get a warning in your console "HTML5 audio is blacklisted for this browser". Use -D flambe_html_audio_fix to disable this blacklist and be adventurous.
  • On iOS 5+ sound require user input on pointer down. It is a good idea to capture the first tap in your game and play a silent sample.
  • Since iOS 9 sound require user input on pointer up.

Looking for a demo project with sound? See https://github.com/aduros/flambe-demos/tree/master/horses

Clone this wiki locally