Making Buttons

Creating Flash Buttons, On line Tutorials, On line Training, Flash Tutor, Bill Dallas Lewis, Silly Billy's World

Ok, the buttons above are very ugly. Yeap.  But, I want to show you how to make the buttons, then you can make the most beautiful buttons on the World.  let's look at Button #1 First.

To make Button #1, here's what we did.
1.  Insert new Symbol.  Call it b_basic.
2. We put a circle of color in the Up state.
3. Insert a keyframe in the Over state, change the color of the button.
4. Insert Keyframe in the Down state, change the color of the button.
5. Insert Keyframe in the hit state, your done.
6. Go into scene 1, drag the button to the stage from the Library, Test Movie.

Button States?  What does What?

What is What? What are these states?

Up State = This is when the mouse is away from the button.

Over State = This is when the mouse is over the button

Down State = This is when the person "clicks" on the Button.

Hit State = This is the hot spot of the button, the real estate, the thing that activates the button.  The hit state is invisible.  The hit state defines the "spot" that activates the button.

Making Button #1 more useful

The first button could be a series of any objects that change in the various states. You could put an image in the Up State, and on RollOver (the Over State), you put in a different image, and in the Down State (the click state), you put in another image.  The Hit State should always be the same size as the Up State.  Remember, the Hit State is invisable, but very important.

Making Button #2

If you watch the movie above, you can see that all we do is change the shape of the button in the Up, Over and Down State.  The Hit State is big enough to cover the Up State.

Making Button #3

In making Button #3, notice we have two layers.  Buttons can have as many layers as you like.  You can change the appearance of any layer by inserting a keyframe, and then changing the content of that frame in that layer.

Animating Your Buttons in Button #4

To Animate a Button, you create your animation in a Movie Clip, then put that Movie Clip in any state that you want.  In Button #4, we want the text to spin on RollOver of the Button, so we put a Movie Clip with a Rotation Tween in the Over State.  The thing is, we have to put a Stop Action in the last frame of the Movie Clip, or, the Movie Clip will play and play and play.  If you want your animation to play continuously, leave the Stop Action out.

Add a Sound to a Button

To add a sound to a button, make a layer and call it sound.  Record your sound and import it into the library.  Insert a keyframe in the Over, and/or Down states, then drag the sound out of the library to the stage.  You'll see you're sound waves show up in the sound layer.  Pretty easy.

Invisable Buttons, Button #5

The easiest button to make is an invisable button. To make an invisable button, just go right to the hit state, insert a keyframe, then stick some shape over the crosshair, you're done.  I made one and put it over the dog, making Button #5.