Create an Interactive Sound fla
To learn more about the "timeline approach" we will create a simple movie with two buttons, "play" and "stop" which will control playback of our "sound only" timeline. Download the interactivesound.fla to see an example (Right-click on Windows, Option-Click on Mac).
| 1) |
|
Launch the Flash authoring application. Save the fla as interactivesound.fla. Add two layers named "buttons" and "sound" to the main timeline.
|
| 2) |
|
Add play and stop button symbols to the library. For this tutorial I used the play and stop buttons from the circle button set of the Buttons Common library.
|
| 3) |
|
Add a sound "symbol" to the library. For this tutorial I used the "Beam Scan" sound from the Sound common library.
|
| 4) |
|
Create an instance of the play and stop button symbols by dragging them to the buttons layer of the main scene.
|
Create a "Sound Only" Timeline
| 1) |
|
Create a new movie clip symbol named "sound only mc" with three layers
named "labels", "actions", and "sound".
In some cases it is useful to see the entire sound on the timeline. Set
the height of the sound layer to 300% by double clicking the sound layer
icon and setting the height at the bottom of the dialog to 300%.
|
| 2) |
|
Insert a stop action on first frame in the actions layer.
This stop action prevents the flash player from automatically playing
our sound when the movie first loads.
|
| 3) |
|
Add the "Beam Scan" sound to frame 5.
Sound panel should be configured so that sync = event, effect = none
and loop = zero. If you want to see the entire waveform of the sound,
add a frame in frame 6 and click/drag this frame to frame 34 or until
you see the whole sound on the timeline.
|
| 4) |
|
Add a label named "start" to frame 5.
To see the whole label name on the timeline add a new frame in frame
6 and click/drag to frame 34. Choose a label name that represents the
play state of a sound such as "play", "start", "on" etc. Be consistent
in your label naming.
|
| 5) |
|
Add a stop action to frame 6 in the actions layer.
This prevents the playhead from reaching the stop sync sound command
(see next step) before the Beam Scan sound is finished playing. We don't
want the playhead to reach the stop sync sound command unless we send
it there intentionally otherwise the playhead may reach the stop sync
sound command before the sound has played all the way through.
|
| 6) |
|
Add the "Beam Scan" sound to frame 35 of the sounds layer and this time
set sync = stop.
In the sound panel, effect = none and loop = zero. You should now see
a black square in this frame. The black square represents the stop sync
sound command. This stop sync command will only stop the "Beam Scan" sound.
|
| 7) |
|
Add a label called "stop" to frame 35 of the labels layer.
Choose a label name that represents the stop state of a sound such as
"stop", "end", "off" etc. Be consistent in your label naming.
|
To summarize, we created a timeline with two sections. The first is labeled "start" which has a sound and the second is labeled "stop" which has a stop sync sound command. We also added two stop actions to prevent flash from prematurely playing and stopping the sound due to automatic movement of the playhead.
.
Now drag an instance of the "sound only mc" symbol from the library window to the stage. Name the instance "beamscan" in the instance panel. Flash represents sound only movie clips with a small blue circle. The circle is for reference only and will not appear in the exported swf. Save the interactivesound.fla.
Dont export the swf yet! In the next section we add actionscript to the play and stop buttons so we can test sound interaction
Tips: Instead of manually recreating this movie clip for each interactive sound, you can duplicate the sound only mc symbol in the library and give new symbol a library item name. To create a new sound only timeline all you need to do is to create an instance of your duplicated symbol, give it a meaningful instance name and change the sound in the frames labeled start and stop. In four quick steps you can add a new interactive sound to your movie.
You can also make an fla which only contains the "sound only mc" movie clip symbol and save it to the Libraries folder in the flash application folder. By adding this fla to the Libraries folder it becomes one of the common libraries which you can access from the windows menu. Now the "sound only mc" is immediately available to you whenever you are using the flash application. This is a great time saver!
Tutorial Navigation:
Introduction
The "timeline approach" in Conception
Create an Interactive Sound fla
Use Actionscript to Control a "Sound Only" Timeline
Use the FlashSound Javascript API to Control a "Sound Only" Timeline
Summing it Up
