Buttons are a very common element of any application. Be it an e-game, an online submission form, or even a page navigator, usually the buttons control the flow of the application. This post mainly deals with creation of button, and a hands-on example of it.
Why do we need buttons in our application?
Buttons are mainly "event dispatchers". A dispatched event always has some purpose and so does the click of a button. Some action is always associated with a button click. Let us take a very common example. All of us use google search engine very often. After typing our search words, we either press "Enter" key or press the "Search" button. What does this button do? The button notifies the engine that the search entries are done, so perform the next action, that is, output those results which match with our search keywords. So, button dispatches a click event here. Click event is one of the mouse events (that we have already discussed in one of our previous posts).
Steps to create a simple button:
1. Open flash IDE (CS3/CS4 or whatever is the latest version that we are using)
2. Select a text tool and write some text on the stage.
3. Right click on the text, select "Convert to Symbol"
4. Select Button from the drop-down and give some name to the symbol.
5. Give some instance name to this symbol.
6. Double click on this newly created button. You would observer that there are 4 frames in it namely "Up", "Over", "Down" and "Hit". These are default fields for any button. As the name suggests, all of them are button states. Notice that only the "Up" frame has some content in it.
7. Click on "Over" frame, press F6 key. A keyframe gets created with the content same as the "Up" frame. Change the text to distinguish between the two frames.
8. Similarly, create a keyframe in the "Down" state and keep a different text with a different color there.
9. The last frame "Hit" defines the hit area of the button which is sensitive to the mouse click, or the area of the button which we want to respond to any click.
10. Publish the file and you see a simple button, in hovered, hit, and released states. Your file, when published, would replicate the following:
Why do we need buttons in our application?
Buttons are mainly "event dispatchers". A dispatched event always has some purpose and so does the click of a button. Some action is always associated with a button click. Let us take a very common example. All of us use google search engine very often. After typing our search words, we either press "Enter" key or press the "Search" button. What does this button do? The button notifies the engine that the search entries are done, so perform the next action, that is, output those results which match with our search keywords. So, button dispatches a click event here. Click event is one of the mouse events (that we have already discussed in one of our previous posts).
Steps to create a simple button:
1. Open flash IDE (CS3/CS4 or whatever is the latest version that we are using)
2. Select a text tool and write some text on the stage.
3. Right click on the text, select "Convert to Symbol"
4. Select Button from the drop-down and give some name to the symbol.
5. Give some instance name to this symbol.
6. Double click on this newly created button. You would observer that there are 4 frames in it namely "Up", "Over", "Down" and "Hit". These are default fields for any button. As the name suggests, all of them are button states. Notice that only the "Up" frame has some content in it.
7. Click on "Over" frame, press F6 key. A keyframe gets created with the content same as the "Up" frame. Change the text to distinguish between the two frames.
8. Similarly, create a keyframe in the "Down" state and keep a different text with a different color there.
9. The last frame "Hit" defines the hit area of the button which is sensitive to the mouse click, or the area of the button which we want to respond to any click.
10. Publish the file and you see a simple button, in hovered, hit, and released states. Your file, when published, would replicate the following:
Once your button is created, you can associate multiple mouse events to it (as buttons actions are mostly mouse sensitive). The mouse events are already discussed in one of the earlier posts : Capturing Events in Flash : Part II - Creating Event Handlers
No comments:
Post a Comment