网页设计与制作教程

图8-3 补间动画的原理
8.2 Flash MX 2004的基本知识
8.2.2 动画的基本概念 3. Flash动画的格式 (1) Flash源文件格式 Flash源文件格式的扩展名fla，该类型文件只能在Flash 应用程序中被打开和编辑，在其他软件中是无法到达开的。用户 可以在Flash应用程序中打开该文件，然后导出扩展名为swf或 swt的文件，以便在浏览器中使用。 (2) Flash电影文件格式 Flash电影文件格式的扩展名为swf。该类型文件是电影文 件格式源文件的压缩生成的文件，已经为网络中查看而进行了优 化处理。因此，这种类型的文件可以在浏览器中播放，但是要求 浏览器安装Flash Player播放器插件才能播放，也可以在 Dreamweaver中预览，但是却不能在Flash应用程序中编辑。另 外，在Dreamweaver中允许用户直接插入Flash动画对象，该对 象的扩展名就是swf。
图8-48 时间轴窗口中的各种类型的层
图8-49 “图层属性”对话框
8.3 动画制作
8.3.4 遮罩动画的制作 遮罩层也叫蒙板，是Flash中的一种特殊图层。它本身是 一个不会被显示的图形区域，利用特殊的遮罩关系，可以实现 它下层被遮罩的图层显示区域或显示范围的控制，即在遮罩层 上非透明的区域，下层对应的地方就显示，否则不显示。需要 注意的是，遮罩层和它下层被遮罩的图层有严格的上下层关系， 次序绝对不可以颠倒。 遮罩动画的实现步骤一般如下： ① 制作一段运动渐变动画或形状渐变动画。 ② 然后添加一个图层，并设置属性为遮罩层。 ③ 在遮罩图层和被遮罩图层之间建立关联关系，实现遮 罩动画的效果。
网页设计与制作教程
机械工业出版社同名教材 配套电子教案
2005.8
第8章 网页动画制作工具 Flash MX 2004
8.1 8.2 8.3 8.4
Flash MX 2004简介 Flash MX 2004的基本知识 动画制作 动画的测试、优化与发布
8.1 Flash MX 2004简介
8.1.1 Flash的特点
8.2 Flash MX 2004的基本知识
8.2.1 Flash MX 2004的基本概念
2. 层 Flash中层就像一张“透明纸”，在上面可以画一些图 形、写一些文字，然后将多层“透明纸”重叠在一起，就实 现最终的效果了。层在时间轴窗口中就是一个横行，它包含 着若干个帧。 在Flash中有普通层、运动引导层、遮罩层和注释说明 层。通常建立的层都是普通层；通过运动引导建立的层是引 导层，它的作用是提供引导线作为被引导层中对象的运动轨 迹；而遮罩层是通过设定遮罩关系建立的层，它的作用是为 了实现遮罩关系下的特别效果；注释说明层本质上是一个运 动运动引导层，可以在其中添加一些说明性文字，而输出时 不输出该层内容。
图8-39 形状渐变
图8-40 形状渐变的属性面板
8.3 动画制作
8.3.3 形状渐变动画的制作 设计目标 利用形状渐变制作图形向文字从色彩到形状的过渡变化， 渐变效果如图8-41所示。 【例8-3】
图8-41 从色彩到形状的渐变效果
8.3 动画制作
8.3.4 遮罩动画的制作 为了更好的管理各层，Flash中增加了“图层文件夹”， 可以把完成一个任务或和某个动作相关的同类层放在一个“图 层文件夹”里，这样便于快速查找层和管理层，效率更高。如 图8-48所示。 在时间轴窗口中选中层后，单击鼠标右键弹出菜单，单击 “属性”命令，弹出图8-49所示的属性对话框。在图层的属性 中包括图层的名称、类型、轮廓颜色、图层高度四项内容。
主菜单栏 主工具栏 文档选项卡 时间轴
工具面板 浮动面板 舞台
动作面板 帮助面板 属性面板
图8-1 Flash MX 2004的用户界面
8.2 Flash MX 2004的基本知识
8.2.1 Flash MX 2004的基本概念
1. 帧 在Flash中，帧是构成动画作品的基本单位，它装载了 Flash播放的内容。 关键帧：关键帧是决定一段动画的必要帧。其中可以 放置图形，能播放对象，并可以对所包含的内容进行编辑。 关键帧一般在动画开始点、控制转折点和结束点。 空白关键帧：空白关键帧就是什么内容都没有的关键 帧。启动Flash后，默认状态下，每个层的第一帧，都是空 白关键帧。在动画制作工作区添加了内容后，自动变成关 键帧。 过渡帧：在两个关键帧中间的普通帧被称为过渡帧。 在Flash中，确定了两端的关键帧后，利用命令可以自动计 算添加过渡帧，无须人工添加。
8.2 Flash MX 2004的基本知识
8.2.2 动画的基本概念 2. 计算机动画的分类 (1) 按电脑在动画制作中的作用分类 按电脑在动画制作中的作用分类，可将电脑动画系统分 为两类：电脑辅助动画和造形动画。 (2) 按动画的控制方式分类 根据运动的控制方式不同，可将电脑动画分为关键帧动 画和算法动画。 (3) 从制作原理上分类 从制作原理上分类，动画可简单划分成两大类：逐帧动 画、补间动画。 逐帧动画就是通过更改每一帧中的舞台内容而获得动画 效果，它最适合于每一帧中的图像都在更改而不是仅仅简单 地在舞台中移动的复杂动画。逐帧动画的缺点是太耗费时间 和精力。优点是能最大限度地控制动画的变化细节。
图8-58 添加了引导层的时间轴窗口
8.3 动画制作
8.3.5 引导层运动动画的制作
设计目标 利用引导层运动动画制作一个出现在舞台上方沿着不规则 路径慢慢飘落的花朵，最后在舞台下方消失，实例效果如图859所示。
【例8-5】
图8-59 实例效果
8.3 动画制作
8.3.6 MTV制作基础
Flash MTV已经逐渐被人们熟悉，Flash MTV的制作也从 开始的大量使用位图，制作简单的动画，发展到现在的广泛 使用矢量图甚至手工作图；从以前的生硬呆板，发展到今天 的生动、逼真。但是其中的关键问题依旧还是音乐文件的尺 寸问题，音乐和画面、音乐和歌词的同步问题。 1. 音乐文件的大小 一般导入的音乐文件长度多在3分钟左右，大小也在3～ 6MB之间，比较难以在网络上传输。在Flash MX中在，支持流 行的MP3音频压缩方式，因此可以将波型声音文件（.wav）载 入到Flash中进行编辑，在输出.swf时，会自动完成音频格式 的转换和压缩。
场景名
显示比例 编辑元件 编辑场景
舞台
工作区
图8-2 场景和舞台的主界面
8.2 Flash MX 2004的基本知识
8.2.2 动画的基本概念
1. 计算机动画的概念与原理 所谓动画，简单地说，就是将静止状态下的一幅幅图画 或照片连续地演播出来的技术，具体说来有以下两种说法： ① 动画是一种通过一系列连续的画面来显示运动的技 术，是以一定的播放速度来达到连续运动的效果的。 ② 动画是一系列具有各种物体的动态画面的处理过程， 每一个画面都可以与前一个画面有着微小的变化。 动画的概念已经明确，那么原理就自然清楚了——人的 “视觉原理”。医学证明，人类的视觉系统有视觉暂留的特 性，也就是说，人的眼睛看到对象后在1/24秒内，图像不会 在大脑当中消失，利用这一原理，在前一图像没有消失之前， 如果播放下一图像，自然会给人造成一种连续变化的视觉效 果，电影、电视都是利用了这一原理。
8.3 动画制作
8.3.1 逐帧动画的制作 设计目标 制作导入系列图片的逐帧动画，生成一个连续奔跑的骏 马动画效果，如图8-4所示。
【例8-1】
图8-4 实例效果
8.3 动画制作
8.3.2 运动渐变动画的制作 运动渐变动画是补间动画的一种。通过为对象创建运动 渐变，可以改变对象的位置、大小、旋转或倾斜，做出物 体运动的各种效果。通过设置实例的颜色属性，还可以制 作出丰富的渐变效果，例如实例的淡入淡出效果。 导致运动渐变动画失败的原因有很多，但主要是由于以 下几种原因：第一种为缺少起始帧或终止帧；第二种为起 始帧或终止帧包含多个的对象；第三种为起始帧或终止帧 中包含的对象不是元件实例。 要正确使用运动渐变必须满足以下创作条件： 运动渐变只能作用于元件实例。要对形状、组合、位图 或文本对象应用运动渐变，必须先将这些对象转换为元件。 运动渐变中的元件只能是一对一的渐变，多对一或一对 多均会导致渐变失败。 运动渐变中的元件只能在同一图层。
8.3 动画制作
8.3.4 遮罩动画的制作 设计目标 利用遮罩技术实现探照灯扫描文字的效果，当一束光束扫 过较为昏暗的文字时，光束所到文字部分变亮，如图8-50所 示。 【例8-4】
图8-50 探照灯扫描文字的效果
8.3 动画制作
8.3.5 引导层运动动画的制作 在Flash中有一种专门的图层——引导层，在引导层中 利用一切可以产生曲线的工具绘制一条曲线，再利用属性 面板的设置来自百度文库使它作为运动对象或实体的运动轨迹，在演 播时这条曲线并不出现，可以实现完美效果的曲线运动。 为了让运动的对象能沿着曲线进行运动需要添加引导层 以及引导线。在添加了对象，并设定了开始帧和结束帧， 添加了补间动画后，可以单击时间轴面板中的“添加引导 层”按钮，添加一个引导层，添加成功后本层自动内缩， 变成被引导层，如图8-58所示。
8.2 Flash MX 2004的基本知识
8.2.1 Flash MX 2004的基本概念
5. 场景和舞台 场景是指在当前动画编辑窗口中，编辑动画内容的整个 区域，如图8-2所示。 动画是在场景中被制作完成的，而场景中又包括舞台与 工作区，舞台中显示的动画效果是影片的实际效果，舞台以 外的区域是工作区，最终的影片不会显示工作区中的对象。
8.1 Flash MX 2004简介
8.1.2 Flash MX 2004的用户界面 Flash的界面由几个主要部分组成，最上方的是“主菜单 栏”。“主工具栏”下方是“文档选项卡”；“时间轴”和 “舞台”位于工作界面的中心位置；左边是功能强大的“工具 箱”；多个“面板”围绕在“舞台”的下面和右面，包括常用 的“属性”和“帮助”面板，还有浮动面板，如图8-1所示。
Flash MX 2004是Web设计人员、交互式媒体专业人员进 行设计的理想制作工具。该版本注重于创建、导入和处理多 种类型的媒体（包括音频、视频、位图、矢量、文本和数 据），提供了对Web团队（由设计人员和开发人员组成）成员 之间的工作流程进行优化的项目管理工具。目前，Flash中文 版的最新版本是Flash MX 2004 v7.01，英文版是v7.02。 1. 友好的操作界面 2. 生成的动画文件可以独立播放 3. 流媒体动画 4. 文件体积较小 5. 具有交互式作用的多媒体影片 6. 易用性
8.2 Flash MX 2004的基本知识
8.2.2 动画的基本概念 补间动画是在两个关键帧之间建立渐变的一种动画。补 间动画关键帧的对象是元件的实例、群组体或文字。补间动 画的原理是：在第一个关键帧中设置元件实例、群组体或文 字的属性，然后在第二个关键帧中修改对象的属性，从而在 两帧之间产生动画效果，可以修改的属性包括大小、颜色、 旋转和倾斜、位置、透明度及各种属性组合，如图8-3所示。
8.2 Flash MX 2004的基本知识
8.2.1 Flash MX 2004的基本概念
3. 对象 在Flash中任何被选中的东西，都可以叫做对象。对象被 选中后可以通过设置实现用户要求的变形或运动。如果绘制 了一个圆，并选中这个圆的话，它就是一个对象，可以通过 工具对它进行填充、修改、移动、变形等编辑。 4. 元件、实例和库 元件也被称作符号或图符，是Flash动画的重要组成部 分，元件的主要特性是可以被重复利用，且不会影响影片的 大小。Flash中的所有元件都被归纳在库面板中，可以被随 时调用，十分方便。 Flash文档中的库存储了导入的文件（如视频剪辑、声 音剪辑、位图）、导入的矢量插图以及元件。库是Flash组 织、编辑和管理动画中创建的和使用的各种元件的仓库。
8.3 动画制作
8.3.2 运动渐变动画的制作 设计目标 制作文字动画的广告条来说明自己网站的特点，提升网站 的形象，增加网站的吸引力，动画效果如图8-14所示。 【例8-2】
图8-14 实例效果
8.3 动画制作
8.3.3 形状渐变动画的制作 形变动画是Flash中另一大类基本动画。运动渐变动画要 求运动对象作为一个整体，通过位置、大小、色彩等属性发生 变化来实现效果；而形变动画的对象是打散的对象，也就是说 入库的元件，包括文字也一样，对象被打散后才能实现形变的， 在动画过程中改变的是对象的形状，从一种形状平滑地变化到 另一种形状。例如圆形变成方形的动画效果，如图8-39所示。 形状渐变属性面板如图8-40所示 。