page 1 of 1
 

Tutorial #4

Creating a Simple Button
Download the source file

Here are the 8 steps to creating a simple 3 state button:

  1. Draw or import an object on the stage .
    For this example we'll draw a red rectangle. Text can be used as a button or added to a button graphic.


  2. Converting the object to a BUTTON LIBRARY SYMBOL.
    With the object selected, click INSERT / CONVERT TO SYMBOL.


  3. Name the button.
    Give the button a name and SELECT BUTTON from the dialog box that appears. This adds the button to the library.


  4. Putting the button in EDIT MODE.
    Open the library by selecting WINDOW / LIBRARY from the MENUBAR. Select button name from the LIBRARY. Double-click the button image in the library PREVIEW WINDOW. The button is now in edit mode.


  5. Adding the OVER, DOWN and HIT STATES of the button.
    Your screen should look similar to this one. Right click in each of the 3 frames to the right of the UP state frame. Select INSERT KEYFRAME in each frame.


  6. Modifying the images in the different states .
    Editing takes place in the stage area. Select each frame object and make the changes to each state of that object.


  7. Exiting EDIT MODE.
    Select SCENE 1 at the top of the STAGE. This returns you to the main stage area.


  8. Viewing the button states.
    Select CONTROL / ENABLE SIMPLE BUTTONS. Now you can mouseover the button to see if it works.

You must place a solid image in the HIT STATE of the button when using text as a button. Otherwise the button will blink as the cursor passes over the text characters.

These are all the steps needed to create a motion guide animation.

Tell a Friend