flash8.0 Button Element Application example

A button symbol is one of the basic components of flash, it has a variety of states, and responds to mouse events, performing specified actions, is the key object to achieve animation interaction effect.

From the appearance, the button can be any form. For example, it could be a bitmap, a vector, a rectangle or a polygon, a line or a wireframe, or even an invisible "transparent button.".

Example of the application of a movie clip in a BUTTON element-discharge button

This section is to make a discharge button, when the mouse is placed on the button, a dazzling light, showing the incomparable. The effect is shown in Figure 4-40.

Figure 4-40 Discharge button

1. Create a "discharge" movie clip symbol

(1) Create a new Flash8 movie document, set the stage size to 200x50 pixels, set the background color to blue, and keep the default settings.

(2) Create a new movie clip symbol for "discharge". In the editing scene for this component, select the Line tool, the stroke color is "white", and draw an approximate 20-pixel polyline in the scene. As shown in Figure 4-41.

Figure 4-41 Drawing a polyline

(3) Insert the key frame at frame 3rd and use "Freeform tool" to Zolayo the polyline in the scene to 60 pixels.

(4) Click Frame 1th to open the Properties panel and create a tween shape. Inserts a frame at frame 5th.

(5) New "Layer 2". Inserts a blank keyframe at frame 3rd. Select Oval Tool, no stroke color. Open the Color mixer panel, set the fill style to "radial", the left color is white, the alpha value is 100%, the right color is white, and the alpha value is 0%, as shown in Figure 4-42.

Figure 4-42 the Color mixer panel

Draw a circle in the scene. Open the Properties panel and set its size to (120x126). Drag it to the left end of the polyline. As shown in Figure 4-43.

Fig. 4-43 Discharge diagram

2. Create a "discharge button" component

(1) Create a new button symbol for the "discharge button". In this component editing scene, rename "Layer 1" to "button." Double-click the Rectangle tool to set the corner radius to 20 points in the Pop-up Rectangle Settings dialog box, as shown in Figure 4-44.