平面动画制作

平面动画制作 , 平面动画在化学教育中的作用 , 平面动画类型 , 平面动画制作工具简介 , 平面Flash动画制作 , 上机实习 在化学教育教学中，平面动画可以起到生动课堂教学，活跃气氛，并且以形象的手段展 示微观、宏观的化学现象及本质。 在教学实际中平面动画主要有演示型，互动型等。 目前，平面动画的制作工具很多，如Flash，Director, 等等。最常用的还是FLASH。 Flash 4.1.“” 4.1 1 4.1.1.1. 组件，不妨看作是特殊的对象，跟普通对象不同的地方在于，它可以在整个动画中随时 引用。既然是引用，当用户在网上观看该动画时，只需下载一次该对象，以后就不用下载而 直接进行引用，提高了动画播放的流畅度，大大减小了文件的尺寸。 如果不用组件，在某些场合中还是可以获得相同动画效果的，但由于每个内容都需要重 新下载，从而严重影响了播放效果。 4.1.1.2. 4.1.1.3. 4.1. 2 4.1.2.1.双击桌面上或开始菜单上的 Flash图标，程序打开后界面 如图 4.1.2.2.点击面板右上角的"X"，将暂时没用到的面板关闭，留出空 间以便于编辑，结果如图 提示：以后要用到哪个功能面板，只需通过菜单命令 Windows 下的相关命令就可以打开了；另外，我们关掉暂时不用 的面板，只是为了便于编辑操作，不是必须的步骤。 4.1.2.3.添加/新建组件： 选择菜单 Insert/New Symbol，或按快捷键 Ctrl+F8 ，弹出如图的“组件属性”窗口。在这里，把组件名称(Name)改为 ball ，Behavior 属性设为“Graphic”。 4.1. 2.4.1.点按“确定”按钮后，进入组件编辑窗口。在这里面进行 的所有操作，只会对本组件起作用，而不会影响场景。菜单下的 标示栏会变成如图四的标示： 1 提示：用鼠标点击标示栏中的选项，可以快速在各个场景中切换。如点击 Scene 1 就可以 快速切换到场景1中。 4.1. 2.5.找到工具栏上的“椭圆工具”，如图 4.1.2.6.设置圆形属性，即圆形的轮廓颜色、填充色、圆心位置，等等。 在 Flash 的工具栏里，对轮廓、填充属性的设置，分别由图中标示出来的 工具完成。最下面一排，分别是“默认色”(Default Color)、“无颜色”(No Color)、“轮廓色与填充色对换”(Swap Colors)。如图： 4.1.2.7.点按颜色对换按钮，将前景色由白色变为黑色，将边缘轮廓颜色变为白 色。然后按住 Shift 键，用椭圆工具在组件 ball 中画个圆形，如图： 提示：在图像处理软件中，几乎都有这一相同的功能，即按住 Shift 键时可画出正方形与圆，不按时画出的常常是长方形与椭圆。 4.1.2.8.点按标示栏上的“Scene 1”回到场景1。 提示：这时，你会发现刚才画的球不见了，这是因为刚才的 操作，只是针对组件 ball 所作的，场景里面当然看不到。要看见 刚才创建的组件，只需通过 Window(窗口)/Library(图库)命令，或按 Ctrl+L/F11 快捷键，就可调出图库并对所有组件进行查看了。 4.1.2.9.按 Ctrl+L/F11 快捷键，调出图库(Library)，选中组件 Ball ，图库中便出现了 ball 的预览，如图： 4.1.2.10.确定当前影格在“时间轴”上是第一 帧，如图： 提示：时间轴是什么东西？动画犹如一 个舞台，不同时间(时间差异)、不同演员(组 件的不同)，共同完成一个统一的主题。在这 里，时间轴决定了演员(组件)出场的先后次序，对整个动画，起着决定 性的作用。 4.1.2.11.用鼠标将 ball 组件拖到场景一中，位置稍微偏左，如图： 提示：将组件拖入场景后，你会发现时间轴第一影格中多 了个黑色的小点。其实，这个小黑点代表本影格已有内容(即那个组件)，没有小黑点的影格是空影格，说法是“空帧”(Blank Frame)。 提示：既然空帧什么内容都没有，那么它们还有什么作用 吗？回答是肯定的，特别是那些有影格跳转，或者事件触发特 效的动画，几乎缺少不了空帧的支持。 4.1.2.12.用鼠标点一下时间轴第十影格处，选中此帧，然后鼠 标右键，选择"Insert Keyframe"，然后再将本影格中的圆向 右拖动。结果如图： 4.1.2.13.点选第一影格，鼠标右键，“Creat Motion Tween”，现在的时间轴窗口变成如图的样式： 4.1.2.14.按住 Ctrl 键的同时再按回车键，就可预览最终效果 了。 4.1.3 以上的例子包含了 Flash 动画制作的基本原理：基于时间 轴的组件属性变化，如位置、颜色、透明度，等等，就构成了 动画的基础。 2 上面还谈到影格的问题。影格，标准的说法应该是“帧”，第一影格即第一帧，第十影格 即第十帧。它们犹如电影胶片上的一格影片，也如同快速翻动的书页中的一页，而将所有这 些单格的影片通过时间轴串连起来，就组成了一个完整的动画了。 在电脑动画出现以前， 几乎所有动画都是通过手工描绘出关键的动作(相当于关键帧)，然后将所有动作串连起来形 成的。现在的电脑动画制作，则跟这种原理有相同之处。以上的原理，无论是 对Flash ，LiveMotion，还是 对Director，都是通用的，只是各软件在制作时操作步骤不同而已。 单击每个菜单选项，可以看到相 应的下拉菜单选项。 共由标准工具栏、绘图工具栏、状态工具栏、控制器工具栏四种组成，可以在菜单栏的 Window(窗口)/Toolbars(工具栏)选项中进行调整。 在许多应用程序，如 Word 中也有类似的工具，如图： 比较特别的是后面的几个工具： (1).磁铁工具(Snap to Objects)： 所谓磁铁工具，在于将所选对象靠近最相邻的格线，主要用来对象的对齐属性。 (2).平滑曲线工具(Smooth)：调整线条的平滑度，反复应用此工具，可以让对象越来越 平滑。如选取铅笔工具，然后在工作区画出一条比较复 杂的路径，如图：用鼠标点按选择工具(Arrow Tool)双 击该路径选中全部路径，再点按“平滑曲线”工具，原来的线条变得平滑一些，多次点按此 按钮，原来的曲线会越来越平滑。 提示：双击对象与单击对象的功能是不同的。双击表示对象全部选中；单击则只选中单 击的部分。 (3).拉直工具(Straighten)：拉直对象。 (4).旋转工具(Rotate)：旋转对象。(5).缩放工具(Scale)：缩小或放大对象。 （1）.箭头选择工具(Arrow Tool)：用于选择对象。对任何对象进行处理时，首先得选 中它，然后才能对其进行操作。 提示：要选中多个对象，只需用箭头选择工具在这些对象的外部点一下(进行定位)，然后拖动鼠标拉出一个能包含所有对象的方形，最后松开鼠标，这时，所有对象都被选中了。 （2）.节点选择工具(Subselect Tool)：此工具能显示选定对象的所有节点，还可以通 过拖动改变每个节点的位置来改变整个对象的外观。 提示：节点选择工具主要是用来精确对象外形的。使用此工具时，所有对象全部转化成路径， 3 每条路径包含起点与终点两个路径点(称为路径的“节点”)，调整这两个节点的位置就可以 调整整个路径的外观。 提示：节点选择工具常常与下面提到的钢笔工具协同使用，通过使用钢笔工具的增加节 点、清除节点功能，可以勾勒出复杂的工作路径。 （3）.直线工具(Line Tool)：绘制直线。 （4）.套索工具(Lasso Tool)：主要用来选择具有复杂轮廓的对象，使用方法是先用此 工具定下起始点，然后大致沿轮廓画线，最后与起始点重合形成封闭路径从而选中此范围内 的对象。 （5）.钢笔工具(Pen Tool)：通过增加或减少节点来精确控制路径的外形。 （6）.文本工具(Text Tool)：用此工具给对象添加文字信息。 （7）.椭圆工具(Oval Tool)：用于绘制圆、椭圆等图形。 提示：按住 Shift 键可以画出正圆、正方形。 （8）.方形工具(Rectangle Tool)：用于绘制方形、正方形。 提示：结合 Options(选项)，可以画出圆角方形图案，如图： （9）.铅笔工具(Pencile Tool)：手绘工具，可用它自由绘制。 （10）.笔刷工具(Brush Tool)：既然是“刷子”，它起着涂刷的功能。它的 Options 选 项功能非常特别，下面把其功能列举如下： a.Paint Normal(一般涂刷)：标准涂刷模式，在选定区域用新的颜色进 行覆盖。 b.Paint Fills(填充涂刷)：一个对象， 可以分为填充区域与轮廓区域，填充涂刷只对填充区域起 作用，而保留原图像的轮廓。如图 c.Paint Behind(在后面涂刷)：用此 工具涂刷出的图像将处在已有对象的后面，如图 d.Paint Selection(在所选区域涂 刷)：涂刷只针对所选区域，所 选区域外的部分不能进行涂刷。 e.Paint Inside(内部填充)：根 据起点位置的不同而填充形式不同。如果起点在某个对 象外(即内部应该是空白区域)，那么对于该对象来说，它不是内部，所以该对象会遮挡经过 它的涂刷部分。如图： 4 反之，如果起点在某个对象内(即内部是该对象内部)， 那么涂刷只会作用于该对象内部，如图： f.涂刷样式(Brush Shap)与笔刷大小(Brush Size)：用来决定笔刷的大小与用什么样式的笔刷进行涂刷。 (11).墨水瓶工具(Ink Bottle Tool)：本工具用来给对象的边框上色。 (12).颜料桶工具(Paint Bucket Tool)：对图像进行填色，根据选项(Options)的不同可以采取多种填充方式。 a.不封闭空隙(Don't Close Gaps)：不封闭的区域不能进行填充。 b.不封闭小空隙(Close Small Gaps)：间隙较小的不封闭区域也 可进行填充。 c.不封闭中空隙(Close Medium Gaps)：允许较大的空隙。 d.不封闭大空隙(Close Large Gaps)：允许更大的空隙。 (13).滴管工具(Dropper Tool)： 本工具用来进行颜色取样，使用方法非常简单，只需用滴管点一下欲取颜色就行了。 (14).Eraser Tool(擦胶工具)： 本工具用来擦除一些不需要的线条或区域。要灵活使用此工具，首先就得掌握其各个选项。 a.一般擦除 b.填色擦除 c.线段擦除 d.擦除指定填色 e.擦除内部 用来显示相关命令、按钮、大小写，以及 Num 锁定情况，位于工作区底端。 用来控制动画播放的动作，它们分别是停止、快倒、倒退、 播放、进到最后、快进，如图. 3 在 Flahs 中，还有几类设置面板，它们往往是进行物件设置的关键，因此必须熟练地掌握 它们的运用。这些设置面板可以由 Window/Panels (窗口/面板)下相应的命令打开。 3.1.Info Panel() 选定物件的长宽高，以及鼠标处的颜色值、坐标值的显示 面板。如图一 5 提示：这个面板作用:当要用 Flash 制作一个指定大小的组件时，就得先利用此面板获取详细的物件信息，然后再进行制作。 3.2.Transform Panel() 变形操作面板。这里的变形，主要是指旋转(Rotate)、透视(Skew)，以及大小改变三种操作， 你只需在相应的输入框内填入合适的数字，再点按最下排 两个按钮的第一个按钮(Copy And Apply Transform)就可以了，其功能相当于操作菜单中的 Modify (变形)命令。如图： 3.3.Align Panel(): 本面板用来处理多个物件的相应位置关系，分别有左中右 三种水平对齐、上中下三种垂直对齐；顶中底三种分散对 齐、左中右三种分散对齐；此外，还有宽度匹配、高度匹 配、宽度与高度都匹配三种匹配方式；空白高度匹配、空 白宽度匹配两种间隔匹配方式。如图： 提示：要选中多个物件，只需在进行选择时按住 Shift 键就行了。 3.4.Mixer() 本面板相当于调色板，需要什么颜色，自己调就行了。 它们分别是轮廓色(Stroke Color)、填充色(Fill Color)、默认的黑白搭配(Black White)、轮廓色与填充色对换(Swap Color)，等等。旁边的 R、G、B 三个输入框，显示了颜色 的 RGB 值，可以通过直接输入数值的方式指定某种颜色； 最下面是色彩面板，也可以直接用鼠标点选自己中意的颜 色。如图： 3.5.Swatches() 操作非常简单，只需直接进行采样就行了。如图： 提示：简单的颜色只需直接在采样面板上进行就可以 了，但对于复杂的、有多种色值变化的填充，则需借助前 面我们讲到的 Fill(填充面板)来进行。有了 Fill 属性设置面板的帮助，你可以创造出各种各样的色彩！在后面的实 战章节中你将体会到这点。 3.6Scene() 一个动画，犹如一幕电影，可以有多个场景，而本面板的功能正是对场景(Scene)进行 管理。如图： 本面板右下角有三个按钮，它们分别是： ：复制选定场景。：添加新场景。：删除选定场景。 提示：大家一定见过这样的动画：先是一个进度条，上面显示的 是当前下载的进度，当进度到 100% 时就自动播放该动 画。在这个动画中就包含着两个场景，一个是进度条动画 场景，另外一个是进度完成后播放的动画的场景。 提示：在 Flash 中，如果有几个场景，会先播放先加入 的场景，在场景面板中，先加入的场景显示在上面。要改变 场景的播放顺序，很简单，只需选定该场景，然后将之拖到 合适的位置就行了。 提示：对于上面这个有进度条的动画，常见的制作步骤 6 是先做好主体动画，然后再做进度条场景，这样，如果不改变场景排列顺序，在进行动画播 放时会先放主体动画，再放进度条动画。这时，就需要在场景面板上将这两个场景的位置调 换一下。 3.7Actions() Flash 除了简单的动画演示，还具有动画交互功能，而这，就需要 Actions 的支持了。 要熟练地掌握它们，就得有一定的 Flash 编程基础，如图： 3.8Library() 在 Flash 中，库窗口相当于一个资源仓库，所有组件都在这进行调用。 如图： 预览窗口：所选组件的预览窗口。 组件列表：其中罗列出所有的组件。 ：添加一个新组件。：在库窗口中添加一个组件管理夹，对组件进 行分类管理。：对组件属性进行设置。：删除选定组件。 3.9.Properties 在FLASH MX中，参照一般面向对象编程的工具使用了属性面板，大 部分对象的属性调节可以通过它进行。 4.4 最终效果如图： 4.1 本图像由三种物件组成：代表星光线的方形、代表光晕的球， 以及光晕外的一个圆形光晕线。星光线用比较复杂的线形渐变 填充制成，光晕则是用带透明效果(Alpha)的圆形填充完成；圆形光晕线是没有填充色，只有轮廓色的圆做成。 4.2 (1)．建立一个新文件，并将其背景改为黑色。 (2)．根据星光线的特点，我们在 Fill (填充面板)上将线形渐变填充(Linear Gradient)变成两端黑色，中间滑块为灰色，灰色滑 块两边是蓝色滑块，总共含五个滑块的渐变填充样式。 (3)．用绘图工具栏上的方形工具绘制一个方形，注意，方形要 尽量窄，同时，不要有轮廓。结果如图 (4)．绘制好了第一根星光线了，然后通过 Insert(插入)/Layers(层)命令建立多个新层，并在每个层上将刚才做好的 星光线拷贝过去并进行位置移动和缩放，最后结果如图 图二十四 (5)．所有星光线绘制完了，现在再建一个新层，用画圆工具绘 制一个不带填充色，只有轮廓色的圆圈。结果如图 (6)．最后，我们来绘制光晕。 先对光晕进行分析：它的基本色应该是从白色到金黄色的过 渡；到了光晕边缘，金黄色逐渐溶入黑色背景中，同时，金黄 7 色中也透露出黑色的背景信息，这时，就得考虑使用 Alpha 透明属性进行设置了。 基于以上原因，将圆形渐变填充(Radial Gradient)设置： 借助 Mixer(调色板)，我们将金黄色端的 Alpha (透明值)设为 0% 。 提示：Mixer(调色板)在对颜色进行设置时非常有用，所有对 颜色的调整都可以通过它完成，建议你多使用。 现在绘制一个圆，并应用刚才设置好的圆形渐变填充，制作完成。 4.5 4.5.1 在 Flash 动画中，场景犹如一个舞台，所有的演员与所有的情节，都在这个舞台上进行。 舞台由大小、音响、灯光等条件组成，场景也有大小、色彩等的设置；跟多幕剧一样，场景 也可以不止一个，多个场景集合在一起并按它们在场景面板上排列的先后顺序进行播放也是 常事。 1 不选择任何对象，此时打开属性面板：可以调节场景属性 Frame Rate(帧速)：每秒播放的帧数，默认为每秒播放 12 帧。 Dimensions(尺寸)：场景的大小设置，由 Width(宽)与 Height(高)决定。 Match(匹配)：由作品的用途决定，如果作品主要用于打印，请点按 Printer 按钮；如果用于 电脑显示，则不需进行修改。 Background(背景)：背景的颜色设置。 Ruler Units(标尺单位)：标尺主要用来进行精确定位，在制作过程中，要显示标尺，可以使 用 View(查看)/Rulers(标尺)命令。 2 有两种办法，第一种方法是"场景面板"中的"添加"按钮来完成；第二种方法是调用菜单上 Insert(插入)/Scene(场景)命令进行添加。 3 两种办法：一种是通过"场景面板"中的"清除"按钮完成，另一 种办法是调用菜单上 Insert(插入)/Remove Scene(清除场景)来清除。 4 Modify(修改)/Scene(场景)，然后在弹出的"场景面板"中双击该场景，并进行修改。如图 4.5.2 一出戏，光有舞台还不行，重要的是有演员按某 种时间安排进行演出，应用到 Flash 动画制作中， 这种时间安排则由时间轴来完成。如图： 时间轴是在同步时间内分配在不同图层上的图 片相互叠合的过程。 4.6Flash 在大部分图像处理软件中，都引入了图层(Layer)的概念，其功能的强大可见一斑。灵活地掌握与使用图层，不但能轻松制作出种种特殊效果，还可以大大提高工作效率。可以说， 对图层技术的掌握，无论是 Flash ，还是其他图形处理软件，都是进阶的必经之路。 8 一个图层，犹如一张透明的纸，上面可以绘制任何事物或书写任何文字，所有的图层叠 合在一起，就组成了一幅完整的画。 提示：层有两大特点：除了画有图形或文字的地方，其他部分都是透明的，也就是说， 下层的内容可以通过透明的这部分显示出来；图层又是相对独立的，修改其中一层，不会影 响到其他层。 4.6.1 在 Flash 中，层有四种状态，如图： ：表明此层处于活动状态，可以对该层进行各种操作； ：表明此层处于隐藏状态，即在编辑时是看不见的，同 时，处于隐藏状态的图层不能进行任何修改。 ：表明此层处于锁定状态，被锁定的图层无法进行任何操作。在 Flash 制作中，大家应 该养成个好习惯，凡是完成一个层的制作就立刻把它锁定，以免误操作带来麻烦。 ：表明此层处于外框模式。处于外框模式的层，其上的所有图形只能显示轮廓。请注意， 其他图层都是实心的方块，独有此层是外框形式。 提示：外框模式只能显示图形轮廓的功能，有什么作用呢？当我们在进行多图层的编辑， 特别是要对几个图层的对象进行比较准确的定位时，外框模式就非常有用了，因为可以仅仅 凭轮廓的分布来准确地判断他们的相对位置。 4.6.2 1 每次打开一个新文件时就会有一个默认的图层：Layer 1(图层一)，如图： 要新建一个图层，只需用鼠标点击图层窗口左下角的，或者调用 Insert(插入)/Layer(图层)命令，这时，在原来图层上 会出现一个新图层 Layer 2(图层二)，如图： 2 用鼠标双击某个图层就可以进行改名了，如图四： 3 用鼠标点一下该图层就选定了图层；在工作区域选中一个物 件，按住 Shift 键，再选择其他层的物件就可以选择多个图 层。 4 先选中要复制的图层，再调用 Edit(编辑)/Copy Frames(拷贝所有帧)命令，再创建一个新层，并调用 Edit(编辑)/Paste(粘贴)命令就行了。 5 上面层的内容会遮盖下层的内容，下层内容只能通过 上层透明的部分显示出来，因此，常常会有重新调整层的 排列顺序的操作。要改变它们的顺序，非常简单，用鼠标 拖住该层，然后向上或向下拖到合适的位置就行了。 4.6.3 9 随便选中某个图层，点按鼠标右键或双击，在弹出的菜单中选择 Properties(属性)，弹出如图的面板： 面板中，有图层名称(Name)、是否锁定、类型(Type)、外框颜色(Outline)、是否为外框模式(View Layer As Outline)等属性。 类型(Type)中，除了普通图层(Normal)，还有 Guid(导引图层)与 Mask(遮罩图层)两种，相对这两种图层，被导引的图层当然是 Guided ，被遮罩的图层当然是 Masked 图层了。 4.7Flash 电影是由一格一格的胶片按照先后顺序播放出来的，由于人眼有视觉停留现象，这一格 一格的胶片按照一定速度播放出来，看起来就"动"了。动画制作采用的也是这一原理，而这 一格一格的胶片，就是 Flash 中的"帧"。 在 Flash 中，帧的概念贯穿了动画制作的始终，可以说，不懂帧的概念与用法，基本 上就可以说不会使用 Flash，因此有必要用专门的篇幅对帧的概念与用法进行阐述。 4.7.1 前面讲到了时间轴，随着时间的推进，动画会按照时间 轴的横轴方向播放，而时间轴正是对帧进行操作的场所。在 时间轴上，每一个小方格就是一个帧，在默认状态下，每隔 5 帧进行数字标示，如时间轴上 1、5、10、15 等数字的标示。 如图： 帧在时间轴上的排列顺序决定了一个动画的播放顺序，至于每帧有什么具体内容，则需 在相应的帧的工作区域内进行制作；比如在第一帧绘了一幅图，那么这幅图只能作为第一帧 的内容，第二帧还是空的；一个动画，除了帧的排列顺序，即先放什么，后放什么，动画播 放的内容即帧的内容，也是至关紧要、缺一不可的。 提示：帧的播放顺序，不一定会严格按照时间轴的横轴方向进行播放，比如自动播放到 哪一帧就停止下来接受用户的输入或回到起点重新播放，直到某件事情被激活后才能继续播 放下去，等等，这就涉及到 Flash 的 Action。 电影是由一格一格的胶片组成，那么动画是不是也需要将每帧的内容制作出来才行呢？ 回答是否定的，只要定义出动画的起止关键帧，Flash 就会根据设置，自动模拟中间的变化 过程，如缩放、旋转、变形等等。 1(Keyframe) 上面这个例子中，提起膝盖与放下膝盖两个动作所在的帧就是关键帧。关键帧有别于其 他帧，它是一段动画起止的原型，其间所有的动画都是基于这个起止原型进行变化的。 关键帧定义了一个过程的起始和终结，又可以是另外一个过程的开始。 2(Frame) 两个关键帧之间的部分就是过渡帧，它们是起始关键帧动作向结束关键帧动作变化的过 渡部分。在进行动画制作过程中，不必理会过渡帧的问题，只要定义好关键帧以及相应的动 作就行了。过渡帧用灰色表示。 提示：既然是过渡部分，那么这部分的延续时间越长，整个动作变化越流畅，动作前后 的联系越自然。 3(Blank Frame) 在一个关键帧里，什么对象也没有，这种关键帧，称其为空白关键帧。 提示：空白关键帧可用那些要进行动作(Action)调用的场合，常常是需要空白关键帧的 支持的。 4.7.2 10 1 将鼠标移到时间轴上表示帧的部分，并用左键单击要定义为关键帧的方格，然后单击鼠标右 键，在弹出菜单中选 Insert Keyframe(插入关键影格)。 提示：这时的关键帧，没有添加任何对象，因此是空的， 只有将组件或其他对象添加进去后才能起作用。添加了对象 的关键帧会出现一个黑点，如图： 提示：关键帧具有延续功能，只要定义好了开始关键帧并加入了对象，那么在定义结束 关键帧时就不需再添加该对象了，因为起始关键帧中的对象也延续到结束关键帧了。 2 选中欲清除的关键帧，鼠标右键并在弹出菜单中选择"Clear Keyframe"(清除关键影格)。 3 选中欲插入帧的地方，鼠标右键并在弹出菜单中选择"Insert frame"(添加影格)。 4 选中欲清除的某个帧或者某几个帧(按住 Shift 键可以选择一串连续的帧)，然后按 Del 键就行了。 5 选中要进行复制的某个帧或某几个帧，Edit(编辑)/Copy Frames(复制)，然后选定拷贝放 置的位置，Edit(编辑)/Paste Frames(粘贴)。 4.7.3 帧的属性主要通过属性面板进行控制，其中，颜色、透明 度、名称、动作、声音。 提示：帧的名称(Label)，准确点应该说是帧的标签。当我 们为某个帧输入标签后，会在时间轴的该处添加一面小旗子， 并以名字进行标示。如图： 提示：对帧进行命名，主要是在引用时跟其他帧区别开来。 4.8Flash 组件只是一种人为规范，将动画中一些出现频率比较高的物件定义出来以便引用，而这 种被定义的物件就是"组件"。使用组件，可以很方便地对动画元素进行管理与修改，如改变 它们的颜色、亮度、透明度，等等，而且只需在库窗口(Library)中对组件进行修改，动画中所有被引用到的该组件都会发生相应的变化；组件除了引用功能外，还可以依据其保持一致 的功能，通过调整组件的变化过程来制作动画。 提示：动画制作，文件体积当然越小越好，而使用组件，可以在很大程度上减小文件体 积。如果动画中有很多重复的图像而不使用组件，装载时就要不断地重复装载图形；如果使 用组件，则只需装载一次，以后就可以通过调用来直接播放了。因此，组件对控制动画体积 大小有着难以替代的作用。 提示：不管我们创建了多少个实体， Flash 在文档中只保存一份副本，动画中出现的多个具有不同属性的组件，实际上只是该副本的变形，不会作为新组件即新元素进行处理， 这样，又大大地减小了动画的体积。 上面谈到了组件的一些基本功能，在实际制作过程中，它还具有多项不可代替的作用。 因此，只要有可能，我最好使用组件进行动画制作。 4.8.1 1 Insert(插入)/New Symbol(新组件)命令可 11 以创建一个新组件，并弹出如图一的对话框： Name(名称)：组件的名称，在进行组件调用时非常重要，最好不要使用中文，因为如果有 程序调用的话，中文名容易出错。 Behavior(属性)：在 Flash 中，有三种类型的组件，它们分别是 Graphic(图像)、Button(按钮)、 Movie Clip(电影夹)。 名称与属性设置好后，点按 OK 按钮，进入组件编辑状态。 这时，你会发现标准工具栏下的场景旁出现了组件编辑图 示。如图： 工作区域成为组件编辑区域，现在可以按自己的需要进行 制作，如果是 Graphic(图像)类型的组件，这时需要作一幅 图；如果是 Movie Clip (电影夹)，则需在此区域类制作一段电影(或者动画，当然也可以是一幅静止的图像)；如果是 Button(按钮)类型的组件， 其时间轴则显得非常特别，如图： UP(一般)：表示一般状态下按钮的模样。 Over(鼠标经过)：当鼠标移上时按钮的模样。 Down(按下)：用鼠标点击按钮时的模样。 Hit(执行)：点击按钮后在执行状态中的模样。 明白了按钮的几种状态，非常容易就能制作响应鼠标事件的按钮了。 例：一个按钮的制作。 2 在库窗口(Library)选中一个组件，并点按下角的删除图标；或者选中组件后，在右键菜 单中选择 Delete(删除)。 3 选中组件后，在右键菜单中选择 Duplicate(复制)，并在弹出的窗口中决定新建组件的名称与属性。 4.8.2 除了前面谈到的 Movie Clip(影夹)、Button(按钮)、Graphic(图片)三种分类属性，跟帧或其他很多元素一样，它们还有颜色、亮度、透明度等特殊效果，而这些效果，可以通过 属 性面板进行设置。 提示：组件只是 Flash 中常常用到的一种元素，不能把它分隔看待，它也与其他元素 一样，共同分享 Flash 中的其他功能面板。 1(Brightness): 2(Tint) 通过该选项，可以快速地为组件变换整体颜色。 3(Alpha) 控制组件的透明度 提示：对于透明，不仅仅是色彩变淡的问题，更重要的是透露出部分下层内容，而这， 才是透明的真正用意；淡入淡出等动态消失特效，仅仅是透明的一种应用，并不能代表全部； 而且，淡入淡出也不过是背景色逐渐代替物件本身的颜色，物件由于本身与背景色溶为一体， 所以"消失"了，而实际上，它还是在那里，只不过看不到了而已。 4.8.3 Flash 制作，有时候如同堆积木，把各个组件(演员)按步骤放入时间轴(舞台)，并按导演 的意思(创作意图)组合在一起就行了。在这个过程中，组件扮演着极为重要的角色。 12 4.9 Flash 4.9.1 在 Flash 的图层面板中，有个 Add Guide Layer(添加导引图层)图标，导引图层就是用来摆放对象运动路径的图层，它所起的作用在于确定了指定对象的运动 路线。比如来让一个球按指定的路线移动。 (1)．新建一个圆球组件，属性为 Graphic(图片)，如图 (2)．回到场景中，将该组件拖入工作区偏左位置。 (3)．添加导引层，完成后图层窗口的状态如图： 其中，标志新添的层是导引层(Guided Layer)。 (4)．现在在导引层中制作 Layer 1 中圆球的运动路线。确认是在 导引层中，然后用绘图工具栏中的铅笔工具随意绘制一条路径， 如图： 提示：图三中，只有那条路径是导引层中的内容，而那个圆球是 Layer 1 中的球。现在你能体会到层的透明特点了吧？ 提示：导引层中的路径，在实际播放时不会显示出来，所以可以放心绘制。 提示：还有一点非常重要，路径的起点必须与被导引的物件的中心点相重合。不知道被 导引物件的中心点？简单，选中被导引物件会出现个"+"号，而这个"+"号所处位置就是该物件的中心点。 (5)．打算让动画延续多久？在默认状态下，每秒 12 帧，如果要让动画延续两秒，就需要 24 帧。现在要让动画延迟 15 帧，也就是 1 秒多。在第 15 帧处按 F5 键或者用 Insert(插 入)/Frame(帧)，在导引层的第 15 帧加入一个过 渡帧，结果时间轴如图： (6)．现在回到 Layer 1 即被导引物件那层，并 在第 15 帧插入关键帧(Insert Keyframe)，时间轴 状态如图： 提示：不知你注意到没有，在导引层中，如果不 在第 15 帧处插入一个过渡帧，那么导引层中的 导引线就不能在整个 15 帧内起作用，如果你只 在第 10 帧处插入过渡帧，那么导引作用只能延 续 10 帧，而 Layer 1 中后面 5 帧的动作就失去引导了，所以要在第 15 帧处加入过渡帧；至于为什么在导引层插入过渡帧，而在 Layer 1 却插入关键帧则完全视对象有无变化来决 定的。 Layer 1 中，球体从一端移动到另外一端，有位置的改变，因此必须决定改变的起 始位置与终止位置，所以要插入关键帧；导引层中，无论是第一帧，还是第十五帧，导引线 始终没有任何变化，因此不需要再插入关键帧。总结出来，凡是涉及到变化原型与变型的场 合，就应该用关键帧来解决；如果只是一种画面的延续而无任何变化，只需用普通的过渡帧 13 就行了。 (7)．在第 15 帧处，把圆球从左边位置拖到右边，并让圆球的中心点与导引线的尾端重合。 (8)．现在我们为动画进行动作指定。选中 Layer 1 的第一帧，并在鼠标右键弹出菜单中选择 Creat Motion Tween (创建移动渐变)，完成后时间轴有些 变化，过渡帧变成天蓝色，并出现了一个箭头符号，而这 正表示动作已经建立。如图： (9)．最后测试，圆球是不是按着你指定的路线移动了？ 提示：导引层的要点在于被导引物件的中心点与导引 路径的首尾重合！ 4.9.2 创建 Flash 动画，除了上面提到的位置变化外，还有变形变化，以及是否改变大小、 是否旋转等的设置。在上面的例子中，并没有对动作做过多的设置，这是因为该例子中所应 用到的动作恰好与 Flash 的默认动作相符合。如果你要对 Flash 动作做更精确的控制，那么请打开如图七的 属性面板：调节Tweening(渐变)：也就是上面提到的变化种类，可以是无变化(None)，可以是位移(Motion)，也可以是形体改变(Shape)。 提示：这里的形体改变，不包括大小缩放这种变化。 Scale(缩放)：如果组件有大小变化，请勾选此项。如上面的例子，将结束帧的球变大或 变小也是行得通的，其效果是逐渐变大(或变小)的球沿着指定路径运动。 Easing(和缓)：这个属性还可以控制变化的剧烈程度，默认状态为 0 ，数字越大，变化越剧烈，反之越小。如果我想让上例中的球随运动加速，则需将此项设置加大。 Rotate(旋转)：组件还可以旋转着进行变化，默认为自动(Auto)，可以顺时针旋转，也可反时针旋转，Times(次数)是对旋转次数的设置。 Options(选项)：可以按路径变化(Orient To Path)，可以与组件同步(Synchronize)，还可靠 齐导引线(Snap)。 现在来做个变形的动画，一个红色的圆球，逐渐变化成 一个 "O" 字。 (1)．新建个图片组件，取名为 Ball ，并绘制红色球体。 如图八： (2)．再创建一个图片组件，取名为 Font ，并输入 "O" 字样。如图： (3)．组件制作完毕，现在进入场景开始布置。要让这个 圆球先停留 10 帧左右，然后开始变形，最后完全变成 "O" 字，变形完成后 "O" 字延续 10 帧。 (4)．在第一帧处，将组件 Ball 拖入工作区偏左位置，如图： (5)．既然球停留 10 帧而无变化，那么前 10 帧就不用设 置动作了。在第 10 帧处插入关键帧，并将它作为向 "O" 字变化的起始关键帧。时间轴如图： (6)．现在我们先把局布好，然后再解决其他的 问题。球体变化为 "O" 字的过程将延续 20 秒， 因此我们在第 30 帧处插入关键帧，然后将此帧 中的球体清除，并加入组件 Font 即那个 "O" 字，如图： 提示：此处有个技巧，想让球体与字体水平对齐或位置比较平衡吗？最好先将 Font 组 件放到比较合适的位置，然后再将原来那个球体清除了；如果先清除该帧中的球体，由于缺 14 少了参照物，字体组件的位置可能不好确定。 提示：Flash 中有种专门的多帧编辑与对齐模式，叫作"洋葱皮效果"(Onion Skin)，它们 就位于时间轴下面，那一排标志点一下就知道有什么效果了。 (7)．变形完毕后，"O" 字会延续 10 帧而无变化，因此我们在第 40 帧处插入一个过渡帧。最后时间轴如图： 提示：上面这个例子还没完成，但已经告诉 我们 Flash 制作的一个流程，那就是先有构思， 然后将需要的组件做出来，然后将这些组件摆上 "舞台"，最后再对组件们进行分别设置就行了。 (8)．现在来处理从第 10 帧到第 30 帧的变形动画。先回到第 10 帧，选中组件后，按 Ctrl+B 或使用菜单命令 Modify(修改)/Break Apart(打散)，将所选组件打散；然后再到第 30 帧处， 将该处的 Font 组件打散。 提示：为什么要打散？这是因为变形操作不支持组件或群组对象，不打散硬要进行变形 操作的话，变形将不能成功，而且会弹出警示框。打散前 与打散后的图示区别如图： 遇到这种情况，你就得考虑进行打散操作了。同时，打散 的组件与打散的组件之间，不能直接创建位移变化，必须 成组(Ctrl+G或 Modify/Group)后才能进行。 提示：那么为何第一帧与最后一帧的组件不需要打散 呢？原因在于在它们各自这个过程里面没有任何变化(位置与形体上都保持原样，也就是说没有参与变形操作)，所以不用打散。 (9)．确认打散后，回到第 10 帧，并在 Frame (帧)面板中将 Tweening(渐变)设置为 Shape(变 形)，最后时间轴状态如图： 提示：变形动画的时间轴示意图跟位移变化是不 相同的，一个是绿色的，一个是蓝色的；当然，颜色 的差别是小事，最重要的是大家要了解位移动画与变 形动画在实际操作中的不同之处！ (10)．最后进行测试。 4.9.3 除了导引层，Flash 还有很多其他图层应用方法，下面是图层遮罩问题。 4.9.3.1Flash 层是透明的，最上面的层的空白处可以透露出下面层的内容，Flash 的遮照跟这个原理正好相反，遮罩层的内容完全覆盖在被遮罩的层上面，只有遮罩层内有内容的地区可以显示 下层图像信息。 提示：探照灯似的 Flash：黑色的背景上，只有一个探照灯，灯光打到什么地方就显示 出该处的内容。而这种技术的制作思路正是脱胎于 Flash 遮罩的。探照灯与灯光是遮罩层，要显示的信息是被遮罩层，当遮罩层的内容即灯光打到某个位置，被遮罩的下层信息则显示 出来。 4.9.3.2Flash 最终结果： ABCD 四个字从左向右移动，移动的地方会透露出 下层的红叶背景。 1．File(文件)/Import(输入)，将一个图形文件输入到 Flash 中，然后按 F11 键打开库窗口(Library)。如图： 15 2．将输入的组件拖入到第一帧的工作区中，并调整大小，最好该图片能够布满全层，以保 证遮罩层的文字无论移动到哪里都有下层信息透露出来。 提示：Flash 可以处理矢量图与位图，矢量图的优点在于，不论如何调整它的大小，文 件本身的体积不会改变；位图则不行，重新调整位图的大小会改变图像的像素排布，因此， 位图图像变大则文件体积变大，位图图像缩小则文件体积变小。 提示：在 Flash 中，请尽可能地使用矢量图，而且在做成组件时请尽可能地变小，因 为在应用到时可以将其变大而不会增加整个动画的体积。做为一个制作常识，大家应该予以 掌握。 3．新建一个图片类型(Graphic)的组件，并输入 "ABCD" 四个字。如图： 4．新建一个层(Layer 2)并将新建的 "ABCD" 组件拖进去。因为要让字体体从左移到右，所以请把该组件放到工作区外靠左 边界处。如图： 提示：放到工作区外的组件在动画开始时是看不见的，如果它 移动到工作区内则变得可见。 5．要让整个动画延续 20 帧，因此在第 20 帧处插入一关键帧，并把 "ABCD" 组件拖到 工作区右边边界外，如图： 6．现在为 Layer 2 层创建动作。由于只涉及到位移变化， 因此可以直接在第 1 帧的鼠标右键中选择 Creat Motion Tweening (创建移动渐变)，当然也可以在 Frame(帧)面板中选 Motion(移动)类型来决定动作。完成 后时间轴如图： 7．第一层(Layer 1)到目前只有一帧有内容，我们要保证 整个动画(共 20 帧)都要有 Redflower 背景，因此选中 第一帧，并在第 20 帧处插入普通帧(Insert/Frame)，此时的时间轴窗口如图： 8．现在是关键的一步，即让 Layer 2 成为 Layer 1 的遮照层！选中 Layer 2(层二)，并在右键弹出菜单中选择 "Mask(遮罩)"，完成后层窗口如图： 提示：工作区内变成一片空白了吧？这是因为遮罩层第一 帧的内容在工作区外，所以下层内容不能透露出来。 9．制作已经完成，现在按 Ctrl+Enter 键进行测试吧。 4.9.3.3Flash 最终结果：摄影机投射出光束，光束照射的地方显示出文字信息，没有灯光的地方则漆 黑一片。重点在于遮罩的思路，以及"旋转点"的改变。 制作思路：可以在最底层摆放文字，第二层放灯光，灯光要能转动。第二层作为遮照层， 也就是说第二层灯光打到的地方才能显示第一层的文字；由于在整个动画中摄影机图标始终 可见，我们可以再建一个新层即第三层来放摄影机图标。摄影机也要能够转动，而且还要能 够与第二层的光束转动同步。 16 4.9.3.4Flash 最终结果：文字成为遮罩层，而被遮罩的风景图片通过文字反映出来，同时从左向右移 动。 制作思路：文字成为遮照，那么文字的尺寸必须大点才能显示出比较连续的下层图片信 息；文字不能移动，那么风景图片就得移动，我们可以把一组图片输入到 Flash 中并由这 一组图片共同组成一个组件，最后给风景图片做个位移动画，并将文字层设为遮罩层就行了。 4.10 Flash Flash 的组件共有影夹、按钮、图片三种类型，前面已分别对它们进行了讲解，现在试 着组合运用它们制作动态的网站导航条按钮。 4.10.1 一共有两个按钮，分别是"菜单一"与"菜单二"；当鼠标移上按钮后字体由深蓝色变为绿色，同时弹出下层的动态菜单；动态菜单有自己的变化，先是由窄窄的一条线扩展成为按钮， 然后按钮上的字逐渐显现；"子菜单一"完全显示后再弹出"子菜单二"。 4.10.2 1．通过 Modify(修改)/Movie(电影)命令，将场景的背景色改为蓝色。 2．现在开始安排演员即制作组件。这个动画需要哪些组件呢？既然是动态导航栏上的按钮， 那么"菜单一"与"菜单二"两个主按钮不可或缺；鼠标移上主按钮后，弹出两个子菜单，那么 还需要两个子菜单组件，由于子菜单组件不需要再引发出动作，所以不需要制作成按钮，图 片(Graphic)属性就行了；由于鼠标移上主按钮时播放的是一段动画，因此两个主按钮的鼠标 移上动作(Over)还需要两个影夹组件。最后还需要一个组件，作为"互动学校"首页的背景。 制作： (1)．先制作背景组件(Symbol 1)，新建图片组件(Graphic)，然后在工作区上部输入"互动学校栏目构成"字样。字体下面画一无轮 廓矩形，颜色稍浅一点。如图： (2)．制作"菜单一"按钮(Symbol 2)。新建按钮组件(Button)，在 Up(一般状态)帧里面画一圆角矩形，Coner 设为 10 就行了，并在 Stroke (描边)面板上将轮廓宽度设为 2 ，轮廓色为深蓝色， 填充色为白色，画出的矩形如图二： 新建一层(Layer 2)，然后输入深蓝色字体"菜单一"，字体大小要合适，结果如图： 提示：输入字体不需要另建一层， 新建一层的目的在于对字体进行大小 调整时以免干扰层一的内容。 由于鼠标移上的动画还没做好，现在暂时将"菜单一"按钮放在一边，等动画做好后再放入按钮的 Over(鼠标移上)帧内。 (3)．制作"菜单二"按钮(Symbol 3)，由于它跟"菜单一"按钮只有字体的不同，其他都是一样的，所以直接进入"菜单一"按钮，按住 Shift 键同时选中两层，Edit(编辑)/Copy(拷贝)，然后进入"菜单二"按钮，Edit(编辑)/Paste(粘贴)，又一个"菜单一"图形出现了。选中字体工具 (Text Tool)放到"菜单一"的字体旁边，会出现一个字体输入的提示框， 选中"菜单一"字样并将其改为"菜单二"。如图： 同理，由于鼠标移上的动画还没做好，现在暂时不向此按 钮的 Over(鼠标移上)帧放内容。点按 Scene 1(场景一)图标退 17 出按钮组件的编辑。 (4)．新建一个图片组件作为"子菜单一"上的按钮(Symbol 4)。制作一个圆角矩形，并在矩形左边添加一条深蓝色线。具体设置请见第(2)点。结果如图： (5)．新建一个图片组件用以放置"子菜单一"按钮上的字体 (Symbol 5)。在制作时，最好先将刚才做好的按钮拉进工作区， 然后再输入"子菜单一"字样并依据按钮大小进行调整，最后再 将拉进来的按钮删了，该组件就只剩下字样了。如图： 提示：为什么不把"子菜单一"上的字体直接放到第(4)步来做？这是因为在动画播放过程中，先是按钮弹出的动画，紧接着才是字体显现的动画，它们隶属于不同的过程，因此有必 要将它们制作成分开的组件。 (6)．现在来制作"子菜单二"(Symbol 6)。 由于"子菜单二"跟"子菜单一"不同，它的按钮与字体只有一个逐渐显现的效果，它们隶 属于同一个过程，因此可以集中处理。前面已经制作好"子菜单一"按钮以及上面的字样，我们将它们直接拷贝过来，然后将按钮左边的横线删除，并在上部加入竖线。结果如图： (7)．现在开始制作响应鼠标移入事件的按钮动画(Symbol 7)。 新建一个组件，属性设为影夹(Movie Clip)，进入工作区。 在这个动画中包含三个过程：鼠标移入"菜单一"后，"子菜单一"的按钮逐渐弹出；"子菜单一"弹出完毕后，"子菜单一"字样逐渐显现；"子菜单一"字样显示完毕后，"子菜单二"逐渐显现。 A(Layer 1) 按照动画的先后顺序进行制作：在第一层的第一帧，将 Symbol 4 放入，弹出动画将延续 15 帧，因此在第 15 帧插入关键帧(Keyframe)；所谓的弹出动画，只不过是 Symbol 4 组 件由窄窄的一条竖线变成一个完整的按钮的过程，因此它属于缩放变形动画，我们只需要在 第一帧将 Symbol 4 组件压缩成一条窄窄的竖线，然后创建一个动作就行了。 在进行缩放前，我们先把"洋葱皮"视图模式打开，以便进行多帧编辑：点按时间轴下面的图 标，时间轴会变成如图的样式： 时间轴上出现了两个圆圈，它们分别代表洋葱皮的起始 帧与终止帧，凡是在这个范围内的帧都可在同时间进行 显示。现在我们把右边的圆圈拉到第 15 帧，时间轴会 变成如图的样子： 工作区中的内容也会有所变化，从第一帧到第十帧的内容 全显示出来了。如图： 提示：洋葱皮模式的作用在上面说得很清楚，它主要 是用来进行多帧编辑的工具，在进行起始帧与终止帧的元素精 确定位时，它常常是必不可少的步骤。 光是洋葱皮模式还不够，在层面板上把此层改为"外框模式"，改变后层面板如图： 工作区中的内容也变了，只剩下各帧的轮廓图，如图十二： 前面也说过，组件有个注册点，它是缩放与旋转操作的参照点， 因此有必要先改变 Symbol 4 的注册点再进行缩放。选中第一帧 中 Symbol 4 组件，Modify(修改)/Transform(变形)/Edit Center(中心编辑点)，然后将注册点拉到与第十五帧左边起始位置的重合 点上。同时清除从第 2 帧到第 15 帧的内容，因为它们的注册 18 点不符合。完成后再重新在第 15 帧插入关键帧，此时所有帧的注册点都一致了。前面做的 从第 1 帧到第 15 帧的过渡，只是用来进行原理解说，没有其他用处。如图： 提示：将第一帧的 Symbol 4 组件进行缩窄是不是非要改变注册点位置？你可以试着不 改变，将它缩窄后再用鼠标将其拖到第 15 帧左边界上，这种效果也是一样的。 提示：如果没有"洋葱皮效果"与外框模式的支持，你能如此轻易地确定注册点位置吗？ 现在将第一帧的 Symbol 4 尽量向左缩窄 (Modify/Transform/Scale)，如图： 缩窄后，从第一帧向第十五帧创建动作，鼠标右键并在弹 出菜单中选 Creat Motion Tweening(创建移动渐变)，如图： B(Layer 2) "子菜单一"的按钮图形显示完毕，现在该进行"字菜单一"字样(Symbol 5)逐渐显示的动画了。因为第一层按钮图 形的显示动画在第十五帧停止，因此第二层字样显示的动 画则应该从第十五帧开始。 选中第二层(Layer 2)的第十五帧，插入关键帧(Keyframe)，并将 Symbol 5 组件拖入工作区，注意其位置，要跟层一 的按钮图形相得益章。如图： 想让你的字体动画延续多少帧？这里让其延续 13 帧，因此在第 28 帧处插入关键帧，如图： 现在回到第二层(Layer 2)的第 15 帧，并通过属性面板将其 Alpha (透明度)值改为 24% ， 并创建从第 15 帧到 28 帧的动画，完成后时间轴如图： C(Layer 3) "子菜单一"的动画全部完成，现在该播放"子菜单二"(Symbol 6)逐渐显现的动画了。由于"子菜单一"全部动画延续了 28 帧，因此第三层的"子菜单二"动画从第 28 帧开始进行。 新建一层(Layer 3)并选中第 28 帧，插入关键帧 (Keyframe)，并将 Symbol 6 拖入工作区。请注意它的位置，应该与前面两层的组件相适应。 如图十九： 提示：应该在第一层将按钮背景也显示出来才能显示出 按钮的外框来，因此应该将第一层的动画延续到第 28 帧。 我们要让"子菜单二"的动画延时 12 帧即 1 秒钟，因此在第 40 帧处插入关键帧，然后回到第 28 帧，通过 属性将其 Alpha (透明度)值改为 10% ，如图： 创建从第 28 帧到第 40 帧的动画，完成后时间 轴如图： D "子菜单二"显示完毕后并不是立即回到第一帧重新 播放第一帧内容，而是有 5 帧的延迟展示，因此我 们在第三层(Layer 3)的第 45 帧插入过渡帧(Frame)， 19 完成后时间轴如图： 在整个动画中，Layer 1 与 Layer 2 的内容始终可 见，因此回到第二层与第一层，并分别为它们插入 第 45 帧的过渡帧，完成后时间轴如图： "菜单一"的动画全部完成。 (8)．"菜单二"的动画制作：(Symbol 7 Copy) 明白了第 (7) 点的制作原理就可以很轻松地 制作此类动画了，将菜单一的动画拷贝过来作为菜 单二的动画，因此本组件的名字为 Symbol 7 Copy ，表示是 Symbol 7 的拷贝。如图： (9)．现在把"菜单一"的动画拖到按钮中去： 进入"菜单一"按钮(Symbol 2)，在第一层(Layer 1)与第二层(Layer 2)的 Over(鼠标移上)帧里插入关键帧(Keyframe)，并将第二层的字体由蓝色变为绿色；然后新建一层用来放响应鼠标事件的动画，在 Layer 3 的 Over 帧里拖入"菜单一"的动画组件(Symbol 7)。如图： (10)．现在把"菜单二"的动画拖到按钮中去： 进入"菜单二"按钮(Symbol 3)，并在 Over(鼠标移上)帧里将字体由蓝色改为绿色，再新建一层，同样将"菜单二"动画组件(Symbol 7 Copy)拖进 Over 帧。如图： (11)．现在回到场景一(Scene 1)，将"互动学校"背景组件拖进工作区并调整其大小，最好能铺满工作区，如图： (12)．最后将"菜单一"按钮(Symbol 2)与"菜单二"按钮(Symbol 3)拖到工作区内的合适位置并按 Ctrl+Enter 键进行测试。如图: 4.10.3 Flash 制作有时只是各种组件的堆砌，因此无论多么复杂的动画，首先你就得将所需组 件制作出来，然后根据不同需要进行安排。组件采用哪种属性是有讲究的，图片型组件 (Graphic)重在展示，按钮组件(Button)重在响应鼠标事件，而影夹组件(Movie Clip)则重在自 动播放一段预先做好的动画，三种组件常常互相套用。 相信有了前面的基础,应该能非常轻松地制作 MTV 了。首先将要用到的图片资料与音 20 乐凑齐，然后将它们输入到 Flash 中并做成组件，最后再按照我们的意愿将它们通过时间 轴与层组织起来就行了。 提示：正如上面的制作，如果你需要一幅图或一句歌词从哪一帧(即什么时候)开始，那 就建一个层并在相应的帧插入关键帧，并将组件拖进去，然后辅以一定的变形、位移，或 Alpha 透明就行了。 提示：制作 MTV 是一个相当费时的过程，其中大部分时间在于处理音乐与组件同步 的问题。以前的老办法是一句一句地听，然后将歌词组件或图片组件在合适的时间进行插入； 现在有个新方法了。 4.11 Flash (Action) 交互类动画的制作离不开action,Flash 的action是基于其本身的语言 ActionScript，。相 对于同类动画制作软件的语言，如 Director 的 Lingo 语言，ActionScript 更为直观，掌握 起来也比较容易。 4.11.1Action Windows(窗口)/Actions(动作)命令，弹出如图的面板： 提示：本面板名为"Frame Actions(帧动作)"，动作设置(Actions)应该是专门针对帧进行设置的。另外，双 击任意帧也能打开此面板。 动作面板中，左边是动作类型，双击任意一个类型 可以展开其下的许多具体动作；右边是具体的参数显示 窗口，根据你所选的动作而不同，因此你不需要懂得太多 ActionScript 语言就能很方便地 使用它。 参数窗口中的参数可以进行拷贝、粘贴、删减，操作方法是选中参数然后在鼠标右键中 进行选择。 4.11.2Flash Action 1．Play(播放)：从设定的帧开始播放。本动作常常用于影 帧跳转的场合，如鼠标点击后才能跳到某一帧并开始播放 该帧的内容。本动作不需要参数(No Parameters)，直接设定就行了。如图： 2.Stop(停止)：动画放到此帧时自动停止播放，本动作不需 要参数。如图： 3．Go To(跳至)：经常用到的 Action ，通过它可以控制影 片的播放顺序，从一帧跳转到另外一帧。使用它只需将要 跳转的影帧设定标签(Label)然后将标签输入参数就行了。 如图： Scene(场景)：主要针对有多个场景的动画，比如要从 场景一的某帧跳到场景三的某帧，先就得在 Scene 对话框中输入 Scene 3 (场景三)。 Type(类型)：跳转类型，默认是 Frame Number(帧数)，即以第几帧为标准进行跳转；除此之外，还有 Frame Label(帧标签)、Expression(表达式)、NextFrame(下一帧)、、Previous Frame(前一帧)。选择方法是用鼠标点一下 Type (类型)旁边的输入框，然后会出现如图的下拉选择框： Frame(帧)：在这里输入要跳转的帧的标签。 21 Go to and Play(跳至并播放)：如果勾选此项，那么动画跳转到某帧后会自动继续播放该 帧后的内容；如果没有勾选，影片跳转后则自动停止下来。 4．Get URL(获取 URL)：可以利用它在影片播放到预定的地方自动跳转到指定的网页或文 件上去。其面板如图： URL：要链接到哪个网址去，直接将网址输入此对话框就行了。支持表达式，如用 Javascript 或 CGI 编写的地址跳转表达式，不过需要勾选其后的 Expression 复选框。 Window(窗口)：打开方式，其中，_self 是在本窗口中打开，_blank 是另外打开一个窗口显示链接文件；也可以是表达式。 Variables(参数)：参数的传送方式，普通情况下不需要传递 参数，即默认的 Dont't Send (不传送)状态；如果有参数传递， 如表单提交、身份验证等情况，可以在 Send Using Get(用"Get" 命令进行传送) Send Using Post(用 Post 命令进行传送)两种方 式中进行选择。操作方法是选中此参数框后，然后按键盘上的 上下键。 5．Load Movie(载入影片)：利用此动作可以在预定帧装载另外 一个影片文件，必须在 URL 栏中输入该影片文件的地址。如 图： Location(位置)：共有两种位置，一种是 Level(阶层)，一种是 Target(目标)。所谓阶层是指加载动画所在的层，阶层数值越大， 所加载的动画越在上面，当两个动画重叠时，阶层数大的动画 就会覆盖阶层数小的；Target(目标)指定了加载动画所代替的当 前动画片段。 6．Unload Movie(影片卸载)：也有两种位置(Location)：Level(阶层)与 Target(目标)，如图： 7．Tell Target(告知目标)： Flash 中经常会用到的一个 动作，其功能是 Go To(跳转)、Play(播放)以及 Stop(停止) 等动作的合力。但请注意，在告知目标前得首先为被告知 的目标确定一个实体名称，然后就可以在 Target 输入框 中输入实体名称并进行告知了。如图九： 提示：一般来说，Tell Target(告知目标)常常是与 按钮组件一起使用的，而且支持嵌套。 8．If Frame Is Loaded(如果帧 已经装入)：常常 在制作片头 Loading 时用 到。为了避免网 速的影响，放在网上的 Flash 动画可以先做个 Loading(下载 中)，表示动画正在下载，让访问者耐心等待；当最后一帧也 下载完毕就开始播放动画。这时这个最后一帧就是 If Frame Is Loaded 的对象帧，即当此帧已经装入后才开始播放动画。如图： 22 9．On Mouse Event(鼠标事件)：响应鼠标事件的动作集合，常常与按钮组件有关。如图： 提示：选中某帧是没法对鼠标事件进行设置的，必须选中工作区中的组件才能激活此面板。 Press：按下鼠标。 Release：放开鼠标。比如一个按钮组件，我们将其 Release 事件激发为 Get URL(获取 URL)，那么凡是点击此按钮就会进入相对的网页地址。 提示：鼠标点击动作其实分为两步，按下与松开，因此 Get URL 事件常常由 Release 激活，而非 Press 动作。 Roll Over：鼠标移入引发的事件。 Roll Out：鼠标移出引发的事件。 4.11.3 Action 除了上面谈到的常用动作外，Flash 中还有很多其他 Action ，如调用(Call)、中断(Break)、条件(Do While)、设置 参数(Set Variables)，以及多种运算元(Operations)、属性(Properties)，等等，不过它们大多属于 Flash 的高级应用，超出了神童教程的范围，因此不作详细说明。当大家对 Flash 的认 识日益深化时，再来学习这些知识，才能收到应有的效果。 4.12Flash常识补遗 4.12.1Flash Flash 动画的保存，共有三种方式："Save(保存)/Save As(另存为)"；Export Movie(输出 影片)；Publish(发布)。如果最终文件要保留具体的图层信息和后期的可编辑权，那就用 "Save(保存)/Save As(另存为)" ；如果最终文件直接输出成影片，就用 Export Movie(输出影 片)；如果要用指定，如网页的超文本(HTML)直接进行发布，而不是另外添加代码对最终结果进行引用，则可以用 Publish(发布) 命令输出最终结果。 1/ Save(保存)/Save As(另存为)命令，弹出如图 的保存文件对话框： 在文件名中键入文件的名字并选择文件的 存放位置，然后单击"保存"按铵，文件就以 .fla 格式进行保存。这种保存结果能够保留所有的图 层信息，可以用 Flash 打开进行再编辑，但文件 最大。 2Export Movie() File(文件)/Export Movie(输出电影)命令，弹 出如图的对话窗口： 输入要保存的文件名，选择存放位置，如果 需要，还可在保存类型下拉框中选择适当的文件 类型。保存类型下拉框如图： 该下拉框中包含了 Flash 可以输出的文件 类型，用户可根据需要进行选择。 单击"保存"按钮，系统弹出设置对话框，如图四： 根据需要可以更改载 入顺序(Loaded Order)、JPEG 图片品 质(JPEG Quality)、 23 Flash 版本(Version)、是否产生文件大小报表(Generate size Report)，以及音效设置(Audio)。 3Publish() 最终结果还可以直接进行发布，要进行发布设置，单击 File(文件)/Publish Settings(发布设置) 命令，弹出如图的对话框： 在这个面板上，可以对发布格式进行设置，它们分别是 Flash 格式(.fla)、HTML网页文件格式(.html)、GIF影像格式 (.gif)、JPGE影像格式(.jpg)、PNG影像格式(.png)、Windows 项 目格式，即可执行文件(.exe)、Macintosh 项目文件、QuickTime 播放文件(.mov)、Realplayer 播放文件(.ram)。 设置好后单击 Publish(发布)按钮进行发布就可以了。 4.12.2Flash 1 在前面我们已经讲了组件对减小文件体积的作用，在 Flash 中，组件只会被装载一次，以后再使用该组件，或者该组件有什么属性变化，不需要再行下载了，不会增加文件的体积。 2Flash Flash 中有变形(Modify)操作，可以重新定义图片的大小，但记着，对于输入 Flash 的图片，最好先在其他图像处理软件如 Photoshop 中调整好大小再进行导入，而不要直接导 入后再用变形命令进行大小调整。这是因为，导入的图片，无论你将其变得多大还是多小， 都不会改变组件中原图的体积大小，只有在导入之前就把它调整好才行。 对于 Flash 中的位图，它的任何变化都涉及到 CPU 的重新计算与屏幕重刷，因此， 位图在 Flash 中尽量以静止的背景形式出现。 3 在 Flash 中，要做到"惜力如金"，能用两个组件做成的动画，就不要费力地做三个组件， 能够用三条直线构成的图案，就不要用三条虚线来表示，能够用系统默认字体表达清楚的， 就不要使用其他字体。总之，你的动画除了在自己机器看外，还得考虑其他人在他们自己的 机器上看的情况。直线、默认字体，在大多数电脑上是通用的，不需 CPU 另外进行解析，这样，你的动画就可能更流畅一点。 Flash 1、启动Flash后，按“Ctrl+N”新建一个动画，按“Ctrl+M”打 开影片属性窗口，设置影片大小为80Px×80Px，背景色设为 黑色。 2、现在来做一个地球前景。按“Ctrl+F8”插入一个“Graphic(图 形)”，取名为“前景”，使用圆形工具画一个圆。设置圆形的 填充色，选择“Windows?Panels?Fill和Mixer”打开填充和 颜色控制面板，然后选择“Radial Gradient（射线）”，点选前面的小划块，把Mixer面板中的“Alpha”调节到“0%”，这样可以使圆圈中间透明，点选后边的小划块，把颜色设置为深蓝。 默然的填充效果是正中的，我们可以选择漆桶选项中的“Transform Fill（转换填充）”把填充的中心向左上角移动一下，这样可以使地球看上去有些立体效果。 3、按“Ctrl+F8”插入一个图形，取名为“圆形”，画一个圆，填充颜色可随意。再插入一个图 形，取名为“地图”，用铅笔工具（Pencil）在工作区勾勒出一个平面的世界地图（也可导入 24 位图，然后进行打散扣图），然后用油漆桶工具（Paint Bucket Tool）将其填充为绿色，把用铅笔工具画出的边缘删除，最后把整个地图再复制一个，将两个地图并排。到这里我们需 要的素材就准备齐全了。 1、返回到场景中，把图库中的“前景”拖拽到图层1中，然后在50帧处单击右键，选择“Insert Frame（插入帧）”。 2、新建一个图层，取名为“圆形1”，把图库中的“圆形”拖拽到该层中，调整位置使其和“前景”图层中的圆形重合，并在50帧处插入帧。新建一个图层，取名为“前景地图”，在第一帧插入关键帧，把刚才做好的图库“地图”拖入，调整地图的位置使非洲刚好超出圆形一点；在 25帧插入关键帧，向左移动地图到南北美洲，使南北美洲在圆形的中心；最后在50帧处插入关键帧，继续移动地图，使第二个非洲刚好超出圆形一点，这样安排地图位置的好处是动 画在播放时更加流畅，不至于有打更现象。然后分别把第1帧到25帧和25帧到50帧设置为“Motion (运动)”，最后在“圆形1”图层上点右键，选择“Mask（遮罩）”。 提示：在调整地图位置时，地图被圆形遮挡，不便于观看，可在“图形1”层上单击“Show/Hide All Layers（显示/隐藏图层）”隐藏圆形。 到这里已经有了大体的效果，下面我们要做的是背面转动的地球，有了这个效果动画会更加 完美。 3、插入一个图层，取名为“圆形2”，把图库中的“圆形“拖拽到该层中，调整位置使其和“前景”、“圆形1”图层中的圆形重合。然后在50帧处插入帧。 4、再插入一个图层，取名为“背面的地球”，在第一帧插入关键帧，把图库“地图”拖入，选择“Modify—Transform——Flip Horizontal”进行水平转换。在工作区中的地图上单击右键， 选择“Panels——Effect”，调整地图的颜色，由绿色改为黑色，调整其位置，使其和正面地球 相符合。在第50帧插入关键帧，把地图的位置向右移动，并在1帧和50帧之间设置“Motion (运动)”。最后在“圆形2“图层上点右键，选择 “Mask（遮罩）”。 到这里整个动画就完成了，图2就是整个动画 的时间线，“Ctrl+Enter”看看吧。 25