Before you start this section, make sure that you understand the difference between the symbol editor and the main stage and you know how to tell which mode you are in at any time. If you are not sure, review the page on Symbols.

Creating Button Symbols

As well as attaching actions to frames of your movie, you can create buttons and attach actions to your buttons.  You create buttons in the symbol editor.

From the menus, choose Insert > New Symbol.  Name the button and choose Button as the behaviour.

When you create a button it has four states:

• Up: How the button looks when you first see it on the stage.
• Over:  How the button looks when the mouse moves over it.
• Down:  How the button looks when the user clicks on it.
• Hit:  The area around the button that is active (behaves just like the button was clicked).  You can't see the hit area in the finished movie.

The symbol editor has four different frames for creating your button.

Draw your button around the crosshair in the centre of the stage.

Experiment with the color mixer panel and gradient fills to get a nice effect.

Over Frame

Now insert a keyframe in the over frame of the timeline.  Change the colour of your button. Eg make the colours brighter or different.

Down Frame

Insert another keyframe for the down state.  Adjust the colour again if you want.

Hit Frame

Select the Hit frame and insert a blank keyframe.  Draw an object (eg rectangle) around the area that your button covers.  It doesn't matter what colour your hit area is, because you can't see it in the finished movie.

Make sure that the hit area is large enough to cover all of the button. You can turn on onion skinning so that you can see where the other states of your button are if you want the hit area to be accurate.

Click on the scene name to return to the main stage.  Your button symbol will be in the library.  If you can't see the library panel, press F11, or choose Window > Library

Drag an instance of your button onto the stage. From the menus choose Control > Enable Simple Buttons. This allows you to see how the button works without having to actually test your movie.

Adding Actions to your Buttons

Select your button.  From the menus choose Window > Actions (or press F9)

Select Global Functions > Movie Clip Control

Turn on Script Assist

Choose On by double clicking on it. Choose the event that will activate the action.  (eg Press)

Then add the action that you want to occur eg goto a frame, stop, play etc.

This page has been produced by Margaret Meijers.  Questions or feedback may be directed by email to mmeijers at ictmindtools.net

 
This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 2.5 License.
Attribution should include the statement: "This has been adapted from a resource originally created by Margaret Meijers at http://ictmindtools.net"