[ Pobierz całość w formacie PDF ]
With shape tweening, you specify attributes for a shape in one keyframe, and then modify the
shape or draw another shape in a subsequent keyframe. As with motion tweening, Flash creates
the animation in the frames between the keyframes.
You ll now set up a tween for the tire s shadow so that as the tire bounces, the shadow moves
and fades.
1 Click the ShadowAnim layer to select it.
2 Select Frame 30 and press F6 to insert a keyframe; then select Frame 15 and press F6 to insert
a keyframe.
3 With the playhead on Frame 15, select the Selection tool. Drag the tire shadow slightly up and
to the right.
4 With Frame 15 still selected, select the Eyedropper tool in the toolbar, and then click the
shadow object.
Create a shape tween 87
5 If the Color Mixer is not already open, select Window > Design Panels > Color Mixer to open
it, then change the Alpha value from 25% to 10%.
6 Click the options menu control in the upper right of the Color Mixer, and select Close Panel
to close the panel.
7 Select any frame between Frames 2 and 14 on the ShadowAnim layer. In the Property inspector,
select Shape from the Tween pop-up menu.
8 On the ShadowAnim layer, select any frame between Frames 16 and 29. Again, use the Tween
pop-up menu in the Property inspector to select Shape.
Copy and paste keyframes in an animation
For the tire to look realistic as it bounces, it should compress slightly on each bounce. You can
create this effect by transforming the shape of the tire in Frame 1 of the animation, and copying
that frame in Frame 30.
1 With the Selection tool, select Frame 1 of the TireAnim layer. Then press F6 to add a keyframe.
A new keyframe is added, and the playhead moves to Frame 2.
2 Select Frame 1 of the TireAnim layer again.
3 In the toolbar, select the Free Transform tool.
The tire is selected, and transform handles appear around it.
4 Select the transformation center point (the small circle near the center of the movie clip) and
drag it to the bottom of the tire.
The center point snaps to the lower middle transform handle.
5 On the Stage, drag the upper middle transform handle down to slightly compress the tire shape.
If necessary, drag the tire to align it over the shadow. To view the positioning, drag the
playhead over Frames 1 and 2.
6 Right-click (Windows) or Control-click (Macintosh) Frame 1 of the TireAnim layer and select
Copy Frames from the context menu.
7 Select Frame 29 of the TireAnim layer, and then press F6 to insert a keyframe.
8 In Frame 30 of the TireAnim layer, right-click (Windows) or Control-click (Macintosh) and
select Paste Frames from the context menu.
88 Chapter 11: Create a Timeline Animation
9 Select Control > Test Movie to view the animation.
10 Close the SWF file window to return to the authoring environment.
Change the speed of the animation
When you tested the animation, you might have noticed that the tire bounces rather slowly. You
can change the speed of an animation by changing the number of frames that play per second,
and by setting positive and negative easing values, which determine the rate of acceleration
and deceleration.
Change the frames per second speed
The frame rate, measured in frames per second (fps) is the speed at which the animation plays.
By default, Flash animations play at a rate of 12 fps, which is ideal for web animation. Sometimes,
however, it s desirable to change the fps rate. You ll now change the frame rate to 36 frames per
second, which will make the tire appear to bounce more rapidly.
1 Click on the Stage, away from any objects.
2 In the Property inspector, type 36 in the Frame Rate text box.
The frame rate applies to the entire Flash document, not just to an animation within
the document.
Change the acceleration and deceleration
By default, tweened frames play at a constant speed. With easing, you can create a more realistic
rate of acceleration and deceleration. Positive values begin the tween rapidly and decelerate the
tween toward the end of the animation. Negative values begin the tween slowly and accelerate the
tween toward the end of the animation. You ll now add both positive and negative easing values to
your animation.
1 On the TireAnim layer, select any frame between Frames 2 and 14. Then in the Property
inspector, in the Ease text box, type 100. Press Enter or Return.
2 On the same layer, select any frame between Frames 16 and 29. Then in the Ease text box, type
-100. Press Enter or Return.
3 On the ShadowAnim layer, select any frame between Frames 2 and 14. Then in the Ease text
[ Pobierz całość w formacie PDF ]
