Posted on August 25, 2011 by admin
So how can you create a button in Flash? Truth be told, you can literally create one button under 10 seconds! This tutorial provides step-by-step instructions and tips on how to create one. Grab some popcorn and sit tight.
1- Draw an object
Firstly, draw a square using the Rectangle tool. In case you don’t know how to draw one, read this tutorial which covers basics of drawing in Flash.
2- Convert object to button
Make sure your fully select the square, as it is made up of 2 parts, fill and strokes. Then, press F8.
This dialog box will popup.
Click on the ‘Button’ radio button, then click ‘OK’. And now you have a button!
Your square has been converted into a button symbol, which is indicated by the blue box around it when it is selected.
3- Draw button graphics (Up/Over/Down)
Let’s double click on the button you’ve just created. And you’ve just accessed it’s timeline.
A button has 4 frames, ‘Up’, ‘Over’,'Down’,'Hit’. And let’s keep it that way. Trust me, we only need the 4 frames in a button.
Now I’ll explain about these frames. When is the button is not touched by your mouse, it display’s the graphic in the ‘Up’ frame. And when the mouse is rolled over your button, it displays the ‘Over’ frame. When you click on the button, it displays the ‘Down’ frame, until you release your mouse, or move your mouse away from the button.
So.. what about the ‘Hit’ frame? Graphic elements in the ‘Hit’ frame is never seen in your Flash movie. The ‘Hit’ frame’s only function is to define the area of the button that can be clicked.
Back to instructions. Press F7 to add keyframes to the button’s timeline. Then, draw the button graphics into each frames.
And you’ll get a functional button. Click on the example below.
Here is the source file of the button above, feel free to download and examine it.
Thats is! The next tutorials will show you how to implement actionscripts in buttons.