my way to preload images! haha
Update Coming Soon! Check out Skem9's future roadmap
Search for in

Flash - Actionscript .^. Coding Tutorials | Submited May 20, 2012

Written by: Zac

How to create buttons in Flash to control an audio file.
This tutorial is intended for very basic users of Flash. We will not be going too far into the program or Actionscript. The point is not to copy what is here, but to take what you learn from this tutorial and apply it to your own ideas. I will be using Adobe Flash CS5 on a MAC system. If your on a PC platform there should not be any major differences. If any.


The first step in this tutorial is to make your buttons.
So make a layer and name it "Buttons" or whatever you want. This step is pretty much all on you and what you want to create. You can make a simple box of a button, or you can create the most elaborate button you wish.
As you can see below I chose to make a pretty simple button with some text on the bottom.

User Picture..

Once theses buttons are made. Make sure to give them an Instance Name. This will be very important when we add the Actionscript in later.
To give the buttons an Instance name, just click on the image with the black arrow tool, go to the properties panel, and type in the name that you want to give them. I used btnPlay, and btnStop for mine.


Make sure you have an audio file picked out that you want to use. I suggest a good quality .MP3. Also be sure to have that .MP3 in the same folder as your buttons on your computer. We are going to be pulling the audio file from a folder on your computer rather than importing the file into Flash itself.


With the audio file picked out, go ahead and make a new layer above your "Buttons" layer and name it "scripts".
Your set up should resemble this. "Buttons layer on bottom and "Scripts" later on top.

User Picture..

Notice in the "buttons" layer there is a keyframe(Black dot) That tells us that there is content there. Which is our buttons.
In the "Scripts" layer you should insert a BLANKkeyframe(Hollow dot). And then open your Actions window.

Window>>Actions.

When you start typing the Actionscript here you will see the little @ symbol above the BlankKeyframe symbol appear.

So with the Actions window open. We can start typing out code to control the audio!


1.) The first part of the Actionscript is to create a variable (Container) for the audio.
var mySound:Sound = new Sound();

2.) Then we will create a variable (Container) to store the requested audio file.
var soundURL:URLRequest = new URLRequest("whiteLies.mp3");
As you can see, I'm using the song "whiteLies.mp3" as my audio file. When you add your "link" in for the audio file make sure you spell and type it out exactly as it is in the folder. It IS case sensitive!

3.) Then we are going to load the file into the audio variable (Container).
mySound.load(soundURL);

4.) With the audio all set up. We have to make a variable(Container) for the channels the audio is going to use.
var channel1:SoundChannel = new SoundChannel();

5.) This piece of code is what listens or detects the PLAY button being clicked. This is were those Instance Names come in handy!
btnPlay.addEventListener(MouseEvent.CLICK, playSound);

6.) Once the PLAY button is clicked. What should it do? This code tells it to play.
function playSound(evt:MouseEvent):void {
channel1 = mySound.play();
}



So far we have coded the PLAY button to lay the song "whiteLies.MP3" when it is clicked. Now we have to code the STOP button to stop the music. Keep this code in the same area as the previous code!

1.) This code is listening or detecting the STOP button being clicked. Those Instance Names come in handy again!
btnStop.addEventListener(MouseEvent.CLICK, stopSound);

2.) And of course, this code tells the music to stop once the button has been clicked.
function stopSound(evt:MouseEvent):void {
channel1.stop();
}



That's all there is to it! Make sure to test your movie and see that your buttons work. If not, go back and see if you audio file is in the right place, and double check your code, it is very case sensitive!

You should have 2 layers only. A layer to hold your buttons, and a layer for your Actionscript.

Your full Actionscript should look like this.

//Create a variable (container or an instance) for the audio
var mySound:Sound = new Sound();

//Create a variable to store the requested audio file
var soundURL:URLRequest = new URLRequest("whiteLies.mp3");

//Load the file into the audio container/variable
mySound.load(soundURL);

//Create a variable or container for the sound channel
var channel1:SoundChannel = new SoundChannel();

//Listen/detect a button click (play button)
btnPlay.addEventListener(MouseEvent.CLICK, playSound);

//Define this function or group of reactions
function playSound(evt:MouseEvent):void {
channel1 = mySound.play();
}


//Listen/detect a button click (stop button)
btnStop.addEventListener(MouseEvent.CLICK, stopSound);

//Define the function or group of reactions
function stopSound(evt:MouseEvent):void {
channel1.stop();
}


If you have any complications or questions fell free to message me here on Skem9 and I will get back to you ASAP! =]


No Comments Found