Controlling the Pan

The setPan method of the Sound object can be used to control the pan of an attached sound. The setPan method follows this syntax:

 mySound.setPan(pan); 

The pan argument specifies the pan of the sound. It can be an integer from 100100, where 100 plays the sound in only the left speaker and 100 plays the sound in the right speaker. A value of 0 balances both speakers evenly.

The setPan method does not affect any other methods that you've applied to your Sound object. If you already used the setVolume method to apply a volume of 50 and then use the setPan method to apply a pan of 100, the sound plays at 50 percent of full volume in the right speaker. You even can set the pan of a sound that has the Stop method applied to it, but because the sound is stopped, it won't do a whole lot. Of course, if you start the sound, the pan that was applied to the Sound object before it was stopped still is applied to it.

The setPan method applies to all the sounds in the timeline containing the object to which it's applied. So, just as the setVolume method can affect multiple Sound objects in a single timeline, so too can the setPan method.

Just as the setVolume method has a corresponding getVolume method, setPan has a corresponding getPan method. You can use the getPan method to retrieve the current pan setting for a Sound object.

Exercise 18.6 Using the setPan Method

Now it's time to get a little more complicated and create a movie that has controls for not only the volume, but also the pan of several sounds. Each sound will be in its own movie clip, so you can control the volume and pan of each sound individually.

1. Open mixer.fla from the Chapter_18/Assets folder on the CD. This movie is very similar to volume.fla and volume_mix.fla. It has two layers , each of which has a total of 35 frames :

   • Actions. This layer has a keyframe in frame 35. That keyframe contains a Stop action.

   • Background. This layer contains the Background Clip movie clip, which is identical to the one in volume.fla and volume_mix.fla.

   Notice that there is no Volume Controller layer. (See Figure 18.10.) That's because you're going to attach multiple instances of a Volume Controller movie clip, similar to the one that you've worked with in previous exercises, using ActionScript. You should see this movie clip in the Library.

   Figure 18.10. The movie contains two layers.

   

2. Select frame 35 of the Actions layer. You need to initialize some variables , so add the following ActionScript:

    maxSounds = 6;  movieWidth = 550;  movieHeight = 100; 

   Here's what you're going to use each of those variables for:

   • maxSounds. This is the number of sounds that you want to attach and control. You use this variable later, when you use ActionScript to attach instances of the Volume Controller movie clip to the movie.

   • movieWidth and movieHeight. These are the width and height of the movie in pixels. You need to initialize these variables because you are using them to control the volume and pan of your sounds.

3. Locate the Volume Controller movie clip in the Library. Right-click or Control-click this symbol and select Linkage from the pop-up menu. Set Linkage to Export This Symbol, and set Identifier to controller. Click OK when you're done. Take a look at the Symbol Linkage Properties applied to the six sounds in the Sounds Library. You should see that the sounds each have an identifier: sound1, sound2, sound3, sound4, sound5, and sound6.

4. Select frame 35 of the Actions layer and add the following ActionScript after the code you added previously:

    for (i=1; i<=maxSounds; i++) {     __root.attachMovie("controller", "soundClip" + i, i);  _root ["soundClip" + i].soundID = "sound" + i;      __root["soundClip" + i]._x = movieWidth/2;      __root["soundClip" + i]._y = movieHeight/2;  } 

   This ActionScript uses the attachMovie method of the Movie Clip object to attach an instance of the movie clip that has an identifier of "controller." The Volume Controller movie clip has that identifier. The instance will be named "soundClip" + i, and it will have a depth of i. The variable i is part of the for loopit starts at 1 and is incremented each time Flash runs through the loop, until it reaches the value maxSounds (which you initialized at 6).

   Next, the ActionScript creates a variable called soundID inside the instance of the Volume Controller movie clip that was attached. It also sets its _x and _y properties to equal half of movieWidth and movieHeight, respectively.

5. Choose Control > Test Movie to see what happens! You should end up with an instance of the Volume Controller movie clip in the middle of the movie. If you drag that instance of the movie clip away from the center, you'll notice there's another one behind it. You should be able to find six instances of the movie clip because the loop you added to frame 35 runs through six iterations. (See Figure 18.11.) You shouldn't hear any of the sounds yet because you haven't added the ActionScript to attach or start them. Close the Test Movie window when you're done.

   Figure 18.11. Six instances of the Volume Controller movie clip are added to the movie.

   

