logo
g Text Version
Beauty & Self
Books & Music
Career
Computers
Education
Family
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
Money
News & Politics
Relationships
Religion & Spirituality
Sports
Travel & Culture
TV & Movies

dailyclick
Bored? Games!
Nutrition
Postcards
Take a Quiz
Rate My Photo

new
Heart Disease
Horror Literature
Dating
Hiking & Backpacking
SF/Fantasy Books
Healthy Foods
Crafts for Kids


dailyclick
All times in EST

Full Schedule
g
g Flash and Animation Site

BellaOnline's Flash and Animation Editor

g

Creating a Button in Flash CS4 eCard Project


Now that we have added the stop() action to our FlashR CS4 eCard, we are ready to create the replay button that will tell Flash to go back to the beginning and play the animation. Open your working file into Flash CS4.

1. Add a new layer to the Timeline and name this layer Button. Lock all other layers. Drag the Button layer under the Actions layer.

Before we can add a button to this layer, we need to create one.

2. From the Menubar, click Insert New Symbol. In the Create New Symbol dialog box, set the Type to Button and name the symbol "Replay". When you click on OK to close the dialog box, Flash will automatically take you to the edit mode for the button symbol. You will see the main stage change to a blank white space.

3. Click on the Text tool from the Tools panel and set the Stroke to null and the Fill to black. Next, go to the Properties panel to set the Character options for our text. I set the Font Family to Times New Roman, the Style to Bold Italic and the Size to 18 pt. Now we are ready to add the text for our button.

4. Find the small registration point in the center of the white workspace area. It looks like a small plus sign. Place your cursor over this, click with your mouse button and then type the text "Replay". You may wish to use a different text for your button.

Let's take a look at the Timeline for our button. As you can see, we have four frames, which represent the four stages of a rollover button. Each of the Up, Over and Down frames can have a different look and the button will change its appearance as you pass over or click on the button. For our purposes, we will change the color of the text for each rollover stage. We want to keep the text black for the Up stage but we still need to change the color for the other two stages. Let's set the text to red for the Over stage and to green for the Down stage.

5. Right-click on the Over Frame and add a Keyframe. Next, highlight the text with the Text tool and change the Fill color to red. Now, click on the Down Frame and add another Keyframe. Change the fill color to green.

We do not need to set a color for the Hit Frame because this frame is never visible on the stage. The purpose of this frame is to designate the clickable area for our button. We will use the Rectangle tool to do this.

6. Right-click on the Hit Frame and add a Keyframe. Now, click on the Rectangle tool and draw a rectangle over the text for your button.

We are finished with our button so we can click on Scene 1 to go back to the main Timeline. But when we get back to the main Timeline, we do not see our button anywhere on the stage. This is because Flash has placed it in the Library. In the next tutorial, we will drag an instance of our button onto the stage and program the button with ActionScript.



Join us in the Flash forum.




Add Creating+a+Button+in+Flash+CS4+%96+eCard+Project to Twitter Add Creating+a+Button+in+Flash+CS4+%96+eCard+Project to Facebook Add Creating+a+Button+in+Flash+CS4+%96+eCard+Project to MySpace Add Creating+a+Button+in+Flash+CS4+%96+eCard+Project to Del.icio.us Digg Creating+a+Button+in+Flash+CS4+%96+eCard+Project Add Creating+a+Button+in+Flash+CS4+%96+eCard+Project to Yahoo My Web Add Creating+a+Button+in+Flash+CS4+%96+eCard+Project to Google Bookmarks Add Creating+a+Button+in+Flash+CS4+%96+eCard+Project to Stumbleupon Add Creating+a+Button+in+Flash+CS4+%96+eCard+Project to Reddit



 



RSS | Related Articles | Editor's Picks Articles | Top Ten Articles | Previous Features | Site Map


For FREE email updates, subscribe to the Flash and Animation Newsletter


Past Issues


print
Printer Friendly
bookmark
Bookmark
tell friend
Tell a Friend
forum
Forum
email
Email Editor


Content copyright © 2013 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.

g


g features
Ken Burns Effect In Motion - Record Keyframes

Ken Burns Effect In Motion 5 - Set Up

Animated Title in Motion

Archives | Site Map

forum
Forum
email
Contact

Past Issues
memberscenter


vote
Poetry
Daily
Weekly
Monthly
Less than Monthly



BellaOnline on Facebook
g


| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2013 Minerva WebWorks LLC. All rights reserved.


BellaOnline Editor