1 [FL]Flash Tutorial CS4 using the Sonoport Sound Library Wed Sep 22, 2010 10:59 am
Admin
Admin
Adding Dynamic Sound in Flash CS4 using the Sonoport Sound Library
In this tutorial, we show how to add a Sonoport dynamic sound to an interactive 'Spaceship' swf.
[You must be registered and logged in to see this image.]
Getting Started
Download all the tutorial files here and unzip it. In the 'Sonoport_tutorial1' folder, you will find the 'SonoportCollection1.mxp' file and a 'ChaseDemo' folder which contains the FLA and ActionScript file for this tutorial. Next, we will launch Adobe Flash CS4 to get started on the tutorial.
[You must be registered and logged in to see this image.]
First Run
Open the ‘ChaseDemo.fla’ file. Here, there is a space-like background on the canvas. On examining the Library, you will find a Spaceship MovieClip, which is what we will be linking the Sonoport Sound Library to. Press Ctrl/Cmd + Return to test out the demo, which should look like this. Let us now examine the basic code layout. [You must be registered and logged in to see this image.]
Examine The Code
Open ‘ChaseDemo.as’ located in the ChaseDemo folder. In this file there are two functions we will be examining, onEnter() and onMove(), which control all the movement of our alien spaceship. The onMove() function calculates the mouse position whenever there is mouse movement detected, while onEnter() updates the spaceship's position, with some basic interpolation. The variables 'wSWF' and 'hSWF' are constants to specify the width and height of our Flash file.
[You must be registered and logged in to see this image.]
Let’s Start Adding Sound!
To install Sonoport Sounds, launch Adobe Extension Manager CS4 and click Install. Select SonoportCollection1.mxp and click OK. Click on Accept when prompted, this will install the Sonoport Sound Library into your system. For it to take effect, you will have to restart Adobe Flash CS4. Quit the Extension Manager and restart Flash CS4. [You must be registered and logged in to see this image.]
First Steps
Once you have restarted Flash, go to Commands located on the Flash menubar and click on ‘AddSonoportToLibraryPath’. This is a one-time process and it adds the library path of our sound models within your Flash CS4 environment. This process places the SonoportCollection1.swc in the Flash Components folder on your hard disk. [You must be registered and logged in to see this image.]
Your First Dynamic Sound
Open the ‘ChaseDemo.as’ file and import the Sonoport library. Create a new SpaceShipAmbience sound model called ‘snd’ and call play(). Run the demo by pressing Ctrl/Cmd + Return. You should now hear a “spaceship” sound, similar to this. What you will not hear is the sound changing however.
In addition to the spaceship sound, you might also hear a drip sound regularly. That’s our watermark To disable it, you will have to purchase our license from our store which will then give you a key. The next few steps will make the sound dynamic.
[You must be registered and logged in to see this image.]
Panning a Sound model
Each sound model has a unique set of dynamic parameters, changeable using setParam(). Let us first change panning, which ranges from -1 to 1. Panning will be based on the x-position of our spaceship. Press Ctrl/Cmd + Return and you will get this.
[You must be registered and logged in to see this image.]
Changing the Sound’s Frequency
Now that you are more familiar with dynamically changing a sound model, let us do something more exciting! To change the SpaceShipAmbience’s frequency, setParam() to change the frequency based on the spaceship’s speed. Press Ctrl/Cmd + Return to hear the sound dynamically changing. Let’s explore Sonoport Sounds further!
[You must be registered and logged in to see this image.]
Flying In Space
Our demo still needs a few finishing touches, to create a “wow” effect. First, we will change the ship's size based on it's y-position, by applying some scaling. This will give our spaceship the effect of moving further away from the screen or coming closer. The effect should be visible on testing it.
[You must be registered and logged in to see this image.]
Spice Up the Sound
There is much more which we can do with our sound model! Let us now change the parameters called 'Gain' and 'Harmonics', based on the ship's y-position and scaling. Call 'setParam()' once again for each of the parameters. Press Ctrl/Cmd +Return to hear the overall effect of Sonoport Sounds with the spaceship. Congratulations!
[You must be registered and logged in to see this image.]
Moving Further
You have successfully completed the tutorial! What’s next? Well, it’s time to get creative and have fun! The Sonoport API, located at http://docs.sonoport.com provides in- depth documentation on all the sound models in the library. Through this, you will redefine how audio is used within your Flash projects!]
In this tutorial, we show how to add a Sonoport dynamic sound to an interactive 'Spaceship' swf.
[You must be registered and logged in to see this image.]
Getting Started
Download all the tutorial files here and unzip it. In the 'Sonoport_tutorial1' folder, you will find the 'SonoportCollection1.mxp' file and a 'ChaseDemo' folder which contains the FLA and ActionScript file for this tutorial. Next, we will launch Adobe Flash CS4 to get started on the tutorial.
[You must be registered and logged in to see this image.]
First Run
Open the ‘ChaseDemo.fla’ file. Here, there is a space-like background on the canvas. On examining the Library, you will find a Spaceship MovieClip, which is what we will be linking the Sonoport Sound Library to. Press Ctrl/Cmd + Return to test out the demo, which should look like this. Let us now examine the basic code layout. [You must be registered and logged in to see this image.]
Examine The Code
Open ‘ChaseDemo.as’ located in the ChaseDemo folder. In this file there are two functions we will be examining, onEnter() and onMove(), which control all the movement of our alien spaceship. The onMove() function calculates the mouse position whenever there is mouse movement detected, while onEnter() updates the spaceship's position, with some basic interpolation. The variables 'wSWF' and 'hSWF' are constants to specify the width and height of our Flash file.
- //calculation for interpolating the ship's position
- ship.x = (0.90*ship.x + 0.1*targetX)-1;
- ship.y = (0.90*ship.y + 0.1*targetY)-1;
- }
<LI class=noIndent>private function onEnter(event:Event):void
<LI class=noIndent>{
- //sets the targetX whenever the mouse moves
- //this is the target which the object has to reach
- targetX = event.stageX;
- targetY = event.stageY;
- if ( targetX < 30 )<LI class=indent2>targetX = 30;
- if ( targetX > wSWF )<LI class=indent2>targetX = wSWF;
- if ( targetY < 30 )<LI class=indent2>targetY = 30;
- if ( targetY > hSWF-50 )<LI class=indent2>targetY = hSWF-50;
- }
<LI class=noIndent>private function onMove(event:MouseEvent):void
<LI class=noIndent>{
[You must be registered and logged in to see this image.]
Let’s Start Adding Sound!
To install Sonoport Sounds, launch Adobe Extension Manager CS4 and click Install. Select SonoportCollection1.mxp and click OK. Click on Accept when prompted, this will install the Sonoport Sound Library into your system. For it to take effect, you will have to restart Adobe Flash CS4. Quit the Extension Manager and restart Flash CS4. [You must be registered and logged in to see this image.]
First Steps
Once you have restarted Flash, go to Commands located on the Flash menubar and click on ‘AddSonoportToLibraryPath’. This is a one-time process and it adds the library path of our sound models within your Flash CS4 environment. This process places the SonoportCollection1.swc in the Flash Components folder on your hard disk. [You must be registered and logged in to see this image.]
Your First Dynamic Sound
Open the ‘ChaseDemo.as’ file and import the Sonoport library. Create a new SpaceShipAmbience sound model called ‘snd’ and call play(). Run the demo by pressing Ctrl/Cmd + Return. You should now hear a “spaceship” sound, similar to this. What you will not hear is the sound changing however.
In addition to the spaceship sound, you might also hear a drip sound regularly. That’s our watermark To disable it, you will have to purchase our license from our store which will then give you a key. The next few steps will make the sound dynamic.
- //initialising the SpaceShipAmbience soundmodel
- var snd:BaseSound = new SpaceShipAmbience();
- //remove the watermark
- snd.setKey("Enter your key here");
- //Calling the play function to play the sound
- snd.play();
[You must be registered and logged in to see this image.]
Panning a Sound model
Each sound model has a unique set of dynamic parameters, changeable using setParam(). Let us first change panning, which ranges from -1 to 1. Panning will be based on the x-position of our spaceship. Press Ctrl/Cmd + Return and you will get this.
- // Dynamic panning
- var pan:Number = (ship.x-wSWF/2) / (wSWF/2);
- snd.setParam( BaseSound.PAN, pan );
[You must be registered and logged in to see this image.]
Changing the Sound’s Frequency
Now that you are more familiar with dynamically changing a sound model, let us do something more exciting! To change the SpaceShipAmbience’s frequency, setParam() to change the frequency based on the spaceship’s speed. Press Ctrl/Cmd + Return to hear the sound dynamically changing. Let’s explore Sonoport Sounds further!
- var dx:Number = Math.abs(targetX - ship.x);
- var dy:Number = Math.abs(targetY - ship.y);
- //calculating the distance that the ship has travelled
- var distance:Number = Math.sqrt(dx*dx + dy*dy);
- if(distance >=450 )
- {<LI class=indent2>distance = 450;
- }
- //change frequency based on the distance moved
- snd.setParam(SpaceShipAmbience.FREQUENCY, 50+distance);
[You must be registered and logged in to see this image.]
Flying In Space
Our demo still needs a few finishing touches, to create a “wow” effect. First, we will change the ship's size based on it's y-position, by applying some scaling. This will give our spaceship the effect of moving further away from the screen or coming closer. The effect should be visible on testing it.
- //scaling the ship based on its y-position
- ship.scaleX = ship.scaleY = ship.y * 0.5 * 0.01;
[You must be registered and logged in to see this image.]
Spice Up the Sound
There is much more which we can do with our sound model! Let us now change the parameters called 'Gain' and 'Harmonics', based on the ship's y-position and scaling. Call 'setParam()' once again for each of the parameters. Press Ctrl/Cmd +Return to hear the overall effect of Sonoport Sounds with the spaceship. Congratulations!
- //changing the sound model's harmonics value
- var harVal:Number = ship.y / 7 ;
- //do check for harmonics max level
- if(harVal >= 50)
- {<LI class=indent2>harVal = 50;
- snd.setParam( SpaceShipAmbience.HARMONICS, harVal);
[You must be registered and logged in to see this image.]
Moving Further
You have successfully completed the tutorial! What’s next? Well, it’s time to get creative and have fun! The Sonoport API, located at http://docs.sonoport.com provides in- depth documentation on all the sound models in the library. Through this, you will redefine how audio is used within your Flash projects!]