We will be undergoing scheduled maintenance on May 20th, 2013 at 02:00 GMT.
Adobe Flash ActionScript 3.0 for Designers Tutorials
Controlling Audio / Project 5: Music Jukebox
Visitors to VTC.com will be able to view all introductory videos for each training course.
Free Trial Members will gain access to first three chapters for each training course.
Full Access Members have full access to VTC.com�s entire library of video tutorials.
Learn More
Subtitles of the Movie (Adobe Flash ActionScript 3.0 for Designers / Controlling Audio / Project 5: Music Jukebox)
Let's now take a look at the projects that we're going to be building in this section of the tutorial, starting with our jukebox. You can pick up any jukebox graphic, or you can make your own and go ahead and add the buttons to the graphic as well as the volume control. You'll need a Mute, Low, Medium and High and then let's go ahead and Control, Test the movie and you'll see there's our jukebox and I can pick a song from the selection there and then there's the music. I can turn down the music, Medium, or High. I can also mute the music and then choose another song and put it on High. And so you can see I have a selection of music here. You can create as many buttons as you want. You can have another little addition here that will bring up maybe four additional songs. So, that's the jukebox project. If we look quickly at the script we can see the kinds of methods we'll be using in classes, so here is my sound objects that I'm creating, in this case I'm creating four sound objects; setting up the URLRequest for each of those objects - song1, 2, 4 and 5. I'm loading each of the songs and then I have here a typical function that we've used and seen previously where I'm detecting which button has been pressed - btn1, btn2, btn3 or btn4, running a function then that will go ahead and play that sound object. There's some parameters there for when in the song I'll start to play and how many times I'll loop it and then down here are my EventListeners, I have EventListeners both for the sound buttons as well as the volume buttons. If we look very quickly at the volume control, that starts right below here, the function to run when the song buttons are pressed. There is my function for the volume mute. SoundMixer is the object, or the class that we're going to be using; soundTransform is a subclass of that class and then I'm setting up the SoundTransform value to zero, that's mute. That's going to be a value between 1 and zero, or actually I should say between zero and 1. The low volume is going to be set to .15, medium is .5 and then, then the last one, volume high is, we're setting our SoundTransform value to .9 and that could go all the way to 1 if I want to make it louder. So, there is a preview of the scripting that we'll be working with for our jukebox. A bit more complex will be our volume slider. I'll demonstrate this real quickly. Play button. The slider, notice, is working. All the way to the left is mute, all the way to the right is full volume. I have a Pause button that will play this back from where I paused it when I click on the Play button, as well as a Stop button. The difference is now this will start from the very beginning. Notice that that's playing right from the same spot, versus the Pause which will start that up right in the same place. Take a quick look at the various classes, properties and scripts we'll be using starting off with our loading our sound file, creating a SoundChannel; a little bit different than the previous jukebox script and then we're going to set a Boolean default when the music is playing. This is for the Pause and the Stop buttons. There's our pausePosition, to start with is zero. We're declaring that variable. Go ahead and play the button EventListener for the play button and then here is the play function. This music is not playing then make it start right here. Notice that there is my play method for the mySoundChannel that I created up above. Then I'm going to go ahead and set up the pause button EventListener. Probably the most complicated part of this script is the pause button, checking to make sure you were when you pressed the Pause button; that's what this script does right here - saves the current time and stops the playing when the pause button is pressed. We're going to use the Position property of your sound channel. And here we have the stop button EventListener. That one's much more straightforward; just stop the playback. Here is the stop play, right here. SoundChannel null if there's nothing playing in the SoundChannel then stop it. Here is the rectangle for the groove of our slider. Notice that it's 100 pixels wide; that's important. I've seen a lot of these scripts where you can change the position, vertical or horizontal and the size in pixels of the slider, but not this one. Then we have the EventListener to trigger the startDragging function, in other words when you start dragging the slider. Setup the limits of the slider so it doesn't extend above or below the groove or too far left or too far right. Notice that again, when I test the movie this slider stays on that groove making it appear more realistic. It would be very sloppy if this moved up and down or went beyond the edge. Then we have our, what I think is the key element of this script right here is setting up the EventListener to change the volume not just keep the slider on the groove, right here: adjustVolume is the name of the function we're going to run when that event has been satisfied, ENTER FRAME, in other words, as soon as I open this ShockWave file, run this function, adjustVolume. I'm creating a variable to calculate the volume from the slider position. When the slider's all the way to the left the volume is zero, when the slider is all the way to the right the volume's going to be set to 1. There's mySoundTransform class and there's the myVolume property. Again that's going to be a value between zero and 1, but rather than setting that like I did in the jukebox, here I'm basing that on the position of the slider relative to the groove. So this is another key line right here. I'm taking my volume underscore mc.mySlider underscore mc, checking the X property which is the position, dividing it by 100. Again, that's relative to the slider. So when it's all the way over to the left, 100 divided by 100 equals 1 and you're going to set a myVolume value of 1 and that'll be maximum volume. Then down here I have the stopDragging function, in other words when you stop dragging on the slider, dragging equals false. Go ahead and set the stopDrag property here of the mySlider movie clip; in other words, when it starts dragging no longer move that slider. So there you have a very brief and quick overview of some of the scripts that we'll be working with. Let's now move on to the next movie so I can start giving you the various theory and review the various classes and properties that you'll need to learn so that this script and the previous one for the jukebox makes more sense, starting with the next movie where I review the various sound classes that we'll be working with followed by scripts for loading sounds, playing back sounds, pausing and resuming sounds and monitoring sounds.
Tutorial Information
| Course: | Adobe Flash ActionScript 3.0 for Designers |
| Author: | James Gonzalez |
| SKU: | 34060 |
| ISBN: | 1-935320-82-3 |
| Release Date: | 2009-11-09 |
| Duration: | 9.5 hrs / 101 lessons |
| Work Files: |
Yes |
| Captions: | No |
| Compatibility: |
Vista/XP/2000, OS X, Linux QuickTime 7, Flash 8 |
VTC Sign up & Benefits
- Unlimited Access
- 81,350 Video Tutorials (14,200 free)
- Video Available as Flash or QuickTime
- Over 715 Courses
- $30 for One Month Access
- Multi-User Discounts Available
