Flash动画入门案例一

1、Flash动画入门案例一2）了解简单的动画制作方法3）掌握通过常规及模板创建文件的方法4）学习影片测试、保存、发布。1、矩形到的变形动画案例下面通过创建一个常规文件完成矩形到圆的变形动画，学习掌握Flash文件创建、属性设置、保存与发布的方法。如图1-5-1所示。图1-5-1矩形到圆的变形动画效果图设计设计制作：步骤1：新建“Flash文件(ActionScript3.0)”类型的文件。步骤2：使用“修改丨文档”命令修改文档属性，尺寸设置为800*600。步骤3：在图层1第1帧舞台左上侧绘制矩形，填充为红色，第30帧“插入I时间轴I关键帧”，(也可以通过F6功能键进行插入关键帧操作)，删除第3

2、0帧矩形，在舞台右下侧绘制椭圆。右击图层1第1帧，在快捷菜单中选择“创建补间形状”命令，在第1帧与第30之间形成补间帧。步骤4：按“Enter”播放动画。步骤5：保存文件为xl-1.fla，观察其文件存储容量。步骤6：“文件|发布设置”，设置发布文件为swf、html、exe格式，发布文件。观察比较各类文件存储容量，得出结果。步骤7：“文件导出导出影片”，将文件导出为avi、位图序列格式*.bmp，比较文件存储容量和播放效果。2、通过模板创建文件幻灯片动画案例幻灯片动画通过交替显示来展示图像，在显示图像时，幻灯片动画既可以自动播放，也可以通过手动逐一显示图像。这样的动画需要制作许多图形元件、按

3、钮元件，甚至需要创建动作才可以实现。利用“照片幻灯片放映”模板创建文件，进行图像替换很容易实现这样的功能。如图1-6-1所示。图1-6-1幻灯片动画效果图设计设计制作：步骤1：执行“文件|新建”命令，在对话框中切换到“模板”选项卡。选择“类别”列表中的“照片幻灯片放映”选项，在“模板”列表中选择“现代照片幻灯片放映，”确定步骤2：由于该模板文档是一个完整的动画，所以保存后即可预览效果。想要播放自己的照片，需要先将照片导入到库。执行“文件|导入|导入到库”命令，将准备好的图片素)toAlbumI)凰位图l宽：640.0 x：0.01_高：480.0Y:0.0“00of100：zSg：f交按位图0

4、imgl-jpg实例：diff_optimized.jpgSimg2.jpg3img3.jpgaimg4.jpg3photosSalley_optimized.jpg謝diff_optimized.jpgtemplateAssetsimgl-jpgimg2.jpgimg3.jpgimg4.jpgphotos取消材导入到库。如图1-6-2所示。Theelegant&eashore.图1-6-2设置替换图片步骤3：在时间轴面板中找到图像所在图层(PictureLayer),并且选中第一幅图像，单击属性面板中的“交换”按钮，在“交换图像”对话框列表中选择要替换的图像文件，确定。如图1-6-3所示。使

5、用任意变形工具调整替换的图像大小和位置，使图像位于边框内部。图1-6-3替换图片后步骤4：使用相同的方法，为其他图像交换导入的图像。完成后保存文件，执行“控制I测试影片”(Ctrl+Enter)预览幻灯片效果。庭院设计案例学习要点绘图工具的使用笔融颜色填充颜色黑伯无颜色填充j5：交换颜色填充.0（1）学习文档属性修改；（2）学习画线、圆、矩形、多边形工具的使用（3）学习普通图层的使用；（4）选取工具的使用（5）学习铅笔工具使用；（6）学习颜色面板使用、滤镜的使用；任务布置：设计一庭院场景，如图2-1-1所示。要求在庭院中绘制房屋、树木、花草等典型对象并且将庭院中每一类对象放在不同图层中。图2-

6、1-1庭院设计效果图知识讲授：1轮廓和填充:在Flash中绘制的图形基本上是由轮廓和填充构成的，在绘制各种图形时，应当设置图形的轮廓颜色、填充颜色以及轮廓的粗细、样式等属性。在工具栏的颜色区可以设置图形的轮廓颜色和填充颜色，如右图所示。2墨水瓶工具。利用墨水瓶工具可以改变现存直线的颜色、线型和宽度，这个工具通常与（滴管工具）连用。按下该按钮后，在属性面板中设置好色彩、样式及粗细等属性，便可以为图形添加色彩边框，图2-1-2是不同线宽的墨水瓶填充效果。图2-1-2设置墨水瓶工具不同线宽的效果比较3颜料桶工具。利用颜料桶工具可以对封闭的区域、未封闭的区域以及闭合形状轮廓中的空隙进行颜色填充。填充的

7、颜色可以是纯色也可以是渐变色。图2-1-3为使用颜料桶工具对绘制的图形进行纯色填充效果和进行渐变色填充效果比较。图2-1-3对绘制的图形进行纯色填充效果和渐变色填充效果选择工具箱中的颜料桶工具，在工具栏下部的选项部分中将显示如图2-1-4所示的选项。这里共有两个选项：空隙大小、锁定填充。在“空隙大小”选项中有“不封闭空隙”、“封闭空隙”、“封闭中等空隙”、“封闭大空隙”4种选项可供选择。如果选择了“锁定填充”按钮，将不能再对图形进行填充颜色的修改，这样可以防止错误操作而使填充色被改变。颜料桶工具的使用方法：首先选择工具栏中选择颜料桶工具，然后选择填充颜色和样式。接着单击“空隙大小”按钮，从中选

