How to Create a Button Symbol in Adobe Flash CS4

A button symbol in Adobe Flash allows you to create a stylish button by giving you the four basic properties, up, over, down and hit and allowing you to edit what happens during those frames in your timeline. Here is how you create a button symbol in Adobe Flash CS4.

  1. To insert a new symbol select “insert” from the main menu at the top and then on the submenu select “New Symbol”.
  2. Step 2

    When the “Create New Symbol” window appears, give your symbol a name, select “button” as the “type” and then click the ok button as shown in the picture associated with this step.

  3. Step 3

    Flash is now ready with a timeline already created and frames called “up”, “over”, “down”, “hit”. We need to add a button to our “up” frame. You can either draw one or use one from Flash’s button library. To do this we are going to use one from Flash’s library. So go to “Window” then “Common Libraries” then “Buttons”.

  4. Step 4

    The buttons common library window will appear. Choose any button from the long list. You will see that Flash has done to great length’s to create a variety of buttons in all different shapes, sizes and colors.

  5. Step 5

    Right click frame 2 (the over frame). A pop up menu will appear. On the pop up menu select “Insert key frame”.

  6. Step 6

    We need to make it appear to the user that they have hovered over the button and to do that I just drew a rectangle with some fancy color and placed it behind the button.

  7. Step 7

    Insert a keyframe for the down frame in our timeline just like you did in step 5 for the “over frame”.

  8. Step 8

    You need to insert something that lets the user know they have clicked the button. In my example I just changed the color on the rectangle I added in the over frame to something different.

  9. Step 9

    Do the same thing for the hit frame that you did with the down frame except change the color.

  10. Step 10

    Your button symbol is now complete. Just click on edit->edit Document to go back to your animation. Your new button symbol will appear on your library panel. To use your new button, symbol drag it from the library and drop it onto your animation.