第二章 Flash动画的枚举.doc

我们共同的flash 课件家园第二章 Flash动画的枚举本章主要以最简单的动画形式，来说明动画形成的原理和操作过程，通过对Flash所能形成的动画进行枚举，使广大学友清楚知道Flash能做哪些动画，制作这些动画需要哪些前提，以及如何去实现的问题。在以后的创作中，可以根据实际情况，选择某一种动画形式，实现你心中的动画效果。任何复杂的动画都是运用这些最简单的动画组合而形成的，也是在这些动画的灵活应用上形成的。本章还要通过动画制作过程，慢慢体会如下概念：时间轴、图层、帧、矢量图形、影片剪辑元件、按钮元件、图形元件，以及它们之间的联系。这是学习Flash至关重要的一点，只有充分的理解和运用这些概念以及对它们的操作，才能真正的实现动手创作，而不是只会模仿，碰到实际问题的时候就一筹莫展，毫无头续。在Flash动画制作的过程中，只有以下四种对象能形成动画，因此，在制作动画之前，我们首先要将形成动画的对象转换为如下对象：1. 矢量对象2. 图形对象3. 影片剪辑对象4. 按钮对象除了上面四种对象外，还有以下四种动画的实现形式。虽然形式不同，但动画对象必须是上面四种对象中的一种。1. 引导线动画2. 遮罩动画3. 逐帧动画4. Action(脚本程序)动画第一节对象的认识和转换图2.1.012.1.1 矢量对象矢量对象(矢量图形)是由绘画工具所绘制出来的图形，它包括线条和填充两部分。如图2.1.01为绘图工具。这里有个特例就是文字工具，使用文字工具输入文字，这些文字是一个文本对象，不是矢量对象，但是多次按快捷键“Ctrl+B”打散后，它就变成了矢量对象。因此，我们可以得出这样的结论：只要是由绘图工具绘出的图形，不管它被转换成何种对象，只要多次按“Ctrl+B”打散后，最终都能将其还原为矢量对象。图2.1.02实例一 组合对象转换为矢量对象实例源文件：光盘：实例与视频第二章第一节实例一王字.fla实例效果：立体文字的制作，其中正面颜色为绿色，上面颜色为黑色，左侧面颜色为紫色，如图2.1.02操作步骤： 用“文本工具”在编辑区中输入一个“王”字，用“选择工具”选定这个王字，打开“属性”面板，将“王”字的字体设置为黑体、字号为96、颜色为绿色并加粗，设置如图2.1.03所示。图2.1.03 用“选择工具”选定这个王字，按快捷键“Ctrl+B”打散。打散后，王字的状态由文字框变成了颗粒状，表示已经是矢量状态了。 取消选定“王”字，用“墨水瓶工具”给“王”字加上线条。打散的目的是为了给文字加上边线。 用“选择工具”选定这个“王”字，按快捷键“Ctrl+G”，将王字组合成一个对象，按快捷键“Ctrl+D”重制一个“王”字。将两个“王”字移动到如图2.1.04的图示(1)所示的层叠位置。移动位置的目的是为了让文字产生立体感。 用“选择工具”选定这两个“王”字，按快捷键“Ctrl+B”打散。 选定“线条工具”，并选定“线条工具”的附加工具“贴紧至对象”，将两个“王”字的对应角处用线条相连，如图2.1.04的图示(2)所示。连接完后，将填充部分和多余的线条删除，如图2.1.04的图示(3)所示。图2.1.04 用“颜料桶工具”给“王”字的正面、上面、左面分别填充绿色、黑色、紫色。 选定“选择工具”，将鼠标移动至“王”字的线条上，双击选定所有线条，按“Delete”删除。 用“选择工具”选定这个立体的“王”字，按快捷键“Ctrl+G”组合成一个对象，最终效果如图2.1.02所示。总结：本例主要目的是学习将文字打散成矢量对象、“墨水瓶工具”的用法、“贴紧至对象”工具的用法、用“颜料桶工具”向一个封闭区域填充颜色、体会“Ctrl+G”组合和“Ctrl+B”打散的用法。如果用绘图工具绘制出的图形，经过组合后，那么它就不是矢量对象了，必须经过打散后才能转换为矢量对象。第二节矢量对象动画制作第一节我们讲解了矢量对象、图形对象、影片剪辑对象、按钮对象这四种对象的转换，接下来第二节、第三节、第四节我们要讲解如何利用这四种对象制作动画。动画的制作离不开“图层”、“帧”和“编辑区”这三部分，理解这三者之间的联系是学好动画制作的关键。在第一章中，我们已经了解了图层操作面板和时间轴操作面板。在本章中，主要掌握如下图层操作：1. 如何选定一图层？2. 如何更改图层名称？3. 如何新增图层？4. 如何新增引导层？5. 如何删除图层？6. 如何锁定一图层或者所有图层？7. 如何显示/隐藏图层？8. 图层遮罩效果的应用。9. 图层与动画的关系？图2.2.01在本章中主要掌握如下帧操作：1. 什么是关键帧、空白关键帧、过渡帧？2. 帧与编辑区有何联系？3. 如何插入关键帧？4. 如何插入空白关键帧？5. 如何插入过渡帧？6. 过渡帧的作用是什么？7. 如何选定单帧？8. 如何选定多帧？9. 如何移动帧？10. 如何复制与粘贴帧？11. 如何翻转帧？12. 动画形成的实质是什么？在以下的动画制作过程中，通过实例逐步解决上面所提出的问题，当你能很好的解决上面的问题时候，在你的脑海中也就出现动画制作的轮廓了。2.2.1 位置变化实例一 实例效果：光盘: 实例与视频第二章第二节实例一位置变化.swf操作步骤：一、设置场景 启动Flash CS3，新建一个Flash ActionScript2.0文档。 文档属性设置：打开文档属性面板，如图2.2.02所示。设置帧频为12、背景为白色、大小设置为800600像素。注意：在以后的实例中，如果没特别要求，那么场景设置都按图2.2.02的处显示的内容进行设置。同时，场景设置这步操作将不会在以后的实例中出现。图2.2.02二、动画制作过程 鼠标双击“图层1”处，出现光标，如图2.2.03的图示(1)所示，将图层命名为“位置移动”，如图2.2.03的图示(2)所示。图2.2.03图2.2.04 先选取工具栏中的“矩形工具”，然后选择“笔触颜色“为无颜色；选择“填充颜色”为红色；取消选定“矩形工具”的附加工具“贴紧至对象”和“对象绘制”，工具栏的设置如图2.2.04所示。在后续的绘图操作时，一律取消“对象绘制”这个选定，在这里做一个统一规定。 先选定“位置移动”图层的第1帧，如图2.2.05的图示(1)所示；然后在编辑区内画一个矩形，如图2.2.05的图示(2)所示；用“选择工具”将这个矩形移动到编辑区的左边，如图2.2.05的图示(3)所示。图2.2.05 用鼠标选定“位置移动”图层的第25帧，然后按F6键，插入一个关键帧，如图2.2.06的图示(1)所示；用“选择工具”选定第25帧，将此帧上编辑区里的矩形移动到编辑区的右边，如图2.2.06的图示(2)所示。图2.2.06此时，观察“位置移动”图层的第1帧上的矩形与第25帧上的矩形，我们可以发现，这两帧上的矩形在编辑区的位置是不同的，第1帧的矩形在编辑区的左边，第25帧的矩形在编辑区的右边。如图2.2.07所示。图2.2.07 用鼠标选定“位置移动”图层的第1帧，在第1帧上单击鼠标右键，弹出如图2.2.08的图示(1)所示的快捷菜单，单击“创建补间形状”菜单项，建立形状渐变动画。建立形状渐变后，在“位置移动”图层的第1帧到第25帧之间以淡绿色显示，并带有一个自左向右的箭头，如图2.2.08的图示(2)所示。鼠标拖动图2.2.08的图示(2)的处的播放头，可以预览动画。图2.1.08三、保存并测试动画 在动画制作过程中，我们要及时将动画保存到硬盘上，因此，我们可以新建一个文件夹，专门用来放置学习过程中所做的实例。我们可以在E盘下新建一个“实例练习”文件夹。保存操作如下：按快捷键“Ctrl+S”，打开“另存为”对话框，按图2.2.09的提示操作。图2.2.09新建一个文件夹将新建的文件夹命名为“实例练习”，并双击打开这个文件夹。接下来的操作如图2.2.10所示。保存位置选择E盘图2.2.10 保存完Flash文档后，按快捷键“Ctrl+Enter”测试影片，或者选择菜单“控制测试影片”菜单项，效果一样。按完“Ctrl+Enter”键后，将弹出如图2.2.11的图示(1)所示的提示框，完成导出后，弹出如图2.2.11的图示(2)所示的预览窗口。图2.2.11 打开“E:实例练习”文件夹后，我们可以看到两个文件，一个为“矢量-位置变化.fla”，这个文件是Flash的源文件。一个为“矢量-位置变化.swf”， 如图2.2.12所示。“.swf”这个文件是按“Ctrl+Enter”测试影片后，生成的可执行的影片文件，它的后缀为“.swf”。双击打开这个文件可以观看动画，动画制作的最终目的就是为了生成这种文件。图2.2.12源文件swf文件总结：分析本例，我们先来回答：帧与编辑区有何联系？一个帧代表着一个编辑区，帧与编辑区是一一对应的关系。在编辑区中进行编辑时，首先选定此编辑区所在的帧。时间轴上的帧有以下三种形式：空白关键帧、关键帧、过渡帧。空白关键帧在时间轴上表现为一个空心的小圆点，空白关键帧的编辑区是没有任何内容的，如图2.2.13的图示(1)所示。关键帧在时间轴上表现为一个实心的小圆点，它表示此帧在编辑区中已经有内容，如图2.2.13的图示(2)所示，在编辑区中绘制了一个五角星。如图2.2.13的图示(3)所示，过渡帧在时间轴上以灰色显示，它表示对关键帧内容的延长，显示的是关键帧上的内容。对过渡帧编辑区中的内容进行编辑，就是对过渡帧前的关键帧的编辑。图2.2.13动画形成的原理是什么？动画形成的原理是根据人的“视觉暂留”现象，将一组静止的图形连续出现后，便形成了动画。Flash动画就是基于此原理来制成动画的，时间轴上的每一帧在编辑区中有不同的图形，当时间轴上的帧以当前帧频向前移动时，我们看到的是编辑区中的一组图形不断变化，从而产生了运动的视觉效果。用Flash制作动画有何特点？参考本例，我们可以发现Flash动画有如下特点： 动画是建立在两个关键帧之间，如图2.2.14所示。图2.2.15图2.2.14 两个关键帧在编辑区中的内容必须是变化的。如此例中的矩形，它是位置的变化，如图2.2.15所示。 两个关键帧之间内容的变化是有规定的。即矢量对象、图形对象、影片剪辑对象、按钮对象各自可以形成哪些动画？可以从本书目录中得到答案，一目了然。 在两个关键帧之间创建动画时，是先选定前面一个关键帧，然后单击鼠标右键，在弹出的快捷菜单中，选择一种动画类型，如图2.2.16所示。 创建动画的类型是根据对象来选择的，矢量对象是选择“创建补间形状”选项；图形对象、影片剪辑对象、按钮对象是选择“创建补间动画”选项，如图2.2.16所示。在Flash中，只有这四种对象能形成动画，其他对象若要形成动画，必须将其转换为其中一种对象。图2.2.1