newspicsfile20140625-网站规划与网页设计.ppt

《网站规划与网页设计》 西京学院 电子商务教研室 杜永红 第12章 利用FLASH设计网页动画 第12章 利用FLASH设计网页动画 Flash是当前最流行的交互式矢量制作软件，用它制作出来的Flash动画具有极丰富的表现力，Flash可以制作导航按钮、具有声音效果的动画、MTV及整个Flash站点。例如知名公司可口可乐的网站，本章通过多个Flash实例进行由浅入深的讲解，重点介绍了矢量图设计、特效文本处理、添加声音及ActionScript的初步应用。 [本章学习目的] 　　通过本章学习，读者能够： 了解Flash的工作界面和基本操作 掌握Flash中绘图技巧、位图操作与文本的处理 掌握Flash中场景、元件与实例操作、图层的管理 了解Flash动画的类型 掌握如何创建动画，实现动画的交互控制 学会Flash作品的设计与制作 12.1 实例导入：制作Flash MTV 　　【例12.1】 利用Flash技术制作图文声并茂的Flsah MTV，如图11.2所示。 　　主要涉及以下知识点。 　　1）进行画面布局。 　　2）制作补间动画。 　　3）制作按钮。 　　4）载入其他的swf文件。 　　5）添加ActionScript脚本语言创建交互界面。 　　6）集成Flash影片。 12.2 Flash cs5概述 12.2.1 Flash的工作界面 1．“启动”界面 　　在启动Flash cs5时，出现“启动”界面，使用“启动”界面用户可以快速完成最常用的操作，如图所示。 2．操作界面 主要由“菜单”栏、工具箱、时间轴、舞台、“属性”面板、集成工作面板等构成。 12.2.2 Flash的基本操作 1．新建文档 　　方法一：选择“文件”菜单→“新建”命令，或按下快捷键Ctrl+N，弹出一个对话框，单击常规选项或是模板选项，选择其中一项后，单击“确定”按钮，即创建一个文件，如图所示，右侧出现文档的属性，宽度和高度的尺寸，帧频，设置背景颜色等。 　　方法二：单击“启动”界面中“新建”选项中的某一项，或是“从模板创建”选项中的某一项，如图所示，例如选择“新建”选项→“ActionScript 2.0”，即创建了一个新的FLASH文档。 2．打开文档 　　选择“文件”菜单→“打开”命令，或使用快捷键Ctrl+O，或单击启动界面中打开最近项目中的某个文档或“打开”项。 3．保存文档 　　选择“文件”菜单→“保存”命令，或使用快捷键Ctrl+S。文档在编辑过程中要及时保存，Flash文档的扩展名为.fla。 4．发布影片 　　制作好的Flash动画最终要发布出来或者嵌入到网页中。Flash软件支持多种能够在网页中播放的文件格式。 　　发布和测试Flash文档时，常用的方法有以下二种。 　　方法一：选择“文件”菜单→“导出”选项→“导出影片”命令，出现“导出影片”对话框，选择存储路径，单击保存类型下拉列表，选择文件格式，命名文件，单击“保存”按钮，如图所示。 　　方法二：选择“文件”菜单→“发布设置”命令，选择发布文件的格式及存储路径，然后单击“发布”按钮，如图所示。 12.2.3 Flash CS5 的新功能 FLASH CS5在以前版本的基础上，增加了一些十分实用的新功能，下面将进行简单介绍。 1. 基于对象的动画 2. 3D变形 3. 使用“骨骼”工具进行反向运动 4. 使用“Deco”工具装饰性绘画 5. “动画编辑器”面板 6. 补间动画预设 12.3 Flash的基本功能 11.3.1 绘图和填充 　　Flash提供了多种绘图和填充工具，可以用来绘制直线、形状和路径及编辑操作。 1．笔触与填充：“油漆桶”工具、“墨水瓶”工具 2．绘制基本几何形状 3．绘制曲线 4．用“铅笔”工具绘图 5．用“刷子”工具绘图 6．对象的操作 7．缩放和旋转对象 8．辅助工具的使用 9．排列、对齐、组合和取消组合 12.3.2 位图操作 1. 导入位图 Flash不仅可以绘制各种形状的矢量图形，也可以导入多种格式的位图，如：JPG、GIF、PNG格式等。 选择“文件”菜单｜“导入”｜“导入到舞台”命令，直接将位图导入到舞台中，选择“导入到库”命令，则将位图导入到“库”面板中，舞台中并没有出现。 2. 使用位图填充 使用已导入的位图可以对绘制好的图形进行填充，在“混色器”面板中，单击“类型”下拉框，选择位图填充时，已导入的位图将显示在下方的列表区域中，选择某个位图。如果列表区域中没有所需的位图，单击“导入”按钮，弹出“导入到库”对话框，选择本地计算机上的位图图像，并将其添加到库中。 3. 分离位图 在舞台中导入一幅位图后，不能直接进行编