Fireworks 3 标准培训教程
动画技术基础
F本课简介
在本课中，主要介绍了动画技术的两个内容：帧的管理和洋葱皮技术。此外还介绍了动画创建的一个常用方法，即通过打开多个文件创建动画。
Fireworks提供了强大的动画制作和和动画编辑的功能，既可以打开编辑已有的动画，也可以从头开始新建动画。动画一般包含多幅图像，通过帧来控制这些图像在不同时间上的显示，就形成了动画。
通过本课的学习，读者应掌握基础的动画技术，掌握帧的管理和洋葱皮技术。
F本课要点及难点
帧的概念
帧的重新排序
帧的复制
将运动对象复制到帧中
将对象分发到帧中
打开动画时帧的安排
洋葱皮技术的使用
F1、帧的管理
动画技术的核心是帧，在学习动画技术之前，必须深入理解帧的概念，熟练掌握帧的管理。
1.1 帧的概念
正常的Fireworks文档中可以分离出动画的原因在于动画有多少帧。刚开始在Fireworks中进行动画设计的时候，图层和帧之间的关联理解起来可能比较困难。但是，理解图层和帧的工作情况以及相互之间的关联是动画处理的基础。
帧就像在传统的电影胶片中可以通过电影放映机播放的帧一样。播放动画的时候，在某一时刻只能看到一个帧。首先显示第一帧，然后是第二帧、第三帧等等。当在文档中添加一帧的时候，实际上增加了电影胶片的长度并延长了电影的时间。如果在帧面板中更改了帧的顺序，可以设想是将电影胶片的帧剪切下来放在胶片中另外的位置上。如果将第五帧移动到电影开始的第一帧之前，所有的帧都将重新编号，于是原来的第五帧现在变成了第一帧，原来的第一帧现在变成了第二帧等等。
动画中的图层就像堆叠到一起的电影胶片。播放动画的时候，第一帧的所有图层将同时显示，然后是第二帧的图层，然后是第三帧等等。就像在Fireworks中使用静态图层一样，动画中的图层用于组织对象的摆放次序并记录不同帧之间同一对象的细微变化，便于编辑。当在文档中添加一个图层的时候，就好像加入了一盘新的电影胶片。在图层面板中更改图层次序就像改变堆叠在一起的电影胶片中胶片的次序一样。
在动画中添加一帧的时，该帧就像所有其他帧一样具有同样的图层。如同用电影胶片比喻图层一样，在堆叠胶片中一个胶片上添加一帧的时候，也同样添加在其他帧之中，这就相当于增加了一盘新的电影胶片，它的长度与所有其他胶片的长度一样。
图层和帧之间一个很有用的相互作用就是图层共享的能力。当共享一个图层的时候，该图层的内容在每个帧中都相同，无论修改该图层中哪个对象，这种改变都将体现在每个帧中。这就大大方便了静态内容，例如背景的处理。在后面将详细讲述这方面的问题。
由于有大量的动画处理工作需要在帧面板中处理，所以在创建动画的过程中，需要该面板始终显示在屏幕上。从这个面板中，用户可以添加、删除、重新排序或者复制帧。可以浏览编辑单个帧、一组帧或者所有的帧。可以从一个帧中复制或者移动对象到另外一个帧中。下面几个小节中要讲述这些技术。
如果用户的【Frames】面板和【Layers】面板没有组合到一起，可以将它们停靠在一起如图1所示。这样就可以在进行动画制作的过程中方便地切换和操作。如果不在乎占据屏幕的大小，还可以将两者并列放置。
图1 帧面板和图层面板并列放置
1.2 动画工具简介
Fireworks中主要的动画工具包括：
【Frames】面板：在这里可以处理Fireworks动画帧，就像剪辑电影胶片一样，可以将一帧中的对象移动或者复制到另外一帧当中。这是Fireworks动画功能的核心工具。
【Layers】面板：在这里可以管理Fireworks帧的各个图层。可以将对象分别放在各个帧的同一个图层上来实现动画，也可以让所有帧共享一个图层，于是可以将所有背景或者静态对象都创建在这个图层上。
状态条VCR控制：可通过这些控制变换不同的帧，或者控制整个动画的播放。
Fireworks 3.0在图层面板中提供【Forward】和【Backward】按钮，在Fireworks 3.0加强了对帧的控制，提供了第一帧【First】、最后一帧【Last】、下一帧【Next】和前一帧【Previous】按钮，可用于播放、停止或者选择某一帧。
【Export Preview】导出预览对话框中的【Animation】选项卡：在这里可以设置像帧定时、是否可见、循环播放或者优化，例如帧的处理方法等控制。
1.3 添加帧
在Fireworks中开始创建动画的时候，文档就有且仅有一个帧。显然，要想模拟任何动作都必须加入帧。首先，大致估计一下动画应该包含多少帧。然后将相应数目的帧加入到文档中。在后面的操作中，还可以根据需要添加或者删除帧。
如果要向帧列表中增加一个帧，单击帧面板底部的增加帧按钮图标是一张白纸，或者选择菜单命令【Insert】->【Frames】。
如果要在帧列表中特定位置增加一个或多个帧，按如下步骤操作：
J步骤
（1）帧面板选项弹出菜单中选择增加帧命令。Fireworks显示出【Add Frames】对话框如图2所示；
图2 【Add Frames】对话框
（2） 在【Number】文本框中键入要加入的帧的数目，或者使用滑标来设置（滑标最多设置10帧）；
（3） 选择插入新帧的位置。可以选择的选项有：【At the beginning】，【Before current frame】、【After current frame】，和【At the end】，单击【OK】按钮完成操作。 新的帧创建完毕并被加入到帧列表1中指定的位置上。
1.4 删除帧
删除帧的时候如果需要删除该帧中那些位于共享图层中的对象之外的所有对象时要小心。
I注意
如果不小心删除了一帧，希望将它恢复到帧列表中，可选择菜单命令【Edit】->【Undo】或者使用键盘快捷键【Ctrl+Z】。 如果要删除一帧，在帧列表中选择该帧然后按如下任意一种方法操作：
J步骤
（1） 单击位于帧面板底部的删除帧按钮
。
（2） 将帧拖动到帧面板底部的删除帧按钮上。
（3） 从帧面板中的选项弹出菜单中选择【Delete Frame】命令。
1.5 帧的重新排序
随着动画制作的过程不断推进，可能希望改变某些帧的次序。
如果要对帧进行重新排序，在帧面板中点中相应的帧并拖动到合适的位置即可。
在图层面板的操作过程中，拖动图层来改变图层的堆叠次序之后，各个图层的名称依然不变，但是在帧面板中用同样的方法改变帧的次序之后，所有的帧将显示新的位置帧号。动画中第一帧仍然显示为Frame 1。
1.6 帧的复制
节省时间、提高效率最有效的方法之一就是复制一系列已经创建好的帧，然后在复制的帧的基础上进行修改。如果已经创建了一个日出的动画，可以复制这些帧，然后对复制后的帧进行水平翻转，再进行逆序排列就可以得到日落的动画。这不仅可以节省时间和精力，而且还可以保证太阳沿着升起的路径落下。
如果要复制单个帧，将相应帧拖动到帧面板底部的增加帧按钮上即可，复制后的帧插入到帧列表中原始帧的后面。
如果要复制一个或者多个帧并将复制后的帧放到帧列表中指定的位置，按如下步骤操作：
J步骤
（1） 从帧面板的选项弹出命令菜单中选择【Duplicate Frame】命令。Fireworks显示出【Duplicate Frame】对话框。【Duplicate Frame】对话框与【Add Frames】对话框十分类似，如图3所示；
图3 【Duplicate Frame】对话框
（2） 在【Number】文本框中键入要复制的帧的数目，或者使用滑标设置复制数目，滑标设置最大值为10；
（3） 选择复制帧的插入位置。可以选择的位置有：【At the beginning】、【Before current frame】、【After current frame】和【At the end】。单击【OK】按钮完成操作。 于是完成帧的复制，并将复制的帧插入到帧列表中指定的位置上。
1.7 将运动对象复制到帧中
创建动画的一个重要部分就是处理文档中对象随时间的变化情况。如果是创建简单的日出动画，太阳将从画布上一个较低的位置升起，然后慢慢移动到画布上一个较高的位置。同时，云彩可能要从左边移动到右边，地面和天空保持不变。
现在，不需要对所有这些对象都多次重画，全部重画不仅浪费大量的时间，而且还很难保证各帧中对象的大小和特性完全一样。如果太阳在帧的变化过程中慢慢改变大小，就会损害动画的效果。
在创建动画的时候，只要创建对象一次，然后将其复制或者分发到各个帧当中，在各帧当中移动对象并对对象进行少量的修改，从而完成运动以及各种变化。
在帧之间复制对象的时候将类似的对象保留在各自的图层中，可以方便对象的处理，在日出动画创作的例子中，可以将太阳放置在一个图层中，云彩放置在另一个图层中。
如果要复制一个或者多个对象到另外一个帧当中，按如下步骤操作：
J步骤
（1） 选择要复制的对象；
（2） 从帧面板的选项弹出命令菜单中选择【Copy to Frames】命令。其对话框如图4所示；
图4 【Copy to Frames】对话框
（3） 选择复制帧放置的位置。有效选择为：【All frames】、【Previous frame】、【Next frame】和【Range】，使用范围选项可以指定一系列的帧。单击【OK】按钮完成操作。
1.8 将对象分发到帧中
如果选择将一组对象发到帧中，那么对象组将被分发到当前帧之后的帧中，并且保持分发对象原来的次序。对象组中最下面的对象留在当前帧之中，其上面的一个对象放在下一帧之中，再上面的一个对象 放在下下帧中等等。如果在一个空的画布上创建三个对象，例如正方形、圆形、和星型，那么星型位于最上层，因为它是最后被创建的。如果选择这些对象并分发到动画的各帧中，那么星型创建的帧就放在动画中最后一帧上。必要的时候，会增加新的帧来容纳分发的所有对象。例如，如果将10个对象分发到5帧上，那么就会增加5个新的帧来容纳所有对象。
利用这种方法可以快速将静态文档转换为动画。画布上首先创建的对象位于动画的开始。
如果读者正在创建的动画中有一个对象始终保持在画布上某个位置，只是该对象的某些属性在改变，那么可以使用【Distribute to frames】命令进行快速处理。在第一帧中创建该对象，并使用菜单命令【Edit】->【Clone】来进行复制，于是原始对象位于复制对象的正下方。将复制对象进行必要的修改之后再次复制，对复制后的对象再进行修改，如此反复，直到完成所有的对象。选择这些对象并从图层面板的选项弹出命令菜单中选择【Distribute to frames】命令，这些对象就变成了动画。
如果要在多个帧中分发一系列对象，选择对象之后，按如下任意一种方法操作：
K方法
（1） 单击帧面板底部的分发到帧中按钮图标为电影胶片。
（2） 从帧面板选项弹出命令菜单中选择【Distribute to frames】命令。
（3） 将选择对象定界框上的蓝色选择图标拖动到分发对象帧中的按钮上。
F2、打开多个文件创建动画
在Fireworks中可以打开并编辑GIF动画。当GIF动画打开时，Fireworks可以把基于半数以上被导入帧中的共同像素创建一个名为【Background】的共享层。
在【Frames】面板的每个相互分隔的帧上放置动画组件。这些组件将作为图像对象放置在名为GIF的层上。如图5、图6所示。
图5 【Frames】面板 图6、在【Frames】面板放置动画组件
要编辑动画GIF，可选择【Frames】面板上的帧后做出修改。
Fireworks可以基于一组图像文件创建动画。例如，如果要基于若干已有图形创建网页横幅广告，则可以单击【File】->【Open Multiple】命令打开所需图形，然后将它们放置在相同文档的不同帧上。
要按动画格式打开多个文件，请按以下步骤操作：
J步骤
（1）单击【File】->【Open Multiple】命令，此时将出现【打开】对话框。
（2）在【打开】对话框中浏览并定位文件，然后单击【Add】按钮将选定文件添加到要打开的文件列表中。如图7所示，要添加当前目录中的所有文件，可单击【Add All】。要取消打开某文件，可在要打开的文件列表中选定该文件，然后单击【Remove】；
（3）选中【Open as Animation】复选框，然后单击【Done】按钮。Fireworks将在单个文档中打开所选文件，每个文件都按【打开】对话框中选定的顺序放置在分隔的帧中。如图8所示。
图7 打开多个文件 图8 将四个文件打开为动画的帧面板
F3、洋葱皮技术
大多数情况下，文档窗口显示的是单帧中的内容。通过向前、向后翻帧，可以感觉到动画的运行方式，但是这只是一种非常粗糙的比较方式。要得到帧与帧之间在视觉上变化的精确信息，需要使用【Onion Skinning】视图来观察甚至同时编辑多个帧。
洋葱皮是一种传统的动画创作技术，在半透明的描图纸上绘图，以便同时看到一系列的绘图效果。现在，在Fireworks中可以使用新的洋葱皮技术，同时处理一系列的帧。
洋葱皮按钮位于帧面板左下角，通过它可以访问【Onion Skinning】的弹出菜单如图9所示。并选择希望看到的帧。可以选择动画中任意范围的帧，也可以选择所有的帧。
图9 帧面板的弹出菜单
当打开洋葱皮选项的时候，当前帧上的对象按正常方式显示，其他帧上的对象则显示为较暗淡的形式。如果使用文档窗口下面的帧控制来播放动画，洋葱皮视图会暂时关闭。
设置用洋葱皮处理的帧的范围，使用如下任何一种方式都可以打开洋葱皮视图并选择一定范围的帧进行显示：
K方法
（1）使用【Onion Skinning】范围选择器，在帧面板中帧列表的左边指定某个范围之内的帧。这是指定系列帧的最快方法，尤其是在处理较短的动画时候。如果要扩大范围，使其包含更早一些的帧，在选择器上面的空格上单击。如果要关闭【Onion Skinning】，单击选择器下面的端点即可。
（2）在帧面板上的【Onion Skinning】选项弹出菜单中可以选择预设的范围。如果要显示当前帧和下一帧，选择【Show Next Frame】命令。如果要显示前一帧，当前帧和下一帧，选择【Before and After】。如果要显示所有帧，选择Show All。
（3）从【Onion Skinning】选项弹出菜单【Custom】命令可以显示【Onion Skinning】对话框如图10所示。这个对话框可以精确地控制将要显示的帧，以及各帧的遮挡关系等。在【Before Current Frame】当前帧之前的帧和【After Current Frame】当前帧之后的帧文本框中输入帧数，在【Opacity】不透明度中输入不透明度。0表示帧内容不可见，100表示这些帧中的对象就像当前帧中的对象一样清晰。
图10 控制洋葱皮显示的参数设置
F4、上机习题及本课习题
上机习题
（1） 自己绘制几幅图画来练习帧的各种操作。
（2） 将以前绘制的几幅图形文件打开来创建动画。
本课习题
1、判断题：
（1） 播放动画就是将动画的图层一层一层的打开。 （ ）
（2） 洋葱皮技术就是设置处理的帧的范围。 （ ）
（3） 当共享一个图层的时候，该图层的内容在每个帧中都相同，无论修改该图层中哪个对象，这种改变将体现在每个帧之中。 （ ）
（4） 动画是通过帧来控制图象在不同时间上的显示而形成的。 （ ）
2、选择题：
（1） 创建一个10帧的动画时，该文档包含几个帧。 （ ）
A、10 B、11 C、12 D、13
（2） 打开洋葱皮视图有几种方法。 （ ）
A、2 B、3 C、4 D、5
（3） 以下哪一项是Fireworks动画功能的核心工具。（ ）
A、帧面板 B、图层面板 C、状态条VCR控制 D、导出预览对话框中的Animation选项卡
（4） 打开一个10帧的GIF动画，在Frames面板中存在的帧数有（ ）。
A、10 B、11 C、12 D、13