网页制作案例教程-清华大学出版社-第12章-网页中常见Flash制作.ppt

本章学习导航 Flash是一种功能强大的网站设计技术，了解Flash并在网站中使用它可以作出常规网站达不到的竞争页面，具有超强的互动性，能给网站的浏览产生高水平的视觉冲击力和影响力。本章主要介绍Flash的基本概念、Flash工具的使用以及制作Flash动画的基本方法、制作过程、发布流程等知识。 本章内容在全书知识结构中所处位置如图所示 Flash是Adobe公司推出的一款矢量图形编辑和动画制作软件，使用其内置的时间轴特效，可以制作应用于文本、图形、按钮和位图等对象的复杂动画。 Flash工作界面共分7部分，分别是标题栏、菜单栏、工具面板、时间轴、舞台、属性面板、面板组，如下图所示 12.1 使用时间轴特效制作动画 12.1.1时间轴概念 时间轴是在一定时间内用来控制和组织动画场景中的祯和层播放的坐标轴。用来显示一个动画场景中每个时间单位内各个图层中的祯。 时间轴主要由祯、控制区和播放控制等部分组成 时间轴描述了层和图像的属性随时间变化的情。 时间轴只能移动层，因此想让图象或文本对象移动，就须先创建层，然后在层中插入对象。 显示/隐藏时间轴的窗口：选择“窗口”菜单中的“时间轴”命令 展开/折叠时间轴：点击时间轴左上角的三角形 播放头：指示在舞台中当前显示的帧 滚动播放头：把当前的帧移动到时间轴窗口的播放头，以方便操作 绘图纸外观：可以查看当前帧与前后相邻数帧里的内容，以方便前后多帧对照编辑 帧频率:动画播放的速率（祯/秒）,即每秒钟播放的帧数fps（默认值为12fps） 12.1.2创建图片分离效果动画 1、在菜单栏中选择“文件”—“新建”—“Flash文件（ActionScript3.0）,创建Flash文件。 2、在层控制区点击按钮，插入图层或者使用默认的图层1。 3、选择“文件”—“导入”—“导入到舞台”，把后缀为.png的位图插入到层中，如图所示 4、给图层1中的位图加时间特效，选择“插入”—“时间轴特效”—“效果”—“分离”，如图所示 5、弹出“分离”对话框，在图的右侧是位图的时间特效效果图，左侧是位图时间特效的相关参数设置，如图所示，效果默认的持续时间是20祯数，同时可以修改分离的方向、弧线大小等参数设置。 6、预览位图的时间轴特效最终效果，可以选择“控制”—“播放”或者“控制”—“测试影片”/“测试场景”，生成后缀为.swf的Flash文件，如图所示 7、创建完成后，选择“文件”—“导出”—“导出影片”，导出后缀名为.swf的Flash文件。或者选择“文件”—“发布”，进行Flash文件的发布，在“发布“前可以进行“发布设置”和“发布预览”，设置发布文件的类型及其发布文件名称，默认是发布文件类型是flash和html 12.1.3 创建模糊文字效果动画 1、在菜单栏中选择“文件”—“新建”—“Flash文件（ActionScript3.0）,创建Flash文件。 2、点击“文档文字属性面板”上的大小，设置文字舞台大小及背景颜色 3、在“工具面板”上选择“文本”工具，然后在文字舞台中输入相应的文字，在“文本工具面板”中设置字体的大小和字体颜色 4）选择“插入”—“时间轴特效”—“效果”—“模糊” 5、预览、播放及Flash最终发布同上述图片分离效果示例一样，发布的Flash文件 12.2 创建逐帧动画 12.2.1 创建打字动画 1、在菜单栏中选择“文件”—“新建”—“Flash文件（ActionScript3.0）,创建Flash文件。 2、选择“文件”—“导入”—“导入到舞台”，把后缀为.gif的图插入到舞台中 3、选择“视图”—“标尺”，显示标尺刻度，然后从标尺中，拖出一条辅助线 4、选择工具面板中的“文本”工具，然后在“属性面板”中设置文本的相关属性 5、选中第1帧，在文本中输入文字“亚” 6、选择第2帧，点右键选择“插入关键帧”，在文档中输入“思”，并按辅助线调整其位置 7、按照上述步骤方法，继续插入其他关键帧，并输入文字并按辅助线调整位置 8、选择第35帧，点右键选择“插入帧” 9、保存并测试Flash影片，按Ctrl+Enter组合键测试最后Flash效果，如果为了打写每个字之间的间隔能够长一些，效果更好，可以选中第2帧，然后按F5键4次，选中第3帧，同样按F5键4次，依次类推，如图所示 12.2.2 创建人物运动动画 1、在菜单栏中选择“文件”—“新建”—“Flash文件（ ActionScript3.0）,创建Flash文件。 2、选择“文件”—“导入”—“导入到库”，把人物运动的位 图导入到Flash库中 3、选中第1帧，并把位图1拖拽到舞台中 4、选中第2帧，按F6