8、择一个空隙大小选项，最后单击要填充的形状或者封闭区域，即可填充。提示：如果要在填充形状之前手动封闭空隙，请选择“不封闭空隙”按钮。对于复杂的图形，手动封闭空隙会更快一些；如果空隙太大，则用户必须手动封闭它们。图2-1-4颜料桶工具选项和空隙选项4铅笔工具：用于在场景中指定帧上绘制线和形状，它的效果就好像用真的铅笔画画一样。铅笔工具有三个绘图模式，如图2-1-5所示：直线化模式工，系统会将独立的线条自动连接，接近直线的线条将自动拉直，摇摆的曲线将实施直线式的处理。平滑模式SS,将缩小Flash自动进行处理的范围。在平滑选项模式下，线条拉直和形状识别都被禁止。绘制曲线后，系统可以进行轻微的平滑处理

9、，端点接近的线条彼此可以连接。墨水模式，将关闭Flash自动处理功能。画的是什么样，就是什么样，不做任何5颜色面板利用颜色面板可以在RGB或HSB模式下选择颜色，还可以通过指定Alpha值来定义颜色的透明度。执行菜单中的“窗口|颜色”命令，调出颜色面板，如图2-1-6所示。如果要选择其他模式显示，可以单击右上角的按钮，从弹出的选择RGB（默认设置）或HSB。对于RGB模式，可以在“红”、“绿”和“蓝”文本框中输入颜色值；对于HSB模式,则输入“色相”、“饱和度”和“亮度”值。此外还可以输入一个Alpha值来指定透明度,其取值范围在0%（表示完全透明）100%（表示完全不透明）之间。单击图标，可

10、以设置笔触颜色;单击少图标可以设置填充颜色。单击按钮,可以恢复到默认的黑色笔触和白色填充；单击口按钮，可以将笔触或填充设置为无色；单击七按钮，可以交换笔触和填充的颜色。交换颜色颜色选择器当前颜色样本卜六进制值渐变调节滑杆笔融颜色填充颜色黑白无填充色图2-1-6颜色面板在类型右侧下拉列表中有“无”、“纯色”、“线性”、“放射状”和“位图”5种类型可供选择，如图2-1-7所示。无：表示对区域不进行填充。纯色：表示对区域进行单色的填充。线性：表示对区域进行线性的填充。单击颜色条中的该按钮，可以在其上方设置相关渐变颜色。放射状：表示对区域进行从中心处向两边扩散的球状渐变填充。单击颜色条中的该按钮，可以

11、在其上方设置相关渐变颜色。位图：表示对区域进行从外部导入的位图填充。纯色填充线性填充放射状填充图2-1-7颜色填充模式6.利用选择和部分选择工具编辑曲线当使用飞（选择工具）拖动线条上的任意点时，鼠标指针会根据不同情况而改变形状。当将选择工具放在曲线的端点时，鼠标指针变为形状，此时拖动鼠标，可以延长或缩短该线条。当将选择工具放在曲线中的任意一点时，鼠标变为形状，此时拖动鼠标，可以改变曲线的弧度。如图2-1-8所示图2-1-8利用选择工具延长或缩短线条，改变曲线弧度当将选择工具放在曲线中的任意一点，并按住键盘上的ctrl键进行拖动时，可以在曲线上创建新的转角点，如图2-1-9所示。图2-1-9利用

12、选择工具在曲线上创建新的转角点图案例设计制作：步骤1：背景绘制。启动FlashCS3，新建一个空白文档，舞台大小设置为600*500px。新建一个“背景”图层，单击“工具箱”中的“矩形工具”，然后绘制一个与舞台大小的矩形，再按shift+9组合键打开“颜色”面板，然后设置类型为“线性”，第一个色标为(R：65G:194B:255),Alpha为100%，第二个色标为(R:12G:96B:150),Alpha为77%,第三个色标为(R:65G:61B:33),Alpha为100%，第四个色标为(R:252G:213B:122),Alpha为100%，填充后删除边框。如图2-1-10所示。2-1-

13、10背景颜色设计步骤2：太阳绘制。选择“椭圆工具”，按shift键画一个无边框的正圆。在“颜色”面板内设置类型为“放射状”，第一个色标为(R:252G:86B:46),Alpha为100%，第二个色标为(R:253G:11B:11),Alpha为100%，第三个色标为(R:253G:193B:155),Alpha为100%。如图2-1-11所示。图2-1-11太阳着色图2-1-12新建太阳元件步骤3:太阳光晕效果。选择填充好的圆，按F8键将其转换为“影片剪辑”，并命名为“太阳”，如图2-1-12。为了制作出朦胧的效果，选择“太阳”，单击“属性”面板下的“添加滤镜”按钮，在弹出的菜单中选择“发光

14、”和“模糊”命令，然后在弹出的面板中做如图2-1-13所示的设置，效果如图2-1-13右侧所示。图2-1-13太阳的滤镜效果设置步骤4:小草绘制。新建一个图层并命名为“草”，用“线条工具”在该图层内绘制如图2-1-14所示的形状，然后用“选择工具”将线条编辑成草的形状，选择“颜料桶工具”将色标调整为“#006600”进行填充（填充时图形一定要封闭），删除边，按Ctrl+G键进行组图2-1-14草的绘制步骤5:树冠绘制。新建一个图层并命名为“树”，用“铅笔工具”在该图层内绘制如图2-1-15所示的形状，然后用“选择工具”将线条调节成树冠的形状，选择“颜料桶工具”将色标调整为“#99FF66”和“#53C229”进行填充（填充时图形一定要封闭），按Ctrl+G键进行组合。图2-1-15树冠绘制步骤6：树干绘