|
||||||
|
||||||
Flash Tutorial - Nesting: Tweens within Tweens
Free
Tutorial
Nesting is a fundamental concept when building Flash Movies. For beginners it is a difficult concept to grasp but it is worth the effort as nesting enables you to create Flash Movies that are far more flexible and less linear. That is the user has more options about what is to happen next. In other words nesting enables you to create Movies which are more interactive and less predictable. It is my belief that once a beginner really understands nesting and how nested objects talk to one another (target paths) then you are well on the way to understanding the basic fundamentals of how Flash works.
Cross Ref: If you do not know how to create a Tween on stage or how to attach a ActionScript to a buttons and the timeline you should do the these previous tutorials first:
The aim of the tutorial is to:
Show you how symbols are placed within symbols. This is a fundamental concept in Flash.
My Example: Download the Flash file Beg 008a
Note: In this example the word web animates independently to the opening animation. Click the play button and watch the word web. It animates irrespective of what the word wasp does. This is little concept enables you to do so much. It means that one object - such as an animated word (or group of objects) react in ways which is not dependant on what other objects are doing. This gives you tremendous flexibility and fluidity when building your Flash Movies.
Step one: Creating the first symbol
In the example above my first symbol was the word web.


Note: If you open the Library you will see your symbol: Window > Library (F11)
Your first Symbol in the Library.
Step two: Animating the first symbol

Note: You need to drag the
Graphic Symbol not the
Movie Clip. If you drag the wrong Symbol you will get an error message:
Error Message.
Note: You can tell a movie clip from a graphic by the icon the Library.
Movie Clip
Graphic Make sure you select the Graphic Symbol.
Note: This copy and pastes whatever is in frame 1 into frame 30.


Note: If you press Enter on your keyboard you should find that your animation looks similar to this:
If your animation does not exactly like this it does not matter as the tutorial is about nesting (placing one symbol inside another) not about animation techniques. What is important is that the word web animates.
If your symbol does not rotate around the central axis but like this:
The symbol is not rotating around the centre of the word.
To correct this select the Free Transformation Tooland click on the symbol. Drag the little circle to the centre of the symbol:
The Symbol rotates around the little circle. Move the circle and the animations central point changes.
Note: This will take you back to the stage. Remember your animation is not on the stage but in the Library.
Step three: Test your movie
Note: One of your symbols should be static and the other animated:
The Nesting: The original text that you typed is in the Symbol web. This is then nested inside the Movie Clip Web MC and lastly this is all placed on the Main Stage. The nesting looks like this:
Note: If you double click on the Movie Clip you will find yourself editing inside the Web MC symbol. On your Edit bar you will see this:
If you then double click on the Symbol again you will find yourself editing inside the original Web Graphic where the text is:
The Edit Bar shows what symbol you are currently editing and the Property Inspector shows the attributes of the object/s (text) inside that symbol.
Important: Make sure you return to the Main Stage clicking on the Scene 1 Tab:![]()

Cross Ref: You might be wondering what the difference is between a Movie Clip and a Graphic Symbol is? This is not straight forward as the names might suggest sp to answer so their is a members tutorials dedicated to this: Movie Clip or Graphic?
I will say that if in doubt select Movie Clip as it is more flexible.
Step four: Create a New Symbol

Step five: Testing the new Symbol
Step six: Animating the main stage.
Step seven: Adding a button
You will need a new layer for your button. If you do not do this your Tween may end up in a muddle.
Note: If you take a button from the Common Button Library avoid Knobs, Faders and Component buttons as they work differently. I selected one of the Oval Buttons.
Step eight: Test your movie
It is time to see if your movie works. Good Luck!
My Example: Download the Flash file Beg 008b
The Finished Movie.
Your movie should now be complete so I hope you enjoyed having fun with animation.
Why not try out webwasp's new community. Meet new people, find friends in your area: Webwasp Mates & Dates
•
104119 visitors to this page since May
05 |
|
|
All material on this site is protected under international copyright © law. DO NOT reproduce any material from this site without written permission. Please ask as permission is often granted.
|