6. Locate the Drag Me movie clip in the Library and open it in Symbol-Editing mode. (See Figure 18.12.) This movie clip has two layers, each of which has a single keyframe:

   • Button. This layer contains a button with all the ActionScript needed to drag the Drag Me movie clip around on the Stage. That's how you were able to drag the Volume Controller movie clip around when you tested the movie. This movie clip is embedded inside the Volume Controller movie clip that was attached to the movie.

   • Text Box. This layer contains a dynamic text box, with a variable name of text. You'll add some code that fills in this text box a bit later.

   Figure 18.12. The Drag Me movie clip has two layers.

   

7. Now locate the Volume Controller movie clip in the Library and open that symbol in Symbol-Editing mode. This movie clip contains only one layer, named Drag Me, which contains an instance of the Drag Me movie clip. Select that instance of the Drag Me movie clip and add the following ActionScript to the Actions panel:

    onClipEvent (load) {     mySound = new Sound(this);      mySound.attachSound(_parent.soundID);      mySound.start(0, 9999);  } 

   This ActionScript should look very familiar by now! It creates a new Sound object inside the Drag Me movie clip. The onClipEvent is attached to the Drag Me movie clip, so this refers to the Drag Me movie clip that's nested inside the Volume Controller movie clip.

   After the sound object is created, a sound is attached to it using the attachSound method. The identifier of the sound that is attached is _parent.soundID. This sets the name of the sound to be attached equal to the value of the soundID variable in the Volume Controller movie clip. This variable is set in the for loop that attaches all six instances of the movie clip.

   Finally, the Start method is used to make the sound play. It starts at the beginning of the sound and loops 9999 times.

8. Following the load clip event, add an enterFrame clip event so that you can control the volume and pan of the sound you attach:

    onClipEvent (enterFrame) { } 

9. You need to use the enterFrame clip event to control several things. First you need to figure out the global coordinates for the instance of the Drag Me movie clip. Add the following ActionScript to accomplish that:

    point = {x: this._x, y: this._y};  _parent.localToGlobal(point); 

   These two lines will take the local _x and _y properties and convert them to global coordinates.

10. Now add a little ActionScript to set the volume and pan of the sound attached to this instance of the Drag Me movie clip, based on the global coordinates of the movie clip:

     newVolume = (__root.movieHeight - point.y)/__root.movieHeight*100;  newPan = (point.x  (_root.movieWidth/2))/(_root.movieWidth/2)*100;  mySound.setVolume(newVolume);  mySound.setPan(newPan); 

    The ActionScript to determine a new volume (newVolume) is very similar to what you used in previous exercises. In this case, you are using point.y instead of this._y because point.y is the global Y coordinate of the movie clip that you're moving around (Drag Me). You also are setting a new pan (newPan) based on the global X coordinate of the movie clip. The calculation for newPan does the following (assume the current global X coordinate is 20):

    • Subtract the X coordinate of the horizontal center of the movie from the current global X coordinate. point.x (root.movieWidth2) = 20 (5502) = 20 275 = -225.

    • Divide that value by the X coordinate of the horizontal center. -225275 = -0.82.

    • Multiply the value by 100 to get a value for newPan. -0.82100 = -82.

11. Now you just need to provide a value for the text box (named text) inside the Drag Me movie clip. Add the following ActionScript to do that:

     text = point.x + ", " + point.y + ", " + mySound.getVolume() + ",  " + mySound.getPan(); 

    This ActionScript creates a string of text that shows the global X position, the global Y position, the volume, and the pan of the sound. (See Figure 18.13.)

    Figure 18.13. The finished ActionScript.

    

12. Choose Control > Test Movie and move your movie clips around. (See Figure 18.14.)

    Figure 18.14. The finished movie. Notice the text to the right of each instance of the Volume Controller movie clip.

    

As you move a move clip closer to the top of the movie, the volume of the attached sound increases . As you move it closer to the bottom, the volume decreases. When you move your movie clip to the right, the pan of the sound follows it. If you move the movie clip to the left, the pan of the sound moves to the left speaker. When you're done testing, save and close your movie.