Toxiclab.org

Sound Key letters and numbers animations

30.3.2010, 15:31
Submited in: Flash | Total Views: 14380

In this action script lesson, you will see how to create advanced sound key letters and numbers animation. You can use this animation for some presentation or for some web banner. Using this lesson, you will also learn how to convert any letter into a movie clip symbol, how to create instance name and much more.

Example:

Select the image below and type number and letters on Your keyboard!

>


Step 1

Create a new flash document. Press Ctrl+J key on the keyboard (Document Properties) and set the width of your document to 400 pixels and the height to 250 pixels. Select any color as background color. Set your Flash movie's frame rate to 32 and click ok.



Step 2


Select the Text Tool (A) and go to the Properties Panel (Ctrl+F3) below the stage. Then, make the adjustments as follows:



Step 3

Select the dynamic text and hit F8 key (Convert to Symbol) to convert it into a Movie Clip Symbol.



Step 4

Go now to the Flash Library, select TheLetter Movie, choose right click and select Linkage.



After that, make the adjustments as follows:



Step 5

Double-click on the movie clip (letter) on stage with the Selection tool(V).You should now be inside the Movie Clip.



Step 6

While the dynamic letter is still selected, hit again F8 key (Convert to Symbol) to convert it again into a Movie Clip Symbol.



Step 7

While the new made Movie Clip is still selected, go to the Properties Panel below the stage. On the left side, You will find the Instance name input field there. Call this Movie Clip InsideLetter. See the picture below!



Step 8

Go back on the main stage (Scene 1) and delete key movie from flash stage.

Step 9

Call the current layer actions. Double-click on its default name (Layer 1) to change it. Press Enter once you have typed in the new name!

Step 10

Select the first frame of layer actions and go to the AS panel (F9). Then, enter this code inside the actions panel:

kl.onKeyUp = function() {
 var t = _root.attachMovie("LetterClip","LetterClip"+ _root.getNextHighestDepth(),_root.getNextHighestDepth());
 t.InsideLetter.theLetter.text = String.fromCharCode(Key.getAscii());
 t._x = Math.random()*500;
 t._y = Math.random()*400;
 var s:Sound = new Sound();
 s.attachSound("bot");
 s.start();
 t._xscale = t._yscale = Math.random()*500+80;
 t.onEnterFrame = function() {
  this._alpha -= 5;
  if(this._alpha < 1) this.removeMovieClip();
 }
}

Key.addListener(kl);

Step 11

Move InsideLetter movie from flash library on the flash stage. After that, choose right click on letter movie and select Edit.



Step 12

Go now to the Properties Panel (Ctrl+F3) below the stage, click on Embed button and choose the following options:



Step 13

It's time for sound. Find any sound file You want to use for this animation and import it into a flash library.

Step 14

Choose right click on sound file in flash library and select Linkage.



Step 15

Then, make the adjustments as follows:



Step 16

Select again right click on sound file in flash library and choose Export Settings. Then, make the adjustments as follows:



We're done now!

Test your animation and enjoy!

Download example

Are you a website owner?
Click here to register and submit your tutorials!

Browse by category


Most popular tutorials