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
Emerging Music
Home Improvement
Comedy Movies
Vision Issues
Jewelry Collecting
Feng Shui
Appalachia


dailyclick
All times in EST

Autism Spectrum Disorders: 4:00 PM

Full Schedule
g
g Flash Site
Diane Cipollo
BellaOnline's Flash Editor

g

Nesting Movie Clips for Complex Animations


Flash and Motion Tweens are a great combination for easily creating animation. All you need is a beginning position and an ending position and Flash will do the rest of the work. But how do you create more complex animations such as adding a walk cycle to a moving character? One way would be to use nested movie clips. The walking animation would be a movie clip that is nested in your character's main movie clip.

Let's take a look at a simplified example of a blinking head which bounces across the stage. First we will create the blinking animation movie clip and then nest that inside the bouncing head movie clip.

  1. Start a new FlashR and ActionScript 3 project. Rename Layer 1 to "Head".

  2. Use the Oval tool to draw the shape of the head. Set the Fill color to any flesh color and the Stroke to null. Draw an oval in the upper left corner of the stage. Lock the Head layer.

  3. Create a new layer in the Timeline and name it "Eyes". To make an eye, first draw an oval with the Fill color set to white. On top of this white circle, draw a smaller, black oval for the pupil. Select all (Edit – Select All) and click Modify – Group to group these two shapes together.

    To make a second eye, simply copy the group and paste it next to the first eye. Now, select both of the eyes and click Modify – Group to group both eyes together.

    Now we are ready to work on the movie clip animation for the nested eyes. But first we need to convert the eyes to a movie clip.

  4. Click on the grouped eyes and click Modify – Convert to Symbol. Name the movie clip "eyesBlink".

    Note that we now have our eyesBlink movie clip in the Flash Library and the eyes on the stage are now an instance of the Library's movie clip. We are ready to animate. From the Library, double-click on the icon for the eyesBlink movie clip to open the Timeline for this movie clip. Rename Layer 1 to "Blink" within this Timeline.

    We will make the eyes blink about every 15 frames by creating a Motion Tween. We will start the Motion Tween on Frame 11 and finish the blink animation on Frame 15. We want the eyes to be completely closed on Frame 13.

  5. Add a Keyframe on Frame 11 (Insert – Timeline – Keyframe). Because the eyes are still completely open on this frame, this will be the starting place for our tween.

Next →





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


Add Nesting+Movie+Clips+for+Complex+Animations to Twitter Add Nesting+Movie+Clips+for+Complex+Animations to Facebook Add Nesting+Movie+Clips+for+Complex+Animations to MySpace Add Nesting+Movie+Clips+for+Complex+Animations to Del.icio.us Digg Nesting+Movie+Clips+for+Complex+Animations Add Nesting+Movie+Clips+for+Complex+Animations to Yahoo My Web Add Nesting+Movie+Clips+for+Complex+Animations to Google Bookmarks Add Nesting+Movie+Clips+for+Complex+Animations to Stumbleupon Add Nesting+Movie+Clips+for+Complex+Animations to Reddit



 




For FREE email updates, subscribe to the Flash Newsletter


Past Issues


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


Content copyright © 2012 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
Flash Storybook Menu Overlay Toggle Positions

Building the Overlay Page Flash Storybook App

Menu Toggle Button for Flash Storybook App

Archives | Site Map

forum
Forum
email
Contact

Past Issues
memberscenter


vote
Fav Social Network
Facebook
Twitter
Google+
other / none



BellaOnline on Facebook
g


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


BellaOnline Editor