Sound in Action Script

AD 305 Electronic Visualization I : School of Art and Design : University of Illinois at Chicago : Spring 2007

Sound in Action Script

"The games of a people reveal a great deal about them.“ Marshall McLuhan


Controlling sound

Enhance animation and interactivityEngaging more user’s sensesEstablish the mood of the movieUse narration to accompany the storyGive audible feedback to interactions

Flash supports .WAV, .MP3, .AIF

Sound class controls sound

StartStopAdjust sound volumeStereo effect


Controlling sound

sound object

mySound=new Sound();

mySound.attachSound(“sound_name”);

mySound.start ( seconds offset, loops);

Seconds offset number that determines how many seconds into the sound it should begin playing

(from the beginning 0, or from a later point)

Loops how many times sound will play

No parameters Flash playes sound once from the start


Controlling sound

mySound.start ( 0, 5);

Plays sound from the beginning 5 times

mySound = new Sound();mySound.attachSound("guitar");startButton_btn.onRelease = function(){

mySound.start(0,5);}stopButton_btn.onRelease = function() {

mySound.stop();}


Modifying sounds

Flash allows to attach many sounds to the same sound objectStart function will play the most current sound attached

Volume controlsetVolume()

Racing game- control the volume of the car engine sound as the cars pass by

Pan control - control of the output through the left or right speakersetPan()

Pong game – control the left and right hit wall sounds from the appropriate sides


Modifying sounds

setVolume(percentage of the full volume from 0 to 100)

100- maximum volume0- silence

setPan(number from -100 to 100)

-100 left speaker100 right speaker0 plays sound from both speakers equally


Modifying sounds – 02soundobject_pan_volume.fla

Open 02soundobject_pan_volume.fla from the Pickup folder


Modifying sounds – 02soundobject_pan_volume.fla

Drag the instances of the volume, left, right, both buttons on the stage and name them:

volUp_btn

volDown_btn

leftSpeaker_btn

rightSpeaker_btn

bothSpeakers_btn


Modifying sounds

volUp_btn.onRelease = function() {mySound.setVolume(100);

}volDown_btn.onRelease = function() {

mySound.setVolume(20);}leftSpeaker_btn.onRelease = function() {

mySound.setPan(-100);}rightSpeaker_btn.onRelease = function() {

mySound.setPan(100);}bothSpeakers_btn.onRelease = function() {

mySound.setPan(0);}


Modifying sounds independently 03modify2sounds.fla

Create separate sound objects with parameters that target specific movie clips

Sound objects will be applied to different movie clips so thatsetVolume () and setPan () could control the sounds separately


Modifying sounds independently 03modify2sounds.fla

clip1= _root.createEmptyMovieClip("clip1", 1);clip2 = _root.createEmptyMovieClip("clip2", 2);mySound1 = new Sound(clip1);mySound2 = new Sound(clip2);mySound1.attachSound("music1");mySound2.attachSound("music2");

start1Button_btn.onRelease = function() {mySound1.start(0, 1);

}start2Button_btn.onRelease = function() {

mySound2.start(0, 1);}leftButton_btn.onRelease = function() {

mySound1.setPan(-100);}rightButton_btn.onRelease = function() {

mySound2.setPan(100);}


Transforming sounds 04soundtransform.fla

More precise sound controlSwitch left / right speakers and stereo / mono dynamically

setTransform ()

allows to set percentage of how much of the lefr /right channel will play through left / right speakers

Properties of the sound transform object

ll % value -how much of the left input plays in the left speaker

lr % value -how much of the right input plays in the left speaker

rr % value -how much of the right input plays in the right speaker

rl % value -how much of the left input plays in the right speaker



mySound = new Sound();mySound.attachSound("conversation");startButton_btn.onRelease = function(){

mySound.start(0, 5);}

transformButton_btn.onRelease = function(){

mySoundTransform = new Object();mySoundTransform.ll = 0;mySoundTransform.lr = 100;mySoundTransform.rl = 100;mySoundTransform.rr = 0;mySound.setTransform(mySoundTransform);

}



When we click Transform button Flash creates a generic object with properties (mySoundTrsnform.ll, mySoundTrsnform.lr, …)

to hold the sound transformation information.

This information then used by the setTransfrom ()to change the distribution in the left and right speakers.


Dynamic sound control 05dynamicsound.fla

Sets desired volume level or speaker control

draggable movie clip acting as a sliding controller

