Playing Sounds in ActionScript 3
       by kirupa  |  24 March 2010

Playing sounds in ActionScript is fairly straightforward thanks to the Sound class. All you really need to do is put the class to good use to that you can load a sound, buffer/preload it, and then play it. In this short article, I will provide you with the code you need and explain how everything works.

Note - This tutorial covers how to play sounds using ActionScript 3. For playing sounds using ActionScript 1, click here.

Overview of Playing Sound
In general, when it comes to playing sound in code, there are several things that you need to do:

1. Access an External MP3 File
   The sound files that you load will not be included inside the SWF file. The files need to be located externally such as alongside your SWF file.
2. Preload the Sound
   Before playing the sound, you need to make sure the sound has been fully loaded first. If you didn't do this, your sound will stutter on slower connections. Streaming sounds will be covered in a future article, so don't worry!
3. Play the Sound
   Once your sound has been fully loaded, all that is left is for you to actually play it.

Now that you know, at a very high level, what it takes to play a sound file, lets' go ahead and look at the code.

The Code
The code for pointing an external sound file, preloading it, and playing it can be written in the following lines of code:

var soundClip:Sound;

 

function init() {

soundClip = new Sound();

soundClip.load(new URLRequest("<path to sound file>"));

soundClip.addEventListener(Event.COMPLETE, soundLoaded);

soundClip.addEventListener(ProgressEvent.PROGRESS, soundLoading);

}

init();

 

function soundLoaded(e:Event) {

soundClip.play();

}

 

function soundLoading(e:ProgressEvent) {

// preloader information goes here

}

Let's look at how the code works line by line:

var soundClip:Sound;

The first line is pretty straightforward. I am declaring a variable called soundClip whose type is Sound. Another way of saying it is that I have a Sound object called soundClip. You can learn more about classes / types / objects in my earlier Classes in ActionScript 3 article.

Next up is the init() function:

function init() {

soundClip = new Sound();

soundClip.load(new URLRequest("<path to sound file>"));

soundClip.addEventListener(Event.COMPLETE, soundLoaded);

soundClip.addEventListener(ProgressEvent.PROGRESS, soundLoading);

}

init();

This function gets called first when you run your application because it gets called - the function call is directly below the function!

The code inside the init function points to the sound file you want to load and sets up the event handlers for letting your app know when the sound has been fully downloaded. Let's look inside it to learn more.

The first line of our init method initializes our soundClip object to a new Sound object:

soundClip = new Sound();

While before you simply declared a variable called soundClip whose type is Sound, it isn't until you initialize it that the Sound object is actually created. With this object created, you have access to all of the properties the Sound class provides you with.

The first property we will look at is load:

soundClip.load(new URLRequest("<path to sound file>"));

The load property takes the URL of the sound file to load. The moment this line gets executed, your sound file begins its download. It is important that you are aware of the sound file downloading and when it finishes downloading. The next two lines help you with just that:

soundClip.addEventListener(Event.COMPLETE, soundLoaded);

soundClip.addEventListener(ProgressEvent.PROGRESS, soundLoading);

Both of these lines set up listeners from our Sound object that associate an event with a function to call when that event is fired. The function that reacts to an event is often called an event handler.

In the first line, we listen to the Complete event and play the soundLoaded function when the sound file's download has fully completed.

In the second line, we do something similar except we play the soundLoading function as the sound file is downloading.

function soundLoading(e:ProgressEvent) {

// preloader information goes here

}

The last line we looked at was one that called a function as your sound file was downloading. That function is called soundLoading. With each chunk of data that gets downloaded, this function gets called. Notice that it takes an argument, and that argument is of type ProgressEvent.

The ProgressEvent class contains properties that you can use to gauge the progress of the download. The two properties that would be relevant are bytesLoaded and bytesTotal. You can use them both to get the current progress by dividing the values they return.

Here is an example of me using the ProgressEvent object e and dividing the number of bytes loaded by the total size of the file:

var currentProgress = Math.round(e.bytesLoaded/e.bytesTotal);

The final thing to look at is our soundLoaded function:

function soundLoaded(e:Event) {

soundClip.play();

}

This function is the event handler for the Complete event that fires when the sound file you are loading has fully downloaded. With our sound fully loaded, the only thing that remains is to actually play your sound. That is done by calling the play() method on your soundClip object of type Sound.

Conclusion
That's all there is to loading sound in ActionScript. As long as you use the Sound class and play the sound only after it has fully loaded, everything is golden....like a retriever!

Just a final word before we wrap up. If you have a question and/or want to be part of a friendly, collaborative community of over 220k other developers like yourself, post on the forums for a quick response!