Fig. 4.9e Events Palette showing Page and Layer for a typical set of menu graphics
The button images have been correctly placed in the Raster Editor, allowing the actual buttons to be created.
Fig. 4.9f Button images seen in the Raster Editor display
Be sure to click on “Layer 1” in the Events Palette in order to create the buttons inside that Layer.
Next, click on the “New Button” icon in the Raster Editor toolbar.
Fig. 4.9g Click the New Button Icon to draw a new button
Now draw a box around the first button by holding down the left mouse button and dragging the cursor around the button. Let go when it is fully drawn to create the button. If the box does not match the button perfectly, do not worry; the buttons are very simple to resize. If the button has been created correctly, it should look similar to the picture below.
To assist with the drawing of buttons, Guides may be used. First enable rulers than click and drag away from the ruler to start creating a guide. Once the guide is positioned, drawing of buttons will snap to the guide. This snapping may be enabled or disabled from the ‘blue arrow’ menu to the upper right of the raster.
Fig. 4.9h The First Button has been drawn in the Raster Editor
The top-left button has been created. Continue to create the other buttons in the same manner, but ensure that they are created within Layer 1.
Fig. 4.9j All four buttons shown in the Raster Editor (L), Events Palette (R)
All four buttons have now been created in this example, and are almost capable of being displayed when the Main Menu is played back.
Button animation can be added by associating additional images with that button state. The graphic animation can be named according to the naming convention listed above and this will ensure that the system automatically assigns the order of the images. If the number is missing in the graphic files then the animation frames will be ordered in the order the files were associated.
To set the rate at which the button animation will be executed the “Animation Frame Rate Code” field needs to be set at the PAGE level. The default value is “No Animation”. The field accepts an integer value that is interpreted according to the following formula.
Animation Frame shown per second = Video Frame Rate / Animation Frame Rate Code
Therefore, smaller values lead to a faster animation while large ones slow the animation down. For this example, a value of “1” will be used. This will cause a new image to be displayed on the button in every video frame. Other example frame rates include “2”, which would make a new frame of animation appear in every other video frame, and “24”, which would update the animation about once a second. These values can be adjusted until optimal values for the project are reached.