Flash CS3中文版动画设计100例
上QQ阅读APP看本书,新人免费读10天
设备和账号都新为新人

实例2 设置植物生长动画

实例说明

在本实例中,将为读者讲解植物生长动画。在制作过程中,主要通过添加普通帧及空白关键帧来创建该动画。

技术要点

在制作本实例时,首先导入一张素材图片作为背景,然后通过在不同图层中添加普通帧及空白关键帧来调整图片的显示时间,设置植物生长动画。

本实例中在添加各帧图片时要注意其位置的摆放,以及显示时间的设置,如图2-1所示为本实例在不同帧的动画截图。

图2-1 设置植物生长动画

1 打开Flash CS3,在菜单栏执行“文件”/“新建”命令,打开“新建文档”对话框,在该对话框中的“常规”面板中,选择“Flash文件(ActionScript 3.0)”选项,如图2-2所示,单击“确定”按钮,退出该对话框,创建一个新的Flash文档。

图2-2 新建文档

2 在“属性”检查器中单击“文档属性”按钮,打开“文档属性”对话框,设置文件的尺寸的宽为“350像素”,高为“435像素”,设置背景颜色为“白色”,设置帧频为“12”,标尺单位为“像素”,如图2-3所示,单击“确定”按钮,退出该对话框。

图2-3 “文档属性”对话框

3 在菜单栏执行“文件”/“导入”/“导入到舞台”命令,打开“导入到舞台”对话框,打开本书附带光盘“帧与关键帧的设置”/“实例2:设置植物生长动画”/“植物生长.psd”文件,打开“将‘植物生长.psd’导入到舞台”对话框,选择全部图层,如图2-4所示,单击“确定”按钮,退出该对话框。

图2-4 “将‘植物生长.psd’导入到舞台”对话框

4 选择“背景”层的第35帧,按下键盘上的F5键插入帧,使该图片延续到第35帧,如图2-5所示。

图2-5 插入帧

5 选择“花04”层的第1帧位置的关键帧,按住鼠标左键不放,将该关键帧拖动到第23帧处,如图2-6所示,使该层图片在第23帧之前不显示。

图2-6 拖动帧的位置

6 选择“花04”层的第35帧,按下键盘上的F5键插入帧,使该图片的显示延续到第35帧。

7 选择“花03”层的第1帧,按住鼠标左键不释放将该帧拖动到第17帧处,如图2-7所示,使该层图片在第17帧以前不显示。

图2-7 拖动帧的位置

8 选择“花03”层的第35帧,按下键盘上的F5键插入普通帧,使该图片延续到第35帧。

9 选择“花02”层的第1帧,按住鼠标左键不释放将该帧拖动到第11帧处,如图2-8所示,使该层图片在第11帧以前不显示。

图2-8 拖动帧的位置

10 选择“花02”层的第35帧,按下键盘上的F5键插入帧,使该图片延续到第35帧。

11 选择“花01”层的第1帧,按住鼠标左键不放将该帧中拖动到第11帧处,如图2-9所示,使该层图片在第7帧以前不显示。

图2-9 拖动帧的位置

12 选择“花01”层的第35帧,按下键盘上的F5键插入帧,使该层图片延续到第35帧。

13 现在本实例就全部完成了,按下键盘上的Ctrl+Enter组合键,测试影片效果,可以看到植物生长的动画,图2-10所示为本实例在不同帧的显示效果。如果读者在制作过程中遇到了什么问题,可以打开本书附带光盘文件“帧与关键帧的设置”/“实例2:设置植物生长动画”/“设置植物生长动画.fla”,该实例为完成后的文件。

图2-10 设置植物生长动画效果