Flash Script – Tweening Motion Along A Path

Tweet


type = 'application/x-shockwave-flash'
data = 'http://sitepointstatic.com/flash/pathtween.swf'
width = '400'
height = '400'
bgcolor = 'black'
>

Motion guide layers let you draw paths along which tweened instances, groups, or text blocks can be animated.

You can link multiple layers to a motion guide layer, and have multiple objects follow the same path. A normal layer that’s linked to a motion guide layer becomes a guided layer.

To create a motion path for a tweened animation, download the sample files here, then follow these steps:

1. Create a motion-tweened animation sequence.

2. Select the animation layer. Right-click and choose Add Motion Guide from the Context menu.

1179_0

3. Use the pen tool to draw the path you want your tween to follow.

4. Snap the center to the beginning of the line in the first frame of the animation layer, and to the end of the line in the last frame.

1179_1

1179_2

That’s all it takes. Test the movie to see your shape tween!

Free book: Jump Start HTML5 Basics

Grab a free copy of one our latest ebooks! Packed with hints and tips on HTML5's most powerful new features.

No Reader comments