Introduction to Flash and Actionscript

S1 - Using Tweens

T1 - Motion Tweens

 

Creating Library Symbols

1. Draw a perfect circle (hold down shift) filled with no outline.

2. Convert it to a movie clip and name it myCircle

(NOTE: Always use my in front of a symbol name, that begins with a capital letter)

3. Delete myCircle from the Stage

4. Rename "Layer 1 " to "Circle 1"


Animating the Circle using Tweens

1. Drag an Instance of myCircle from the library to the stage and name it myBlueCircle_ mc


(NOTE: name format is : my, descriptor(Uppercase),Type (capital), _mc for movie clip)

2. Right-click the circle instance on the Stage and choose > Create Motion Tween in the menu that appears. Notice that the Timeline is automatically extended to Frame 24 and the red marker known as the playhead moves to Frame 24. Now click on the end and drag the timeline to Frame 50

  1. While the playhead is still on Frame 50 of the Timeline, select the circle instance on the Stage and drag it to the right, just past the Stage area. On Frame 50, notice the diamond-shaped dot (known as a property keyframe) that appears. On the Stage, also notice the motion guide that indicates the circle's path of motion between Frame 1 and Frame 50


Test your animation.

  1. You can change the path by moving to a frame and dragging the circle

or you can make a smooth path by dragging the green path line

    Your Turn

Create a new layer called "Square"

Create a new library symbol called mySquare

Add an instance of myCircle to the new layer and name the instance correctly (myGreenSquare_mc)

Create a second tween. The square must pass over the circle at some point. Hint: Change the order of your layers