Home / Articles / Animating Symbols

Animating Symbols

Changing the Path of the Motion

The motion tween of the left car that you just animated shows a colored line with dots indicating the path of the motion. You can edit the path of the motion easily to make the car travel in a curve, or you can move, scale, or rotate the path just like any other object on the Stage.

To better demonstrate how you can edit the path of the motion, open the sample file 04MotionPath.fla in the Lesson04/04Start folder. The file contains a single tween layer with a rocket ship moving from the top left of the Stage toward the bottom right.

04fig47.jpg

Moving the path of the motion

You will move the path of the motion so the relative movement of the rocket ship remains the same but its starting and ending positions change.

  1. Select the Selection tool.

  2. Click the path of the motion to select it.

    The path of the motion becomes highlighted.

    04fig48.jpg
  3. Drag the motion path to move it to a different place on the Stage.

    The relative motion and timing of the animation remain the same, but the starting and ending positions are relocated.

    04fig49.jpg

Changing the scale or rotation of the path

You can also manipulate the path of the object’s motion using the Free Transform tool.

  1. Select the path of the motion.

  2. Select the Free Transform tool.

    Transformation handles appear around the path of the motion.

  3. Scale or rotate the path of the motion as desired. You can make the path smaller or larger, or rotate the path so the rocket ship starts from the bottom left of the Stage and ends at the top right.

Editing the path of the motion

Making your objects travel on a curved path is a simple matter. You can either edit the path with Bezier precision using anchor point handles, or you can edit the path in a more intuitive manner with the Selection tool.

  1. Select the Convert Anchor Point tool, which is hidden under the Pen tool.

    04fig52.jpg
  2. Click the starting point or the ending point of the motion path on the Stage and drag the control handle out from the anchor point.

    The handle on the anchor point controls the curvature of the path.

  3. Choose the Subselection tool.

  4. Drag the handle at each end of the path to edit its curve. Make the rocket ship travel in a wide curve.

Orienting objects to the path

Sometimes the orientation of the object traveling along the path is important. In the motion picture splash page project, the orientation of the car is constant as it moves forward. However, in the rocket ship example, the rocket ship should follow the path with its nose pointed in the direction in which it is heading. Orient To Path in the Properties panel gives you this option.

  1. Select the motion tween on the Timeline (Shift-click to select the whole tween).

    04fig55.jpg
  2. In the Properties panel, under Rotation, select the Orient To Path option.

    Animate inserts keyframes for rotation along the motion tween to orient the nose of the rocket ship to the path of the motion.

10. Swapping Tween Targets | Next Section Previous Section

There are currently no related articles. Please check back later.