Nesting: Tweens within Tweens

Step one: Creating the first symbol

In the example above my first symbol was the word web.

1. Click on: Insert > New Symbol.
2. In the dialog box type a name: Web MC
3. Select Movie Clip.
   
   
   
   
4. Click: OK
   
   
5. If you Library is closed, open it: Window > Library (F11)
6. Drag the first Symbol that you created into the middle of the Stage:

   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.

   
   
7. In the Timeline right click (Mac: Ctrl click) in frame 30 and select: Insert Keyframe

   Note: This copy and pastes whatever is in frame 1 into frame 30.

8. Right click in the Timeline on frame 1 and select: Create Motion Tween
   
   Your Timeline should look like this:
   
   
   

   The Timeline with a Motion Tween.
   
   
9. In the Property Inspector select: Rotate > CW (clockwise)
   
   
   

   Making the symbol rotate.
   
   

   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 Tool and 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.
10. If the Edit Bar is closed, open it: Window > Toolbars > Edit Bar
11. To return to the Main Stage clicking on the Scene 1 Tab:

    Note: This will take you back to the stage. Remember your animation is not on the stage but in the Library.

12. Save your Flash Movie.

1. If your Library is closed, open it: Window > Library (F11)
2. Drag both your symbols onto the main stage from the Library.
3. Go to: Control > Test Movie.

   Note: One of your symbols should be static and the other animated:
   
   

4. Close the Test Preview by clicking on the small cross in the top right of the window:

   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:
   

   

   (Click to enlarge)
   
   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:
5. Delete both symbols from the Main Stage. Remember they are still in the Library:
   
   
   

   Library with two Symbols.

1. Go to: Insert > New Symbol.
2. In the dialog box type a name: webwasp MC
3. Select: Movie Clip
4. Click: OK
   
   
5. Select the Text tool:
6. Click on Stage and type the word: wasp
7. Return to using the Selection tool:
8. In the Property inspector (and with the text still selected) choose a Font colour and style: Font Style
   
   
9. If the Library is closed, open it: Window > Library (F11)
10. Drag your animated Symbol Web MC onto the stage. Web MC
    
    Important: Make sure you select the animated Movie Clip Web MC and not the static Graphic Symbol: Web
    
    Your Stage should look like this:
    
    
    

    The Movie Clip Web MC and the text nested inside the new symbol called Webwasp MC.
    
    
    
11. Return to the Main Stage clicking on the Scene 1 Tab:

Step five: Testing the new Symbol

1. Save your Movie: File > Save (Ctrl S)
2. You should be on the Main Stage and it should be blank. If there is anything on the Main Stage delete it.
3. If the Library is closed, open it: Window > Library (F11)
4. Drag out the new Movie Clip: Webwasp MC
5. Go to: Control > Test Movie (Ctrl + Enter)
   
   Your Movie should look similar to this:
   
   
   Testing the Movie Clip: Webwasp MC
   
   
   
6. Close the Test Preview by clicking on the small cross in the top right of the window:

1. Animate it as you would any other Tween. You do this by:
   
   • Going to a new frame, lets say 40, right click, select Insert Keyframe.
   • Move the symbol on frame 40 to a new position.
   • Right click in the time line in-between the two Keyframe. Select: Create Motion tween.
   • Repeat this as many times as you want.
   
   The Tween that I made simply moves from off stage left to the right side of the Main Stage like this:
   
   
   The Tween that I made on the Main Stage goes from left to right.
   
   
   
2. If the Actions Panel is closed, open it: Window > Actions (F9)
3. At the end of this animation I would like the animation to stop. To do this you will need to select the last Keyframe in your Timeline. In mine this is frame 40. Type the following into the Actions Panel:
   
   

   stop();

   
   If you wish to test your Movie again it should now play once and then stop.

1. In the Timeline click on the Insert Layer button.
2. Find the last frame of your animation in the time line and right click in your new layer just above this frame.
3. Select: Insert Blank Keyframe.
4. Go to: Window > Other Panels > Common Libraries > Buttons.
5. Open one of the button folders by double clicking on it.
6. Select a button and drag it onto the: Main Stage

   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.

7. With the Button still selected type the following in the Actions Panel:
   
   

   on (release) {         gotoAndPlay(1);     }

1. Save your Flash movie.
2. Go to: Control > Test Movie.