第11章 网页动画制作.pptx

网页设计与制作《网页设计与制作》任正云赖玲严永松编著中国水利水电出版社2011.121

11.1FlashCS5概述11.2在网页中添加特效文字11.3利用FlashCS5制作常用的图案11.4元件和实例11.5逐帧动画11.6创建形状补间动画11.7遮罩动画11.8创建动画补间动画第11章网页动画的制作2

11.1FlashCS5概述

Flash是Macromedia公司推出的一种优秀的矢量动画编辑软件，FlashCS5是其最新的版本。Flash之所以能如此风靡全球，是因为它具有许多优异的特点。其中最重要的5个特点是：1.文件占用空间小，传输速度快。2.矢量绘图，传播广泛。3.动画的输出格式。4.强大的交互功能。5.可扩展性3

11.1FlashCS5概述

Flash文档的文件扩展名为.fla(FLA)。Flash文档有四个主要部分：（1）舞台是在回放过程中显示图形、视频、按钮等内容的位置。在后面的章节中将对舞台做详细介绍。（2）时间轴用来通知Flash显示图形和其他项目元素的时间，也可以使用时间轴指定舞台上各图形的分层顺序。位于较高图层中的图形显示在较低图层中的图形的上方。（3）库面板是Flash显示Flash文档中的媒体元素列表的位置。（4）ActionScript代码可用来向文档中的媒体元素添加交互式内容。例如，可以添加代码以便用户在单击某按钮时显示一幅新图像，还可以使用ActionScript向应用程序添加逻辑。逻辑使应用程序能够根据用户的操作和其他情况采取不同的工作方式。Flash包括两个版本的ActionScript，可满足创作者的不同需要。4

11.1FlashCS5概述

完成Flash文档的创作后，可以使用“文件”→“发布”命令发布它。这会创建文件的一个压缩版本，其扩展名为.swf（SWF）。然后，就可以使用FlashPlayer在Web浏览器中播放SWF文件，或者将其作为独立的应用程序进行播放。5

11.1FlashCS5概述

11.1.1FlashCS5的开始界面运行FlashCS5，首先映入读者眼帘的是操作的“开始”页面，左边是打开最近用过的项目，中间是创作各种类型的新项目，右边是从模板创建各种动画文件，如图所示。6

11.1FlashCS5概述

11.1.2FlashCS5的工作界面启动FlashCS5，并在“开始”页中选择一项进行，就可进入Flash的工作环境，如图所示的工作界面，主要有舞台、主工具栏、工具箱、时间轴、属性面板和多个控制面板等部分。FlashCS5的工作界面7

11.1FlashCS5概述

11.1.3时间轴时间轴用于组织和控制文档内容在一定时间内播放的图层数和帧数。与胶片一样，Flash文档也将时长分为帧。图层就像堆叠在一起的多张幻灯胶片一样，每个图层都包含一个显示在舞台中的不同图像。时间轴的主要组件是图层、帧和播放头，如图所示。时间轴8

11.1FlashCS5概述

11.1.4工具箱工具箱是FlashCS5中最常用的面板，用鼠标单击能选中各种工具。用户可以自定义工具编排，执行“编辑”→“自定义工具面板”命令，打开“自定义工具栏”对话框，可根据需要重新安排和组合工具的位置，在“可用工具”列表中选择工具，单击“增加”按钮，就可以将选择的工具添加到“当前选择”列表中。单击“恢复默认值”按钮就可以恢复系统默认的工具设置。工具箱“自定义工具栏”对话框9

11.2在网页中添加特效文字在网页制作过程中，文字是最常用的对象，我们可以制作一些特效文字作为网页标题，如空心字、立体字、五彩字等，来增加网页的美观性，吸引浏览者。1．五彩字五彩字的制作方法，是先将输入的文本转换为图像对象，然后对它填充渐变色，最后再对渐变色稍加调整即可，五彩字的制作效果如图所示。五彩字效果图10

11.2在网页中添加特效文字2．空心字空心字的制作方法是：先将输入的文字转换为图形对象，然后对它进行描边，最后将文字的实心部分删去，得到空心字，效果如图所示。空心字效