Flash Animation master Basic button knowledge

Button

　　Question 1: How to make a button? Why do I make a text button that is not easy to click on?

　　Solving Ideas

In the button editing area, there are only four frames on the timeline, and the "click" of frame 4th is the response area of the button, which is not visible in the stage, but he plays the role of a button reaction. We enlarge the response area of the button and can easily click on the button with the mouse.

　　Specific Steps

1, Run Flash MX 2004, document properties default.

2, a new component, named "button", the type is set to button components.

3, enter the button editing area, the timeline has a total of four frames. The role of these four frames has been introduced in the first chapter. As shown in the figure.

Timeline of button symbols

4. In frame 1th, click the Rectangle tool in the toolbar to draw a blue rectangle.

5, return to Scene 1, from the "library" to drag this button to the stage.

6, Release test results, we see when the mouse put the button above, the mouse into a small hand shape, indicating that the production of this button success.

7, in the actual creation, because a lot of components in the stage, in order to differentiate the type of components, need to write on the button above the description, then we will actually make.

8, double-click the "Library" button components, into the button editing area.

9. In the layers panel, create a new layer 2, click the Text tool to Type "button" and adjust the position. As shown in the figure.

Add a type layer

10, back to the scene 1 test, the button already has a logo name, the function of the button has not been affected. As shown in the figure.

Button effect

11, this kind of button's production method is the simplest, it does not involve the reaction area question. Because the blue rectangle is already visible on the stage, just click on the blue area to perform the function of the button. In some flash works because of the overall visual effects of the requirements, often appear only text, no background buttons. This involves the problem of the response area mentioned in the question.

12, into the button component editing area, in the 1th frame type "Play", make a playback button. As shown in the figure.

Type text

13, back to the scene 1 release Test button effect, found that the mouse is not very easy to click on the button. The reason is that the button's response is limited to the line of text.

14, to solve this problem, you can use two methods. The first method, entering the button component editing area, uses the rectangular tool in frame 4th to draw a rectangle and place it under "play" to enlarge its reaction area. Because the contents of the 4th frame "Click" are invisible when publishing the work, we can use any color. As shown in the figure.

Insert a rectangle in the "click" Frame

14, the release test results, because the button reaction area expansion, it is easy to click on the button. Please refer to the source file and Click here to download the source file .

15, another way is to create a new layer and draw a transparent rectangle in frame 1th of the button symbol edit area, because the rectangle is transparent and invisible on the stage, but it also acts as a shape, which expands the response area of the button in frame 1th. As shown in the figure.

Insert Transparent Rectangle

16, this method can also make a very useful text button. Please refer to the source file Click here to download the source file

Note-The test of the button, we use the "Control" menu in the "Play" command or use the shortcut key "Enter" is not tested. We want to publish the test by clicking the Publish command under the File menu or by using the combination shortcut "Ctrl+enter".

Hint--friends generally on the button four frames inside the last frame of the function is not very understanding, this frame is the button response area, in the scene is not visible, making stealth button to use this frame.

Tips-buttons are an integral part of a work, and when making a button, you should take into account the overall style of the work.

Try--we have introduced the method of making the text button, you might as well try it, because this kind of button should be used in every work.

Analysis-There are two root causes of this problem: first, the Friends of the button is not attached to the production, that the button is only a subject, for the overall performance of the work does not have much effect, so also ignore the button details of the production; second, the Friends of the 4th frame "click" Knowledge of the ignorance.

　　Special Tips

Button as a Flash animation works to achieve interactive media, played a very important role. Because the source file attached to this article does not involve the control of the button, you can only use the mouse to put the button on the display of small hand shape to test the buttons.

　　Special Notes

By explaining the problem, we learned how to make a basic button and how to make a text button. I am enjoying the "Heng Ya Cup" environmental flash competition, I found that many friends made the text button did not take the means to expand the area of reflection. Even the test of the user's flexibility to use the mouse, the appreciation of the works to bring the first impression of boredom.

Related issues

Does a flash work need to use the necessary buttons?

Because of the wide range of buttons, the use of buttons in flash works can be a very interesting effect. For the control of a complete Flash animation works, generally requires two buttons: Play and return (replay). For playback and playback of the movie.

Can I use a graphic as a button?

Because the frames in the button are not much different from the frames in the other components, we can use the graphic as a button and other forms to make the button. In the following questions we will give you a detailed introduction.

How do I control a movie with a button?

Just now we talked about a complete piece of work that requires two buttons, a play button and a return button. So how do these two buttons achieve control of the movie? This involves Flash ActionScript. Buttons are very closely related to the Flash scripting language (ActionScript). Let's make a movie control button below. We created a flash MX 2004 document to create a simple animation effect on the timeline of the stage. As shown in the figure.

Make a gradient animation

To prevent the animation from playing automatically at the beginning, the play button does not work. Click Frame 1th on the timeline, open the Actions panel under the stage, double-click the Stop command under movie control, and the animation stops at the first frame. Add "Stop" in the last frame as well. As shown in the figure.

Add "Stopa ();"

Then create a new button component, according to the method we just made two buttons, respectively, "play" and "Relplay." Create a new layer in the timeline, drag the play button from control to the appropriate position in frame 1th, and drag "replay" to the appropriate position in frame 30th. Click two buttons, open the Action panel, and add control commands to the "play" and "Replay" buttons:

"Play" button above the command:

On (release) {
Play ();
}

As shown in the figure.

ActionScript for "Play" button

The command above the "Replay" button:

On (release) {
gotoAndPlay (1);
}

As shown in the figure.

ActionScript for the "Replay" button

This is achieved to control the role of the film, please refer to the source file Click here to download the source file .

This is our first contact with the Flash MX 2004 ActionScript, which is described in detail in part three of this book. The reason for ActionScript in this section is that the buttons are very closely related to ActionScript, and the second is to give you a preliminary impression.