Using Director > Animation > Tweening the path of a sprite

 

Tweening the path of a sprite

Sprite paths are the lines Director displays on the Stage to show the movement of a sprite. Sprite paths are controlled by the Sprite Overlay Settings dialog box. You can change settings to make the paths appear for all sprites, for selected sprites, or only when the pointer rolls over a sprite. See Using the Sprite Overlay.

You can tween a sprite directly on the Stage by editing the sprite's path. Director displays the path of the selected sprite directly on the Stage. You can adjust the path by dragging keyframe indicators.

To tween the path of a sprite:

1

Place a sprite on the Stage where you want the path to start. If the sprite is already on the Stage, select it.

This places the start frame of the sprite in the proper location. The start frame is also the first keyframe of the sprite.

2

If necessary, choose View > Sprite Overlay > Show Paths.

The Show Paths option is on by default. With this option turned on, Director displays the paths of moving sprites on the Stage. Keyframes appear as hollow circles. Small tick marks show the sprite's position in tweened frames.

3

Insert keyframes in any additional frames where you want the sprite's animation path to change.

4

Drag the red handle within the sprite to the place on the Stage where you want the sprite's path to end.

The red handle represents the sprite's location in the end frame. For bitmaps, the red handle is usually in the center of the image. For vector shapes and other media types, the handle is often in the upper left corner.

5

Director displays the path the sprite will follow. The tick marks along the path show the sprite location in each frame in between.

6

To make the sprite's path curve between more points, hold down the Alt key (Windows) or Option key (Macintosh) and move the pointer on the Stage over a tick mark. When the pointer changes color, drag the tick mark to a new location.

This creates a new keyframe and records the new location. Repeat this step to create additional keyframes.

7

To make the property changes defined by a keyframe occur at a different time, drag the keyframe in the Score to a new frame within the sprite.

8

To change the degree of curvature between keyframes, choose Modify > Sprite > Tweening and adjust the Curvature slider. To make the sprite move in the same direction at the beginning and end, select Continuous at Endpoints in the Sprite Tweening dialog box. This creates a circular motion. See Changing tweening settings.