Saturday, 20 August 2011

Create a soundboard in Actionscript 3

This post is an update to the Soundboard tutorial in Actionscript 2. I created the soundboard back in 2008 when I was still using Flash 8. In that version I added the audio clips into the down state of the buttons. This increased the overall file size as all the sound clips were embedded in the swf. However, in this AS3 version I will load the sound clips in dynamically which will reduce the file size of the swf. You will of course need some sound files for this tutorial.

Create a soundboard in Actionscript 3

Step 1

Firstly, create a new folder called ‘Sounds’ to hold all your audio files. Then open up a new AS3 file and save it with the name ‘Soundboard’ in same directory level as the Sounds folder.

Step 2

On the stage create your buttons. You can use the primitive shape tools or you can import images. Once you have created all the buttons convert them into movie clips (F8) and give them appropriate instance names.

Step 3

On the timeline insert a new layer called ‘Actions’ then open up the Actions panels and enter the following code. You will need to change the values in the buttonsArray and the soundArray to the names of your files.

//Array for buttons instances.
var buttonsArray:Array = new Array();
buttonsArray[0] = butt1;
buttonsArray[1] = butt2;
buttonsArray[2] = butt3;
buttonsArray[3] = butt4;
buttonsArray[4] = butt5;
buttonsArray[5] = butt6;

//Array for the sound clip names.
var soundArray:Array = new Array();
soundArray[0] = 'sounds/sound1.mp3';
soundArray[1] = 'sounds/sound2.mp3';
soundArray[2] = 'sounds/sound3.mp3';
soundArray[3] = 'sounds/sound4.mp3';
soundArray[4] = 'sounds/sound5.mp3';

//This adds the mouse click event to the buttons. 
for(var i:uint = 0; i < buttonsArray.length; i++){
 buttonsArray[i].addEventListener(MouseEvent.CLICK, buttonClicked);

//This function stops any sound clip that is playing and
//plays the sound file thats clicked.
function buttonClicked(e:MouseEvent):void{ 
 for(var i:uint = 0; i < buttonsArray.length; i++){
  if( == buttonsArray[i]){
   var s:Sound = new Sound();
   s.load(new URLRequest(soundArray[i]));;

//This function adds a keyboard down event to the stage 
//to stop a sound when the space bar is pressed.
stage.addEventListener(KeyboardEvent.KEY_DOWN, spacebarClicked);

function spacebarClicked(e:KeyboardEvent):void{ 
 if(e.keyCode == 32) SoundMixer.stopAll();
Step 4

Export your movie Ctrl + Enter. You should now have a Soundboard in Actionscript 3.

Related posts
Playing sound files in Actionscript 3
Play external sound file in Actionscript 3
Toggle sound button in Actionscript 3


  COPYRIGHT © 2014 · ILIKE2FLASH · Theme by Ourblogtemplates

Back to TOP