The position of the movie clip is correlated with volume parameter of the setVolume ()

slider_mc movie clip

groove_mc movie clip

Groove_mc will limit the motion of the draggable slider_mc



slider_mc.onPress = function(){

this.startDrag(false, _root.groove_mc._x, _root.groove_mc._y - 100, _root.groove_mc._x, _root.groove_mc._y);

}

slider_mc.onRelease = function(){

stopDrag();}



slider_mc.onPress = function(){

this.startDrag(false, _root.groove_mc._x, _root.groove_mc._y - 100, _root.groove_mc._x, _root.groove_mc._y);

}

When user presses the slider_mc, startDrag () lets the user drag the specified movie clip and limits the position of the clip according to parameters



.startDrag([lock, [left, top, right, bottom]])

Lock A Boolean value specifying whether the draggable movie clip is locked to the center of the mouse position ( true ), or locked to the point where the user first clicked on the movie clip ( false )

left , top , right , bottom Values relative to the coordinates of the movie clip's parent that specify a constraint rectangle for the movie clip.



slider_mc.onRelease = function(){

stopDrag();}

stopDrag() stops dragging

setVolume(100)

setVolume(0)



setVolume(100)

setVolume(0)

Correlates the y position of the slider_mc with the setVolume()

globalToLocal() converts the coordinates of the slider to coordinates relative to the groove



slider_mc.onMouseMove = function(){

myPoint = new Object();myPoint.x = this._x;myPoint.y = this._y;_root.groove_mc.globalToLocal(myPoint);

}

The current x position of the slider is assigned to myPoint.x

onMouseMove provides a good way to trigger volume change based on the slider

position

The global coordinates of myPoint are changed to local coordinates of the groove movie clip



Link slider position to volume setting

myMusic_sound.setVolume(-myPoint.y);updateAfterEvent();

}

Groove movie clip is 100 pixels tallHence its local coordinates range from -100 to 0To change this range to positive value negative

sign(-) is usedThe result is a range from 100 at tope and 0 at

bottomThat can be used as the setVolume parameter



Create sound object and play button

myMusic_sound= new Sound();myMusic_sound.attachSound("music");startButton_btn.onRelease = function() {

myMusic_sound.start(0, 10);}

Test the movieWhen you drag the slider up and down it dynamically changes

the volume


External sounds 06externalsound.fla

Internal sounds (from the library) increase the .swf file size

loadSound () allows playing external sounds that can be kept outside flash movie

Allows change the sound file easilySmaller flash file size

mySound = new Sound();mySound.loadSound("kennedy.mp3", true);

loadSound("kennedy.mp3", true);

Kennedy.mp3 name of the external sound file

True streaming (true) or event (false) sound


External sounds 06externalsound.fla

Streaming sounds start play as soon as enough data downloads

one stream per sound object

long passages of music

narration

Event sounds must be downloaded completely before they can play

require start() command to plav

short sounds

sound effects


Sound properties 07soundproperty.fla

mySound = new Sound();mySound.loadSound("kennedy.mp3", true);

_root.onEnterFrame = function(){image_mc._alpha = (mySound.position / mySound.duration) *

100;image_mc._xscale = 50 + ((mySound.position /

mySound.duration) * 50);image_mc._yscale = 50 + ((mySound.position /

mySound.duration) * 50);}

Position measures the numbers of milliseconds a sound has been playing

Duration total number of milliseconds in the sound


Sound properties 07soundproperty.fla

Modifies the image according to the sound length

As the sound plays, the image slowly reveals itselfWhen the sound ends the image is completely revealed

_root.onEnterFrame = function(){image_mc._alpha = (mySound.position / mySound.duration) *

100;image_mc._xscale = 50 + ((mySound.position /

mySound.duration) * 50);image_mc._yscale = 50 + ((mySound.position /

mySound.duration) * 50);}

(Position / duration) * 100 gives the percentage of sound that has

downloaded

Increases the alpha of the movie clip as the sound plays so that the movie clip begins transparent and ends opaque


Detect sound event 07soundproperty.fla

onSoundComplete() detects the end of the sound

mySound.onSoundComplete = function(){

image_mc.attachMovie("end", "ending_mc", 1);}

When sound ends a movie clip “end” is attached to the image_mc movie clip. The registration point of the attached movie clip was modified in advance so that it appears in correct position.

Sound in Action Script

Documents

Transcript of Sound in Action Script