The button list allows you to arrange the entire structure of your menu. You can also see at a glance which buttons have associated actions and effects.

Arranging your Menu Structure
To move a button within your menu simply drag and drop to the desired new position. You will notice that the button can be placed either on top of another button or inbetween two buttons. When you drag and drop the button on to another button it will be positioned as a child to that button.

Selecting Mutliple Buttons
In order to select multiple buttons hold down the shift or control button on the keybaord while click on the button name within the list.

The eye icon can be used to selectively hide and show buttons.  It is useful for reducing on-screen clutter when working with projects that show pop-up buttons, and similar transient effects. The Action icon and Effects icon will be colored if the button has an associated action or effect. Unlike the Button List on the Define Button step you cannot rename buttons using the Button List - you must instead use the Button General Properties dialog.

HINT: You can jump directly to a particular buttons actions or effects dialog by clicking on the Actions and Effects icons next to the button.

The 'Lock button layout' option, if set, will mean that if you move any existing button around in the button list it will be moved to the corresponding position in the editor window and project. If 'Lock buton layour..' is not selected any change in the button list will only affect the display order - i.e. which buttons appear in front of other buttons.

The Tools palette has the following tool:

Selection Tool:
The arrow allows you to select, move and resize any button in the editor window.

Draw a Rectangular Button:
Clicking on the Editor window with this tool will allow you to draw (using a marque) a new rendered button. Note: If you want this button to be the same as other buttons (if you are using a template) you will need to re-apply your template.

Add a new Bitmap Button:
When you click on the Editor window with this tool a file browser will open - simply select the image file you want as a button and it will automatically size your button to the bitmap and set the button to a flat transparent button so only the image is visible.

Draw an Oval Button:
Clicking on the Editor window with this tool will allow you to draw (using a marque) a new rendered oval button. Note: If you want this button to be the same as other buttons (if you are using a template) you will need to re-apply your template.

Fill:
This tool will fill a button or the background with the color currently shown in the Color Swatch. You cannot change the color of a button edge with the fill tool.

Gradient Fill:
Fill a button or the background with a gradient.

Text Tool:
Clicking on a button with this tool will open the Button States dialog, bring the Text tab to the front and highlight the text making it ready for editing. This is a great tool for making lots of quite changes to the text on your buttons. Note: Make sure you are editing the correct button state.

Eyedropper:
This tool will change the Color Swatch to the same color as the location clicked in the Editor window.

Button Effects:
This tool give you one-click access to a button's effects dialog.

Actions:
This tool give you one-click access to a button's actions dialog.

Color Swatch:
The color shown in the swatch is used by the fill and gradient fill tools.

Button Gallery:
Clicking this will bring up the button gallery.

The Editor window is where you can edit you menu using WYSIWYG controls - you can even design you menu from scratch.

Java and Flash Preview Buttons:
It allows you to test the project as it would run inside a browser.

Note:
Animation timing will differ slightly between the Java preview and final applet created (the final applet will tend to be faster) - it is recommended that you test all animation timing using the Test in Selected Browser button accessible through the Output Tab.

Selecting a Button to Edit
By clicking on a button with the Selection tool (arrow cursor) you will select it - the selected button is indicated with white handles. If the button has child button they will be also be indicated using orange handles.

Selecting Mutliple Buttons
In order to select multiple buttons drag the Selection tool across the Editor window. It will select all button that are at least partially inside the bounds of the marque. You are now able to edit multiple buttons at once using either the various dialogs boxes or tools.

Re-sizing and Moving Buttons
Use the white button handles to stretch and scale each button - the corner handles will scale keeping the aspect ratio while the centre handle will stretch the button. You can also re-size a button by selecting it and holding down shift while using the arrow keys on the keyboard. When moving buttons using the mouse or keyboard you will notice that the child buttons will move with the parent button. There is no way to turn this off so if you want to move the parent button away from the child buttons you will need to select the child buttons (using the group selection) and move them independantly of the parent.

In order to assist with making your button layout even you can use a Grid which can be turned on and off from the Options menu.

Arrow Keys
The arrow keys can be used to fine tune the position of a button. First click on a button to select it, then use the arrow keys to adjust its position.

Re-sizing the Project Area
You can resize the project area simply by resizing the Button Editor Window. Alternatively, you can resize the project by entering the pixel dimensions directly into the Project Properties dialog.

Right Mouse-click Menu:
If you click the right-mouse button when the cursor is over the Editor window you will have one-click access to:

• Button General Properties
• Button States Properties
• Button Actions
• Button Effects
• Project Properties