当前位置： >>
flash 元件与影片剪辑
第五讲 元件和实例打印本页随着动画复杂度的提高，必然会出现两种情况：首先是有些元素会重复使用；其次是有些对象会要求有特殊 的同步行为和交互行为。这时，就需要用到 Flash 中的元件，并通过元件来创建实例。 5.1 元件与实例 学习目标 本节学习的概念比较多。&元件&（symbol），又称符号，是一种比较独特的、可重复使用的对象。以元件为 样本，创建出来的对象叫做&实例&。元件的引入使得动画的制作更为简单，动画文档的大小明显减小，播放速度 也显著提高。而库面板则是管理元件的主要工具，每个动画文档都有自己库，存放着各自的元件，就像每个工厂 将材料存放在自己的仓库中一样。 5.1.1 元件的分类 在 Flash 中，元件包括图形、按钮、影片剪辑三类。每个元件都有一个唯一的时间轴和舞台。创建元件时要 选择元件类型，这取决于元件在文档中的工作方式。三类元件的介绍如下： 1. 图形元件 可用于静态图像，并可用来创建连接到主时间轴的可重用动画片段。图形元件与主时间轴同步运行。交互式 控件和声音在图形元件的动画序列中不起作用。 2. 按钮元件 可以创建响应鼠标点击、滑过或其它动作的交互式按钮。可以定义与各种按钮状态关联的图形，然后将动作 指定给按钮实例。 3. 影片剪辑元件 可以创建可重用的动画片段。影片剪辑拥有它们自己的独立于主时间轴的多帧时间轴。可以将影片剪辑看作 是主时间轴内的嵌套时间轴，它们可以包含交互式控件、声音甚至其它影片剪辑实例。也可以将影片剪辑实例放 在按钮元件的时间轴内，以创建动画按钮。 5.1.2 使用库面板 库面板用于存储和组织在 Flash 中所创建的图标以及导入的声音文件。其中，图标由图片、按钮、电影片段 构成。库面板也包括在文件夹中存储的库存项目列表，从中可以看出电影中的一个图标使用的频度，并且可以将 其按照类型排序。 &库&面板的主要操作都在单击右上角的 按钮后打开的弹出菜单中。单击该按钮，弹出菜单。 &库&面板的相关操作包括以下内容。 1. 显示&库&面板 在主菜单中选择&窗口/库&，可以显示或者隐藏&库&面板。 2. 在&库&面板中查看项目 &库&面板中的每个 Flash 文件包括元件、位图和声音文件。当用户在&库&面板中选择项目时，该项目的内容 就出现在窗口上部的预览界面中。如果选定的项目是动画或是声音文件，也可以应用控制器进行预览的控制。 &库&面板的纵栏依次是列表项的名字、类型、在动画文件中使用的次数、链接和上一次修改的时间。可以在 &库&面板中按任何项目排序。单击纵栏项目头，按照字母顺序等进行排列，也可以单击右上角的三角形按钮使项 目按某一列的逆向排序。 3. 使用&库&面板中的文件夹 单击下部的新建文件夹的按钮 ，可以加入一个新的文件夹。当创建新元件时，新元件将出现在当前选定的 文件夹里。如果没选定文件夹，它将出现在&库&面板的最下边，可以用鼠标把它从某个文件夹拖到另一个文件夹 中。5.1.3 创建实例 创建元件之后，可以在文档中任何需要的地方（甚至在其它元件内）创建该元件的实例。&元件&和&实例&的 关系，就是&本质&与&现象&的关系。同一个&本质&可以有不同的&现象&。所以，同一个元件可以有多个外观不同 的实例；在修改元件时，Flash 会更新元件的所有实例；修改实例，不会影响到原来的元件。 下面的简单例子可以帮助我们认识这些关系。 （1）新建 Flash 文档，选择菜单栏&插入/新建元件&命令，在打开的&创建新元件&对话框中选择&图形&单选 项。 （2）此时时间轴已经不再是原来舞台的时间轴，而变成了&元件 1&的时间轴，这点可以从舞台上方的提示栏 看出，&场景 1&后面多了&元件 1&。 （3）用多角星形工具 在舞台中绘制一个多边形，此时可以看到&库&面板中多出了&元件 1&一项（如果库面 板没有打开，则选择菜单栏的&窗口/库&命令将其打开）。 （4）单击&场景 1&或者其前面的箭头 按钮，返回到原来的舞台，可以看到舞台上什么都没有。 （5）用鼠标按住并拖拽库中的&元件 1&到舞台上，连续拖拽 3 个。这 3 个多边形便称之为&元件 1&的实例。 （6）对舞台上的第 1 个多边形用任意变形工具 进行变形，对第 2 个多边形先用任意变形工具 进行变形， 然后用选择工具 选中，并打开&属性&面板。选择&颜色&下拉列表的&高级&选项。 （7）单击旁边的&设置&按钮，在打开的&高级效果&对话框中进行设置，将该对象变成绿色、半透明。 （8）此时可以看到，舞台中前两个多边形的变化并不影响库中&元件 1&，也不影响第 3 个实例。 （9）双击&库&面板中的&元件 1&切换至元件编辑状态，用选择工具 将多边形进行修改。 （10）此时退出元件编辑模式，再回到舞台上，可以看到 3 个实例均发生了变化。 5.1.4 编辑元件的方法 使用选择工具双击舞台上的实例，或者右击实例，在弹出的菜单中选择&在当前位置编辑&即可。这时就进入 了元件编辑模式，而其它对象以灰显方式出现。正在编辑的元件名称显示在舞台上方的编辑栏内，位于当前场景 名称的右侧。 舞台上的狼是一个元件实例。使用选择工具双击它之后，就进入了编辑模式，狼周围的树林颜色变淡了，同 时在时间轴上方的&场景 1&右边出现了&狼&标签，这就表示当前是在&场景 1&中编辑&狼&元件。 此外，还可以使用&在新窗口中编辑&命令在一个单独的窗口中编辑元件。在单独的窗口中编辑元件，就可以 同时看到该元件和主时间轴。正在编辑的元件名称会显示在舞台上方的编辑栏内。 5.2 使用图形元件 学习目标 图形元件是比较简单的元件类型。本节的学习目的，就是掌握图形元件实例的颜色和循环方式设置。 5.2.1 设置元件实例的颜色 在前面说过，修改实例并不会影响原来的元件。在这里看看如何设置图形元件的颜色设置。实际上所有元件 的颜色设置方法是一样的。学习了图形元件的颜色设置，读者可以用同样的方法在以后设置影片剪辑和按钮。 首先看舞台上的一个图形元件实例，例如一个人物。使用选择工具单击它，然后使用菜单&窗口/属性/属性& 打开属性面板。可以看到在属性面板的右半部分有 &颜色&下拉菜单。 在下拉菜单中，如果选择&无&，那么不应用任何颜色效果。除此之外，可以选择四种颜色效果。 1. 亮度 选择了&亮度&之后，可以修改图形元件的亮度。亮度为 0 表示无效果，100%表示最亮，-100%表示。 2. 色调 色调的设置效果，是给整个图形对象加上颜色偏移的效果。例如想让整个人物变绿，那么可以将偏移颜色 设 置为绿色，再将其后面的偏移值设置成一个正数，那么舞台上的图形对象就带上绿色效果了。 3. 不透明度（Alpha） Alpha 值的作用是控制对象的不透明度。当 Alpha 值为 100 的时候，对象是完全不透明的，没有任何效果；当 Alpha 值小于 100 而大于 0 的时候，对象是半透明的；当 Alpha 值等于 0 的时候，对象就变成完全透明的，看 不见了。 4. 高级 选择了&高级&项之后，就会在后面出现&设置&按钮。单击&设置&按钮，将会进行高级设置。 在这里简单说一下计算的方法。假设有一个颜色为&#CCFF33&，Alpha 值为 90 的点，应用了图中的设置，那 么应该变成什么样子？可以分 4 步： （1）先计算红色成分。原来的红色成分是十六进制的 CC，也就是十进制的 204，按图中的换算规则是乘以 80%，取整后为 163，也就是十六进制的 A3。 （2）再计算绿色成分。原来的绿色成分是十六进制的 FF，也就是十进制的 255，按图中的换算规则是乘以 50%再加上 30，取整后为 158，也就是十六进制的 9E。 （3）然后计算蓝色成分。原来的蓝色成分是十六进制的 33，也就是十进制的 51，按图中的换算规则是乘以 20%再加上负 80，取整后为负 70。但是颜色值的取值范围是 0～255，所以只能取最小值 0。 （4）接下来计算 Alpha 值。原来的 Alpha 值是 90，这本来就是十进制的，按图中的换算规则是乘以 80%再 加上 30，结果是 102。但是 Alpha 值的取值范围是 0～100，所以只能取最大值 100。 （5）最后综合上面的计算结果，可以得到应用效果后的颜色值为&#A39E00&，Alpha 值为 100。 5.2.2 设置图形元件的循环方式 选中图形元件之后，可以在属性面板的中部设置图形元件的循环方式，共有三种循环方式供选择。在后面的 &第一帧&文本框中，可以设置动画的起始帧。 各种循环方式的特点如下： 循环：播放到最后一帧之后，又回到开头继续播放。 播放一次：播放到最后一帧之后，就静止不动了。 单帧：只显示一帧。 5.2.3 操作实例：旋转的风车 上机实践 本实例是在制作图形元件的基础上，掌握如何设置图形元件的播放。 （1）首先创建一个新文档，文档大小保持默认状态即可。使用&线条工具& 在舞台中绘制出一片风车叶子的 轮廓。在绘制线条时启用工具箱中的&贴紧至对象& 功能，可以使绘制出来的线条处于封合状态。 （2）使用&颜料桶工具& 对舞台上的图形进行颜色填充，填充颜色可以根据个人爱好自由设定，这里填充的 是绿色和深绿色。 （3）使用&任意变形工具& 选中舞台中的图形，然后将变形中心点的位置拖拽到图形左下角的位置上。 （4）打开&变形&面板，将旋转的角度设置为 90 度，点击 3 次&复制并应用变形&按钮，制作出风车的其余 3 个叶片。 （5）接下来使用&选择工具& 选中整个风车叶片，按键盘上的&F8&功能键，准备将舞台上的风车图形转换为 影片剪辑元件。 （6）按了&F8&功能键之后，会弹出&转换为元件&对话框，设置元件名称为&风车&，元件类型选择为&图形&， 最后单击&确定&按钮，将舞台上的图形转换为图形元件。 （7）将舞台上的风车复制两次，并适当调整大小。 （8）使用绘图工具绘制风车的柄。 （9）这时三架风车的扇页位置是完全相同的。但是在现实中，很少出现多个风车扇页位置一致的现象。这 时可以进行调整。选中左边的风车扇页，在属性面板中将第一帧设置为 3。 （10）将右边风车扇页的第一帧设置为 2。这时风车的扇页错落有致。 （11）最后还有很关键的一步。在主时间轴中，单击选中第 20 帧，按 F5 快捷键插入帧。如果少了这一步， 那么主时间轴中只有一帧，图形元件是与时间轴同步的，也只能显示一帧了。 （12）至此动画制作完成，保存并测试动画。5.3 使用影片剪辑 学习目标 影片剪辑作为 Flash 元件的一个重要类型，在动画制作中一直发挥着不可替代的作用，合理地运用影片剪辑 可以制作出很多奇特的效果。此外，影片剪辑实例的颜色设置与图形实例是相同的，在此不再赘述。 5.3.1 创建影片剪辑 要创建影片剪辑，可以有两种方法： 1. 创建空白的影片剪辑 使用菜单命令&插入/新建元件&，可以创建一个空白的元件。在&创建新元件&对话框中设置元件的名称，并 将元件的行为设置为&影片剪辑&，单击&确定&按钮就可以了。 2. 将舞台上的对象转换为影片剪辑 使用选择工具选中舞台上的对象，使用菜单&修改/转换为元件&或者快捷键 F8，在对话框中设置元件的名称， 并将元件的行为设置为&影片剪辑&，然后设置注册点位置，再单击&确定&按钮就可以了。 在这里说一下注册点。&注册点&就是转换为元件之后的元件坐标原点。例如将注册点位置设置为&右上&，那 么转换为元件之后，元件的坐标原点将位于被选中的对象的右上方。 5.3.2 操作实例：蜡烛 上机实践 元件在动画制作过程中是不可缺少的元素，不仅可以反复使用它，而且还可以对它进行属性修改等。这一实 例就通过制作一个燃烧的蜡烛效果，初步认识元件的作用。 （1）创建一个尺寸为 400×300 的新文档，文档的背景颜色为黑色。这里将背景颜色设置为黑色是为了衬托 出蜡烛的光芒。 （2）在舞台中绘制一个渐变矩形，在矩形的上方再绘制一个渐变椭圆，对其进行变形后制作出蜡烛图形。 由于前面已经深入的讲解过图形的绘制方法，这里就不再细述。 （3）绘制好蜡烛图形后，现在来制作晃动的灯心效果。执行菜单栏&插入/新建元件&命令，此时会弹出&创 建新元件&对话框。 （4）在弹出的&创建新元件&对话框中，名称指的是元件的名称，这里命名为&灯心&；类型指的是元件类型， 这里选择为&影片剪辑&。 （5）单击&确定&按钮，进入元件的编辑状态。使用工具箱中的&椭圆工具& 在舞台上绘制一个线性渐变椭圆， 再结合&选择工具& 调节渐变椭圆的形状，调整完成后的图形作为灯心效果。灯心的渐变颜色由下而上依次为黄 色&#FFFF00&到桔红色&#FF6600&，再到深红色&#D22B00&的渐变。 （6）在时间轴的第 2、3、4、5 帧上按&F6&功能键插入关键帧，然后在这几帧所对应的舞台上，使用&选择 工具& 分别适当调整灯心顶端在不同帧上的不同形状，制作出火苗因为燃烧而产生晃动的动画效果。 （7）灯心的效果就制作到此，接下来执行菜单栏&插入/新建元件&命令，此时会弹出&创建新元件&对话框。 （8）在该对话框中，将元件名称命名为&光晕&，元件类型选择为&影片剪辑&元件。 （9）单击&确定&按钮，进行&光晕&元件的编辑区。在舞台上绘制一个放射状渐变椭圆，渐变颜色同第 5 步 骤中的相同。 （10）选中舞台上的渐变椭圆，执行菜单栏&修改/形状/柔化填充边缘&命令，此时&柔化填充边缘&对话框将 被打开。在该对话框中将距离和步骤数均设置为 10，方向为默认的&扩展&。 （11）单击&确定&按钮完成设置。 （12）在时间轴的第 2 到 5 帧上分别按下&F6&功能键插入关键帧，然后使用键盘上的方向键移动每帧所对应 的光晕图形。每帧上光晕移动的距离只需要相差 1 到 2 个像素即可，以强化火焰燃烧时的动感。 （13）完成光晕的动画制作后，点击时间轴上的&场景 1&按钮，回到主场景中。执行菜单栏&窗口/库&命令， 此时会将&库&面板打开。 （14）在&库&面板中可以看到刚才创建的&灯心&和&光晕&两个影片剪辑元件，使用&选择工具& 直接将&光晕&影片剪辑元件拖拽至舞台中，并放置于蜡烛之上。 （15）接着再将&灯心&影片剪辑元件拖拽至舞台上，同样放置于蜡烛之上。再使用&选择工具& 选中舞台上 的&光晕&元件，将该元件向上移动，构成一幅完整的蜡烛图像。 （16）最后使用&Ctrl + Enter&预览动画，一根正在燃烧的蜡烛动画就制作完成。 5.3.3 操作实例：一群小鸟 上机实践 在上一章的&飞行的小鸟&实例中，已经初步认识了影片剪辑元件的作用，本例将在它的基础上继续了解元件 的功能。 （1）打开第 5 章中制作过的&飞行的小鸟&实例，然后执行菜单栏&文件/另存为&命令，将该文档另存为&一 群小鸟&。 （2）将文件另存之后，在时间轴上锁定图层 2，点击&插入图层&按钮创建一个新的图层 3，在该图层的第 3 帧上按&F6&功能键插入关键帧。 （3）执行菜单栏&窗口/库&命令，此时会打开&库&面板。使用&选择工具& 直接将&库&面板中的&元件 1&拖拽 至舞台上。 （4）使用&任意变形工具& 适当缩小舞台上的小鸟图形，缩放完成后，将小鸟图形放置在舞台中的右侧边缘 处。 （5）在第 3 帧上单击鼠标右键，在弹出的菜单中选择&创建补间动画&命令，创建一个补间动作。再在第 25 帧处按&F6&功能键插入一个关键帧，同样在该帧上单击鼠标右键，在弹出的菜单中选择&删除补间&命令，删除第 25 帧以后的补间动作。 （6）继续选中第 25 帧，然后在舞台中将小鸟图形移动至舞台的最左侧边缘。这样运用同一个元件创建的第 二个运动动画就制作完成。 （7）分别在时间轴的三个图层的第 40 帧上按&F5&功能键插入帧，再在图层 2 的第 30 帧上单击鼠标右键， 在弹出的菜单中选择&删除补间&命令，删除第 30 帧以后的补间动作。 （8）锁定图层 3，创建一个新的图层 4，在该图层的第 10 帧上按&F6&功能键插入一个关键帧。 （9）继续选中第 10 帧，再次将&元件 1&从&库&面板中拖拽至舞台上，将小鸟图形放置在舞台的右侧边缘的 任意位置。 （10）在第 10 帧上单击鼠标右键，在弹出的菜单中选择&创建补间动画&命令，创建一个补间动作。再在第 40 帧处按&F6&功能键插入一个关键帧。 （11）创建好补间动作之后，继续选中第 40 帧，在舞台中将小鸟移动到舞台左侧边缘的任意位置上。 （12）最后使用&Ctrl + Enter&预览动画，一群小鸟从天空飞翔而过的动画效果就制作完成。当然还可以用 相同的方法创建多个运动动画，使在天空中飞翔的小鸟增多。 5.3.4 操作实例：海里的鱼 上机实践 在前面的实例学习中，已经知道了元件可以反复使用。在这一实例中将学习如何修改元件的颜色属性。 （1）打开上一章制作过的&游动的小鱼&实例，本实例将在此例的基础上进行制作。执行菜单栏&文件/另存 为&命令，将该实例另存为&海里的鱼&。 （2）将文件另存之后，在时间轴上选择图层 1，即选中小鱼动画所在的图层。选中图层 1 后，该层时间轴上 的所有帧都处于选中状态，然后在该层的时间轴上单击鼠标右键，在弹出的菜单中选择&剪切帧&命令，准备将该 层上的整个运动动画剪切到新的位置。 （3）执行了&剪切帧&命令之后，执行菜单栏&插入/新建元件&命令，此时会弹出&创建新元件&对话框，在该 对话框中，名称保持默认即可，元件类型选择为&影片剪辑&。 （4）单击&确定&按钮，进入新创建的元件编辑区。在元件编辑状态下，点击时间轴的第 1 帧后，单击鼠标 右键，在弹出的菜单中选择&粘贴帧&命令，这样就将主场景中的整个动画粘贴到了元件 1 中。 （5）完成后点击时间轴上的&场景 1&按钮，回到主场景中。观察时间轴上的图层 1，此时该层上的帧已被变成空白帧。 （6）执行菜单栏&窗口/库&命令，此时会弹出&库&面板，在该面板下可以看到创建的影片剪辑&元件 1&已经 放置在其中。 （7）使用&选择工具& 直接拖拽&元件 1&至舞台中，将它放置于舞台右侧边缘的任意位置上。 （8）锁定图层 1，点击&插入图层&按钮创建一个新的图层 3。在该图层的第 5 帧上按&F6&功能键插入一个关 键帧，然后从&库&面板中将&元件 1&拖拽至舞台右侧的任意位置上。 （9）使用工具箱中的&任意变形工具& 适当缩小小鱼图形的大小，然后使用&选择工具& 选中该元件。打开& 滤镜&面板，点击&添加滤镜&按钮，在弹出的列表中选择&调整颜色&命令。 （10）在点击了&调整颜色&对话框后，就进入了&调整颜色&属性对话框。在该属性框中适当调整&饱和度&和 &色相&的值。 一边调整一边观察舞台上选中的小鱼的颜色变化， 这里&饱和度&和&色相&的值的设定没有固定约束， 只要和图层 1 中小鱼的颜色不一致就可以了。 （11）接下来锁定图层 3，创建一个新的图层 4，在该图层的第 3 帧上按&F6&功能键插入关键帧。然后从&库 &面板中将&元件 1&拖拽至舞台的任意位置。 （12）使用&选择工具& 选中图层 4 中的小鱼元件，然后打开&滤镜&面板，点击&添加滤镜&按钮，在弹出的 菜单中选择&调整颜色&命令。在打开的&调整颜色&属性面板中，适当调整图像&饱和度&和&色相&值，使该图层中 的小鱼颜色与前两个图层中小鱼的颜色有所区别。 （13）应用相同的方法，可以在时间轴上创建若干图层，在不同图层的不同帧上放置&元件 1&，然后对小鱼 图形进行任意的缩放和颜色修改。这里再添加两个图层。 （14）最后使用&Ctrl + Enter&预览动画。 5.3.5 使用滤镜 使用滤镜，可以为文本、按钮和影片剪辑增添有趣的视觉效果，并且经常用于将投影、模糊、发光和斜角应 用于图形元素。Flash 所独有的一个功能是您可以使用补间动画让应用的滤镜活动起来。例如，如果创建一个具 有投影的球（即球体），可以在时间轴中将投影位置从起始帧移到终止帧，来模拟光源从对象一侧移到另一侧的 效果。 下面是一个简单的小例子。 （1）使用文本工具，在舞台上创建一个静态文本，键入文字&闪动天下&，并将文本颜色设置为桔红色。使 用选择工具单击文本，将其选中。 （2）使用菜单&窗口/属性/滤镜&，打开滤镜面板。 （3）在这里先为文字添加凸起的斜角效果。单击&添加滤镜&按钮 ，在弹出的菜单中选择&斜角&。 （4）这时可以看到在滤镜面板左端的滤镜列表中出现了&斜角&滤镜条目。单击&斜角&滤镜条目，可以显示 出它的详细参数。 每个滤镜都可以设置&品质&。品质越高，滤镜效果就越细腻，但是系统需求就越高。此外，对于&斜角&滤镜， 可以进行以下设置： 首先从&类型&弹出菜单上，选择要应用到对象的斜角类型。可以选择内斜角、外斜角或者完全斜角。 设置&模糊 X&和&模糊 Y&的值，设置斜角的宽度和高度。 选择斜角的阴影和加亮颜色。在这里分别设置为暗桔黄色和亮桔黄色。一般要求与文本本身的颜色是同一个 色系的，否则看起来会比较怪异。 设置&强度&的值，设置斜角的不透明度。 调整&角度&值，更改斜边投下的阴影角度。 设置&距离&的值，定义斜角的宽度。 选中&挖空&复选框可以从视觉上隐藏源对象，并在挖空图像上只显示斜角。 （5）然后，还希望文字从舞台上&漂浮&起来，这就需要添加投影效果。使用同样的方法，再添加一个&投影 &滤镜。以进行设置的内容如下： 调整&模糊 X&和&模糊 Y&滑块，设置投影的宽度和高度。拖动&距离&滑块，设置阴影与对象之间的距离。 单击&颜色&框，打开&颜色&弹出窗口，然后设置阴影颜色。 拖动&强度&滑块，设置阴影暗度。数值越大，阴影就越暗。 对于&角度&，输入一个值来设置阴影的角度。 选中&挖空&复选框从视觉上隐藏源对象，并在挖空图像上只显示投影。 选择&内侧阴影&复选框，在对象边界内应用阴影。 选中&隐藏对象&复选框隐藏对象，并只显示其阴影。使用&隐藏对象&选项可以更轻松地创建逼真的阴影。 选择投影的质量级别。把质量级别设置为&高&就近似于高斯模糊。建议把质量级别设置为&低&，以实现最佳 的回放性能。 5.4 使用按钮 学习目标 按钮是四帧的交互对象。在 Flash 的发展过程中，按钮是最早用于交互控制的元素。本节学习的是按钮的使 用方法。此外，按钮的颜色设置与图形实例是相同的，在此不再赘述。 5.4.1 按钮的结构 创建按钮的时候，Flash 会创建一个四帧的时间轴。前三帧显示按钮的三种可能状态；第四帧定义按钮的活 动区域。时间轴实际上并不播放，它只是对指针运动和动作做出反应，跳到相应的帧。具体地说，按钮元件的时 间轴上的每一帧都有一个特定的功能： 第一帧是弹起状态，代表指针没有经过按钮时该按钮的状态。 第二帧是指针经过状态，代表当指针滑过按钮时，该按钮的外观。 第三帧是按下状态，代表单击按钮时，该按钮的外观。 第四帧是&点击&状态，定义响应鼠标单击的区域。此区域在 SWF 文件中是不可见的。 复杂按钮的时间轴可以包含多个图层。每个图层都可以包含 4 个帧。 值得注意的是，如果按钮上的某个帧是缺失的（注意，不是空白关键帧），那么 Flash 将会在该帧插入普通 帧，所以该帧的内容将与它前面的关键帧相同。 5.4.2 操作实例：电源开关 上机实践 现在来体验一下按钮元件的制作方法。例如这个实例中绘制的开关，初始状态下开关为关闭状态，亮绿灯； 当鼠标点击开关后，启动电源，开关显示为红灯状态。 （1）创建好一个新文档后，执行菜单栏&修改/文档&命令，在打开的&文档属性&对话框中将文档尺寸设置为 400×300，其余选项保持不变。 （2）文档属性修改之后，执行菜单栏&插入/新建元件&命令，此时会弹出&创建新元件&对话框，在该话框中 保持元件名称为默认&元件 1&，元件类型选择为&按钮&。 （3）单击&确定&按钮后，进行按钮元件的编辑区。选择工具箱中的&矩形工具& ，将&笔触颜色& 设置为黑 色，&填充色& 设置为灰色&#CCCCCC&。完成后在舞台中绘制一个灰色矩形。 （4）用鼠标点击时间轴的&按下&帧，然后按&F5&功能键插入帧，使该矩形在这三帧中保持不变。 （5）锁定图层 1，接着点击时间轴上的&插入图层&按钮，创建一个新的图层 2。然后选择工具箱中的&矩形 工具& ，并将填充色设置为无，设置完成后，在该图层上绘制一个无填充矩形。 （6）使用&线条工具& 在矩形的右侧绘制一条直线，将矩形分割成两部分，绘制直线时在工具箱中启用&贴 紧至对象& 功能，以便使绘制出来的直线两端与矩形边缘封合。 （7）选择工具箱中的&颜料桶工具& ，然后打开&混色器&面板。在该面板下将填充类型选择为线性填充，填 充颜色设置为偏白色&#E6E6E6&到灰色&#707070&的渐变。 （8）设置完成后在舞台中对矩形的左右两个部分分别进行颜色填充，它将作为开关的初始状态。 （9）在时间轴的&按下&帧上按&F6&功能键插入一个关键帧，此时舞台上的图形已处于选中状态。执行菜单栏&修改/变形/水平翻转&命令，翻转按钮图形。翻转后的图形将作为开关被按下后的状态。 （10）锁定图层 2，点击&插入图层&按钮，创建一个新的图层 3。在该图层上绘制一个较小的矩形，矩形填 充颜色设置为绿色。将该矩形放置于开关图形的正中间，作为开关未被使用时的颜色状态。 （11）在图层 3 的&按下&帧上按&F6&功能键插入一个关键帧，然后在舞台中将矩形的颜色修改为红色，作为 开关被启动时的颜色状态。 （12）通过上述步骤的操作，按钮元件的制作就完成了。点击时间轴上的&场景 1&按钮，回到主场景中，将 按钮元件&元件 1&从库面板中拖拽至舞台的中央。使用&Ctrl + Enter&组合键预览最后的按钮效果。 本章要点 1．元件、实例与库 2．使用影片剪辑元件 3．使用按钮元件
更多搜索：
All rights reserved Powered by
文档资料库内容来自网络，如有侵犯请联系客服。Flash技巧之如何掌握遮罩效果动画
　　问题1：遮罩层与被遮罩层是什么关系？
　　解决思路
了解遮罩层和被遮罩层的关系，对于我们掌握遮罩动画是非常关键的。遮罩动画在Flash技术里面起到了重要作用，一些非常优秀的效果就是通过遮罩动画来实现的。例如：著名的“水面涟漪”效果，就是通过遮罩完成的，非常逼真。下面我们就通过不同的制作方法了解遮罩的原理，在实践中领会遮罩的奥妙。
　　具体步骤
1、运行Flash MX 2004，属性默认。
2、单击【文件】|【导入】|【导入到舞台】命令，导入一幅位图图片，并调整适当尺寸。
3、更改图层1为“闪吧桌面”，并锁定；
4、新建图层2命名为“遮罩层”，在遮罩层的第1帧单击文本工具键入“FLASH8.NET”，颜色黑色。
5、单击“遮罩层”选择右键菜单中的【遮罩层】命令，把这个普通图层转换为遮罩层。如图2.1.19所示。
2.1.4-1.fla
——如果用文字作遮罩层的话，尽量选用线条比较粗壮的字体，这样才能够更好的表现遮罩效果。
——◎区分遮罩层和被遮罩层的标准就是你想要显现的形状的图层就是遮罩层。例如在上例中，想要显示的是
“FLASH8.NET”的字形，所以就把这个图层确定为遮罩层。
◎对于遮罩层的颜色对于最后的遮罩效果来说是没有作用的。
——除了利用移动渐变动画来作遮罩效果以外，我们还可以利用形状渐变动画来制作遮罩效果。
——要想理解遮罩的原理，我们就要通过反复的实践来了解。朋友们不妨把上例中的遮罩层和被遮罩层换一下位置，看看有什么效果？
析——遮罩的原理很简单，但是往往初学的朋友对这个道理很难理解。我们不要先研究复杂的遮罩效果，从上例中我们就清晰地了解了遮罩的原理。综合利用这个原理，我们就可以制作出炫目的效果。
　　特别提示
遮罩效果的实现最关键在于创作者要区分清楚遮罩层和被遮罩层的关系。弄不清遮罩层的关系，头脑中就不会有这方面的想象，从而使自己的创作源泉干涸。通过简单遮罩效果的反复实践，清楚这两者之间的关系，为我们以后的FLASH创作打好坚实的基础。
　　特别说明
上例制作动态遮罩效果的时候把位图图片转换为图形元件的原因是，此图片是经过缩小的，所以如果不转为元件的话，做移动渐变动画就会有错误，这也是我们在制作过程中应该注意到的。除了文档可以作遮罩效果以外，我们还可以利用图形来制作这个效果。
◎一个遮罩层可以遮罩两个或者更多的层吗？
对于这个问题的回答是肯定的。一个遮罩层是可以对两个或更多的图层进行遮罩的。如图2.1.21所示。
遮罩两个图层
此效果中就是遮罩了两个图层，一个图层从左向右移动，另一个图层由右向左移动。如图2.1.22所示。
2.1.4-2.fla。
◎可不可以把动画效果制作在遮罩层里面？
这个效果就是把移动动画效果制作在遮罩层里面的，如图2.1.23所示。
2.1.4-3.fla。
◎可以用影片剪辑制作遮罩层吗？
影片剪辑的特点是独立与时间线运行，这样的特性可以制作遮罩层吗？我们通过实践得知，影片剪辑是可以制作遮罩层的。如图2.1.24所示。
利用影片剪辑制作遮罩层
请参考源文件2.1.4-4.fla。
　　问题2：半透明的遮罩层遮罩图片以后可以实现半透明的遮罩效果吗？
　　解决思路
这个问题问得非常好，因为根据遮罩层的特点，它是显示这个图层内形状的，对于这个形状里面的填充颜色它是不承认的，所以按照正常的制作思路是无法实现的。但是我们可以通过改变遮罩的另一个关键图层---被遮罩层的透明度来实现这个效果。
　　具体步骤
1、运行Flash MX 2004，文档属性默认。
2、单击文本工具在舞台中键入“《专家门诊》—清华大学出版社”，并分离使之成为矢量图形，设置混色器颜色，线性填充，左边黑色透明100%，右边黑色透明0%。如图2.1.25所示。
半透明文字遮罩效果
请参考源文件2.1.4-5.fla
如何制作出具有透明感的遮罩效果呢？我们把思维方式反过来，遮罩层的文字我们不进行改变，把被遮罩层的透明度进行调整，看看能否实现我们想要的效果。
新建一个Flash
MX 2004文档，属性默认。
9、把图层1命名为“文字”，同样输入上述的文字，转化为图形元件。
10、新建图层2，命名为“透明渐变”。在这个图层里面绘制一个从左至右逐渐渐变的矩形，朋友们可以参考上面的步骤。
11、在文字层创建遮罩效果。如图2.1.28所示。
2.1.4-6.fla
——当遮罩层与被遮罩层不对应的时候，在场景中是看不到遮罩层的形状的。
——因为遮罩层显露的是被遮罩层的内容，所以才可以实现这个效果。
——上一例中制作的时候渐显的遮罩效果，朋友们可以把被遮罩层的矩形元件反转过来，制作一个逐渐消失的遮罩效果。
析——这种效果的实现其实和上一个问题的知识没有区别，只是增加了透明度，原理都是同样的。
此例中的遮罩效果在Flash文字动画中经常可以看到，利用被遮罩层的速度、节奏的改变，在视觉上给人以冲击。从另一个角度来讲，这种效果也打破了文字渐显移动动画的局限性。
　　特别说明
遮罩MC的效果
下面是把“遮罩mc”拖动到舞台中，并创建遮罩效果。如图2.1.33所示。
嵌套遮罩效果
最终显露的遮罩效果只是场景中的效果。请参考一下源文件2.1.4-8。