Motion on a defined path in Flash

Sponsored Links

Click to view an example of Flash animation with motion along a defined path

All along we have only looked at creating motion along a straight path. What if you wanted objects to move around on a complex path.

This involves creating a simple motion tween, making the complex path and then placing the symbols at the start and end frames at the ends of the path.


Step 1

Open a new file. Rename the layer to motion path. Create a simple motion tween that runs for 60 frames (5 seconds assuming the frame rate is set to 12 frames per second).

Step 2

Right-click on motion path layer and select Add Motion Guide from the menu. A new layer is created on top. The icon of the blue curved line on this layer signifies that this is a motion guide layer.
Adding a guide layer

Step 3

Hightlight the first frame of the motion guide layer and then using the pencil tool Flash Pencil tool, draw a path on which you want the object to move.

Step 4

Click the first frame on motion path layer. With the Arrow tool Flash Arrow tool, select the symbol and drag it to the starting end of the path till the cross hair inside the symbol turns to a circle. (see figure below)
Setting the symbol to one end of the motion pathFixing the symbol to one end of the motion path.
Repeat the process for the other end of the path with the symbol on the last frame. Play the movie to see the results.


Orientation

An important property of motion tween is Orient to path direction. It causes the object to be oriented in the direction of the path. You would have to select the Orient to path direction checkbox in the Frame Properties window Tweening tab.
Note the subtle difference in the movie below (which has the Orient to path direction checked). You'll notice that the square aligns itself to the direction of the path during motion.

Click to view motion and rotation of object along a defined path in Flash





Click this button if you liked the article!

Page contents:

AddThis Social Bookmark Button