Custom Search

Using a button as a 'play music' option

It is sometimes annoying if the music starts as soon as you open the document. It can sometimes be better if the music plays when you want it to. This is one solution to that - but it does have its problems... we will deal with those later.

To make the music play you need to click once - there is a problem if you double click - try it!

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

In this tutorial I shall use the flickering flame picture e-card that we made in lesson 12 and add the option of a choice of carol to be played while you look at it!

The problem with simply inserting a sound layer into out animated flame project is that as soon as the animation finishes it starts again.. it will therefore start your sound clip on each repeat - that is quite a cacophony I can tell you!

This tutorial uses a button press as the initiator of the sound - but if your user presses that more than once you will get the same problem. We will deal with a more sophosticated solution to the problem later - but this - if the user is imformed how to use it - produces a simple, pleasing outcome.

Open the Flash document that you made for your flickering flame project.

Save it under a new name.

Now we can work on it without spoiling your previous work.

We need to add a new layer called soundButton

We then need to create a button for the user to press to make each carol play.

I made this graphic using Fireworks to form a background for my buttons. I increased the size of my document so it would fit in at the bottom. I then imported it to the stage and put it in place.

and then I made simple gradient fill circles in Flash to act as the buttons.

You need to convert each circle to a button symbol (Modify - Convert to Symbol).

Double click on it and the page relating to that symbol will open.

Look at your Timeline and this will have appeared.

You need to insert a keyframe at the down position and then drag your soundclip onto the stage.

Your button is primed! Now return to your main document. If you look at the heading you will see:

You have to return by selecting Scene1 from the header.

You can now test your movie. When you click on the button your carol should play.

We now need to add a button that will stop the music.

Make a button graphic as before (mine is a Flash gradient fill circle). Convert it to a button symbol and then position it on your page. Now you must select it (don't double click only select - you should still be on the scne 1 page) and add this code.

on (release) {stopallsounds();
}

Now test your movie and you should find that you can set the music playing and stop it when you will!

I then simply added more music buttons with different tunes. The only problem is that when you press another button the previous piece continues to play!

We can solve this by telling the program that if the user moves the mouse to another button we want to stop the music.

Select each 'tune button' in turn and add this coding:

on (rollOver){stopallsounds();
}

It is fun to create your own e-card. It can be sent via an e-mail.

Instead of songs you could attach a voice message - very welcome for distant loved ones!