1、Flash动画制作,李天和 Email:,第三章 动画入门,1、基础知识 2、帧动画 3、运动合成动画 4、形状合成动画,3.1.1 动画原理当我们坐在电影院看电影时,我们仿佛感觉得演员就在银幕上表演那不是真的!道理很简单:电影放映时,连续的静止画面在放映镜头前快速地更换,利用人眼的视觉暂留现象,使我们看电影的观众认为银幕上的演员动作起来。理论证明,只要电影拷贝的连续画面每秒钟更换16幅时,连续画面就会在人眼中产生没有闪烁的动画影像。 在计算机动画制作中,构成动画的一系列画面称为帧。一般情况下,连续的动画播放速度不得低于24帧秒。早期的动画影片是画师用手工绘制,再由摄影师拍摄而产生的。计算机动
2、画的产生同手工制作动画的原理相同,每一个动画均是由多幅连续有序的静止画面构成。 Flash动画是以时间轴为基础的帧动画,每个Flash动画作品都以时间为顺序,由先后排列的一系列帧组成,帧是构成动画作品的基本单位。,3.1.2 Flash动画的分类各种各样的动画五彩缤纷,动画的制作技巧也层出不穷,究竟怎样将Flash动画进行分类呢?将Flash动画进行分类,一般是按动画创作的方法来区分的。制作Flash动画既可以一帧一帧的绘制,也可以只设定两个关键帧,由计算机运算逐渐改变的中间画面来完成。因此,Flash动画一般可分成两大类:逐帧动画与渐变动画。渐变动画又可以根据两关键帧之间的变化对象分成形状渐
3、变动画(变化对象是图形)和移动渐变动画(变化对象是元件),如图3-1所示。,图3-1 Flash动画分类,3.1.3 关于帧在时间轴上,一个一个的格子就是帧。帧是构成一个连续动画最基本的元素,一个动画是由若干个帧按照时间序列排列而成的。这些帧按照从左到右播放,就形成了动画。在Flash MX 2004的时间轴中,主要有两种帧格式,一种是关键帧,另一种是普通帧,下面具体介绍这两种帧格式。,1、关键帧关键帧是指动画中定义的可以更改的帧,它通常显示动画的开始与结束的决定画面。Flash MX 2004可以在两个关键帧之间创建补间或填充帧,而不需要用户编辑中间每一帧的内容就可以生产流畅的动画。使用关键
4、帧,创建动画显得更为简易。也就是说,只要安排好前后两相邻关键帧的画面内容,就可以制作出动画。在Flash MX 2004中,关键帧是所有帧的基础。 2、帧除了关键帧外,其他的帧都统称为帧。在Flash动画制作模式中,帧往往代表着动画中间的画面,也就是第一帧与最后一帧画面渐变的过程。因此,在制作中,它们无法被编辑、修改。帧又可以分为静止帧和空白帧。静止帧是动画中关键帧的延续,对应的画面为关键帧中的内容。空白帧中没有任何内容。,对帧的一些操作: 1、插入关键帧在时间轴上选取一帧,按下“F6”快捷键,或者单击鼠标右键,在弹出的快捷菜单中选择“插入关键帧”命令,都可以创建关键帧。 2、清除关键帧先选好
5、要删除的关键帧,按Shift+F6快捷键,或者直接右击要删除的关键帧,在弹出的菜单中执行【清除关键帧】命令。 3、插入帧 执行【插入】【时间轴】【帧】命令或按F5键,或者直接右击要插入的帧,在弹出的菜单中选择【插入帧】命令,这样就可以在选定的帧后插入一个和这个选定帧完全一样的过渡帧。,4、删除帧 先选取一个或多个帧,按Shift+F5快捷键,或者直接右击要删除的关键帧,在弹出的菜单中执行【删除帧】命令。 5、拷贝和粘贴帧 选取需要拷贝的一个或多个帧,在被选定的帧上单击鼠标右键,执行【拷贝帧】命令,在需要进行粘贴的位置单击鼠标右键,执行【粘贴帧】命令即可。 6、翻转帧 使用【翻转帧】命令可以使所
6、选定的一组帧按照顺序翻转过来,能将最后一帧变为第一帧,而将第一帧变为最后一帧,形成一个倒带的效果。一般此效果与【拷贝帧】和【粘贴帧】结合起来使用会十分方便。,7、改变动画片段的长度用鼠标左右拖动片段两端的关键帧到相应的帧位置,就改变了动画的长度。这样比将原来的关键帧删除再重新设置关键帧来改变动画的长度要快捷得多。 8、设置帧频(帧速率)帧频是指在动画播放时每一秒中包含的帧数。选择菜单“修改/文档”或按快捷键“Ctrl+J”,会打开“文档属性”对话框,在其中可以设置帧速率。,3.2 帧动画逐帧动画的每一幅画面均是由关键帧构成。如图3-2所示是一个逐帧动画的时间轴示意,通过此图可以看到连续的画面都
7、是关键帧。我们所做的逐帧动画可以去使用绘图工具在每一帧中绘制,也可以从外部逐帧导入图片。这里就不演示逐帧绘制画面的逐帧动画,下面介绍从外部导入图片的两种逐帧动画制作方法。,图3-2 逐帧动画的时间轴,3.2.1 逐帧动画方法一这种方法是先建立连续空白关键帧,再逐帧从外部导入图片。操作步骤如下:先选中第1帧,接着按住Shift键选定逐帧动画的最后1帧点击鼠标右键,在弹出的快捷菜单中选择“转换为关键帧”命令,将所有选中的帧都转换成空白关键帧。逐次选中每一空白关键帧,执行菜单命令“文件”“导入”,从预定的目标位置导入图片。,3.2.2 逐帧动画方法二这种方法是先将准备导入的图片放入同一文件夹中,然后
8、依次将这些图片文件取同一文件名且加上图片出现的序号,最后导入到逐帧动画的起始帧。操作步骤如下:将准备导入的图片放入同一文件夹中,然后依次将这些图片文件取同一文件名且加上图片出现的序号。例如:“image1”、 “image2”、 “image3”、 “image4”,如图3-3所示。,图3-3 图片文件的序号,在Flash MX的时间轴中,选定准备插入逐帧动画的起始帧,执行菜单命令“文件”“导入”,从预定的文件夹中导入图片,此时系统会弹出一个对话框如图3-4所示。在上图的对话框中选定“是”,系统将按序号导入所有的图片形成逐帧动画,完成这部分的逐帧动画制作。在后面综合实例中,还会运用到逐帧动画的
9、制作方法。练习:利用逐帧动画的制作方法创建一个“倒计时”Flash文件,图3-4 询问是否输入全部图像序列的对话框,3.3 运动合成动画运动合成动画也叫做移动渐变动画。移动渐变动画是Flash动画中的主力军,大量的Flash创作作品,总是以移动渐变动画为主。Flash软件的开发者知道这个特点,因此在快捷菜单的最上面设定了建立移动渐变动画的命令“创建动画动作”。请读者注意,这个命令只适用于建立移动渐变动画。,3.3.1 移动渐变动画基本操作过程移动渐变动画的动画对象是元件。因此,凡是需要制作移动渐变动画时,必须先确认动画对象已是元件。移动渐变动画的制作过程可以总结为下面的操作步骤: 建立元件(含
10、由图形转换成元件)。 设定动画的起始关键帧与终点关键帧。 设定动画效果。 设定动画动作。,下面以一个最简单的实例说明这种动画的基本操作步骤。运行Flash MX 2004,新建一个文件。选择矩形工具 ,在舞台左侧绘制出一个矩形。接着使用选择工具 选择这个矩形,执行菜单命令“插入”“转换成元件”,随后在“转换成元件”对话框中选择“图形”素材,为元件取名为“矩形”,如图3-5所示。最后点击“确定”关闭对话框。此时矩形中央出现一个符号 (表示元件中心),矩形周围出现一个淡蓝色的边框,这说明矩形已经转换成了元件。,图3-5 转换为元件对话框,在第30帧点击鼠标右键,从快捷菜单中选择“插入关键帧”。接着
11、,移动矩形元件的位置。选定第1帧点击鼠标右键,从快捷菜单的最上面选择“创建动画动作”命令。此时时间轴上起始关键帧与终点关键帧之间呈现淡青色,有一箭头由起始关键帧指向终点关键帧。按“Ctrl + Enter”键测试影片一个最简单的移动渐变动画已经完成,后面就可以为动画加了各种效果了。导入GIF动画作为影片剪辑元件,能够得到更有趣味的移动渐变动画。,例1 走动的小公鸡运行Flash MX 2004,新建一个文件。选择矩形工具,在舞台下方绘制出一个矩形,这个矩形将作为地面的背景存在。双击该图层名称栏,为此图层取名为“地面”。选择第50帧点击鼠标右键,从快捷菜单中选择“插入帧”。这一操作步骤是为了使地
12、面背景从第1帧延伸到动画结束(动画共50帧)。执行菜单命令“插入”“新建元件”,随后在“创建新元件”对话框中选择“影片剪辑”素材,为元件取名为“公鸡”。最后点击“确定”关闭对话框,进入元件编辑窗口。,在元件编辑窗口中,执行菜单命令“文件”“导入”,从外部导入预先准备好的GIF动画,在素材编辑窗口的时间轴上呈现出逐帧动画,如图3-6所示。,图3-6,点击素材编辑窗口时间轴下方的“场景1”,回到主场景中来。新建一个图层,取名为“公鸡”。选定第1帧,执行菜单命令“窗口”“库”,打开元件库窗口,从元件库中拖放影片剪辑元件“公鸡”到舞台上,调整初始位置在舞台右侧的地面上。选择第50帧点击鼠标右键,从快捷
13、菜单中选择“插入关键帧”。接着在该帧将公鸡拖放到舞台左侧的地面上,使得在动画移动过程中,公鸡从右侧走到左侧。按“Ctrl + Enter”键测试影片,我们将看见小公鸡神气活现地从地面上走过去,如图3-7所示,强调指出,在步骤中应该按“Ctrl + Enter”键测试影片。如果只敲击Enter检验效果,此时Flash动画在播放状态下,GIF动画不会动公鸡只能从右侧滑向左侧!,图3-7,画面一,画面三,画面二,3.3.2 旋转效果的动画如果已经完成移动渐变动画,要为动画添加效果非常容易。以一个的简单动画为基础,我们接着添加旋转效果: 例2 文字的旋转选定第1帧,并在舞台上创建一个文本,接着在第45
14、帧创建关键帧。选定第1帧点击鼠标右键,从快捷菜单中选择“属性”,打开帧属性面板。从面板中设定旋转方向和旋转次数,如图3-8所示。关闭帧属性面板返回舞台 选择第60帧点击鼠标右键,从快捷菜单中选择“插入帧”。这一操作步骤是为了使文字旋转完后有个停顿时间。(动画共60帧)。,图3-8,3.3.3 改变速度的移动渐变动画在不作设定的情况下,动画对象的运动是匀速运动。我们可以使动画对象运动越来越快或者越来越慢,这需要设置对象的属性。下面我们设计一辆小汽车水平运动时,速度减慢到逐渐停止下来。 例3 减速停车运行Flash MX 2004,新建一个文件。选择矩形工具,在舞台下方绘制出一个矩形,这个矩形将作
15、为地面的背景存在。双击该图层名称栏,为此图层取名为“地面”。选择第40帧点击鼠标右键,从快捷菜单中选择“插入帧”,使地面背景从第1帧延伸到动画结束(动画共40帧)。,执行菜单命令“插入”“新建元件”,随后在“创建新元件”对话框中选择“影片剪辑”素材,为元件取名为“小汽车”,最后点击“确定”关闭对话框。在元件编辑窗口中,执行菜单命令“文件”“导入”,从外部导入预先准备好的GIF动画,在素材编辑窗口的时间轴上呈现出逐帧动画。点击素材编辑窗口时间轴下方的“场景1”,回到主场景中来。新建一个图层,取名为“汽车”。选定第1帧,执行菜单命令“窗口”“库”,打开元件库窗口,从元件库中拖放影片剪辑元件“小汽车
16、”到舞台上,调整初始位置在舞台左侧的地面上。,选择第40帧点击鼠标右键,从快捷菜单中选择“插入关键帧”。接着在该帧将小汽车拖放到舞台右侧的地面上,使得在动画移动过程中,汽车从左侧运动到右侧并停下来。选定“汽车”图层第1帧点击鼠标右键,从快捷菜单中选择“属性”,在“属性”面板“中间”栏先选择“动作”,再于“简易”栏点击右侧按钮显现出滑杆与指针。用鼠标拖动指针可以使指针上下滑动:指针滑向上方,物体运动越来越慢。指针滑向下方,物体运动越来越快。在这个示例中,我们将指针滑向上方,使小汽车减速运动并停下来,如图3-9所示。设置完毕后关闭属性面板回到舞台上。,按“Ctrl + Enter”键测试影片,我们
17、将看见小汽车运动速度减慢并最后停止运动。,图3-9,3.6.4 改变大小的移动渐变动画动画对象在移动渐变过程中可以改变大小,这种操作也称为缩放对象的移动渐变动画。例4 回家的小公鸡运行Flash MX 2004,新建一个文件。执行菜单命令“文件”“导入”,从预先准备的文件夹中导入一幅有山、水、房子、树木的图片作为动画背景。调整图片的大小和位置,然后双击该图层名称栏,取名为“背景”。在“背景”图层中选择第50帧点击鼠标右键,从快捷菜单中选择“插入帧”。使背景从第1帧延伸到动画结束。,执行菜单命令“插入”“新建元件”,随后在“创建新元件”对话框中选择“影片剪辑”素材,为元件取名为“公鸡”。在元件编
18、辑窗口中,执行菜单命令“文件”“导入”,从外部导入预先准备好的小公鸡GIF动画。点击时间轴下方的“场景1”,回到主场景中来。新建一个图层,取名为“公鸡”。选定第1帧,执行菜单命令“窗口”“库”,打开元件库窗口,从元件库中拖放影片剪辑元件“公鸡”到舞台上,调整初始位置在舞台右侧。选择“公鸡”图层第50帧点击鼠标右键,从快捷菜单中选择“插入关键帧”。接着在该帧将公鸡拖放到图片中小房子的门口,使用自由转换工具,改变小公鸡的大小,使得小公鸡能走进小房子的门。,选定第1帧点击鼠标右键,从快捷菜单的最上面选择“创建动画动作”命令。为了清楚地看到动画对象的大小变化过程,打开绘图纸功能的绘图纸外观按钮和编辑多
19、帧按钮。按“Ctrl + Enter”键测试影片,我们将看见小公鸡向小房子走去,体形越来越小(似乎越走越远),最后走进了小房子,如图3-10所示。,图3-10,3.3.5 颜色变化的移动渐变动画颜色变化也是动画的一种效果,使移动渐变动画呈现出颜色变化并不困难。我们添加颜色效果主要是对动画起始帧与终点帧的动画对象改变颜色属性。这里不妨改变动画对象在终点帧的颜色。以一幅背景图为基础,我们接着添加颜色变化效果: 例五 背景图变色创建一个flash文档,接着导入一幅背景图到舞台,并且把背景图转换成元件。 在第30帧选中舞台上的图片对象点击鼠标右键,从快捷菜单中选择“属性”,打开对象属性面板。在对象属性
20、面板右方选择颜色列表中的“色调”,接着打开调色板选定一种不同于起始帧对象的颜色如图3-11所示。关闭对象属性面板返回舞台。,选择第45帧点击鼠标右键,从快捷菜单中选择“插入帧”。这一操作步骤是为了使图片颜色变化完后有个停顿时间。(动画共45帧)。 按“Ctrl + Enter”键测试影片,我们看到图片在动画过程中颜色逐渐改变,直到改变成终点帧对象的颜色。,图3-11,3.3.6 淡入淡出效果的动画当动画对象登上舞台时,由淡淡的看不见到逐渐显示清晰称作淡入效果;当动画对象退出舞台时,由清晰可见经逐渐淡化直到完全无影无踪称为淡出效果。淡入淡出效果能够充分展示Flash的魅力:动画对象逐渐由无到有,
21、从淡淡的形象到鲜艳的色彩;完成舞台表演后,又逐渐淡化直到消失。出神入化、如虚如幻淡入淡出效果只能产生在图形图像、文字等元件对象上,因此只有在移动渐变动画中才有效。下面以文字元件为例,来讨论淡入淡出效果的制作过程。,例六 淡入淡出效果最后的运行效果如图3-12所示。,图3-12,画面一,画面二,画面三,运行Flash MX 2004,新建一个文件。运用文字工具,在舞台上输入文字“淡入淡出”。选中文字(文字周围会显示淡蓝色的线框),执行菜单命令“插入”“转换成元件”,随后在“转换为元件”对话框中选择“图形”素材,为元件取名为“文字”并确定。分别在第20帧、40帧、60帧插入关键帧。并分别选定第1帧
22、和第40帧后点击鼠标右键,从快捷菜单中选择“创建动画动作” 。,在动画关键帧,设定如下:选定第1帧,将文字拖放到舞台右边的台下;选定第20帧,将文字拖放到舞台中央;选定第60帧,将文字拖放到舞台左边的台下;选定第20帧后点击复制工具,对第20帧内容进行复制。接着选定第40帧,删除该帧内容,再执行菜单命令“编辑”“粘贴到当前位置”。这样使第20帧与第40帧里文字都在相同位置上。选定第1帧点击鼠标右键,从快捷菜单的最上面选择“创建动画动作”命令。下面开始设置淡入与淡出效果了。,在第1帧,选中“淡入淡出”文字后点击鼠标右键,从快捷菜单最下方选择命令“属性”,打开元件属性面板。在“颜色”栏列表中选择“
23、Alpha”,确认滑杆指针在最下端,栏中显示为“0%”如图3-13所示,最后关闭属性面板。由于第1帧是文字进入舞台的起始关键帧,因此这里实际上已完成了淡入效果的设置。在第60帧,同步骤一样操作,完成文字的淡出效果。按“Ctrl + Enter”键测试影片,体会淡入淡出的效果。,图3-13,3.3.7 自定义路径的动画在移动渐变动画中,动画对象在起始帧处于某一位置,在终点帧可能在另一位置上(也可以位置不变而改变对象的属性)。如果不设定对象运动的路径,对象从起点到终点的运动将是直线运动。很多动画必须根据实际情况使得对象沿设计者指定的路径运动,怎么办呢?引导线图层可以满足我们的要求。使用引导线图层先
24、必须明白几点:(1)引导线图层只能对移动渐变动画起定义移动路径的作用,对形状渐变动画不起作用(因为形状渐变动画不能自定义移动路径)。(2)一个动画图层限定只能添加一个引导线图层。(3)引导线图层的线条、文字等各种内容在影片输出时将不会显示出来。,使用引导线图层操作步骤如下: 先设定动画对于动画对象,必须事先将其转换成元件(或预先建立图形动画元件),再设定好动画的起始帧与终点帧。 绘制引导线图层的路径线条引导线图层是用来绘制自定义动画移动路径的。路径的绘制最好使用铅笔工具 或线条工具 ,绘制出草图之后再使用其他工具进行修改。绘制线条的颜色可以任意挑选,因为播放动画时路径是隐藏的,不会显示任何线条
25、。 建立图层属性为引导线图层如果在已完成动画图层的上面建立引导线图层,只需要在时间轴上点击添加引导图层按钮 ,在动画图层上面将建立一个新图层 ,在此图层上绘制的线条就是下面一个图层中动画的引导线。,倘若,开始绘制路径线条的图层是普通图层,那么就必须建立图层属性为引导线图层。操作方法是:在该图层名称栏点击鼠标右键,从快捷菜单中选择“引导线”命令。只是还未确定引导线图层的引导对象之前,该图层名称栏的图标为 ;等到确定引导线图层的引导对象之后,该图层名称栏的图标会自动变成 。 让动画对象在起始帧与终点帧贴齐路径在动画的起始帧,要设定动画对象与路径线条上的某一点贴齐;在动画的终点帧,也要设定动画对象与
26、路径线条终点贴齐。播放动画时,动画对象将从起始帧的引导线上所在位置运动到终点帧的引导线上所在位置。要让动画对象在起始帧与终点帧贴齐路径,最好先确认工具栏中贴紧对象按钮 已选中,这样可以确保对象很容易贴齐路径线条。,下面我们以一个实际例子进行操作练习。例7 飞行的小鸟运行Flash MX,新建一个文件。执行菜单命令“插入”“新建元件”,随后在“创建新元件”对话框中选择“影片剪辑”素材,为元件取名为“小鸟”。在元件编辑窗口中,执行菜单命令“文件”“导入”,从外部导入预先准备好的小鸟GIF动画。点击时间轴下方的“场景1”,回到主场景中来。双击图层名称,取名为“小鸟”。选定第1帧,执行菜单命令“窗口”
27、“库”,打开元件库窗口,从元件库中拖放影片剪辑元件 “小鸟”到舞台上。选择第30帧点击鼠标右键,从快捷菜单中选择“插入关键帧”。,选定第1帧点击鼠标右键,从快捷菜单的最上面选择“创建动画动作”命令。到这里为止,完成了动画的设定。在时间轴上点击添加引导图层按钮 ,在“小鸟”图层上面新建立了一个引导线图层,该图层名称栏的图标是 。在此图层绘制一根线条,作为小鸟的运动路径。用选择工具 修改线条成曲线。确认工具栏中贴紧对象按钮 已选中后,选择“小鸟”图层第1帧,用鼠标拖动小鸟到线条起点释放(注意让中心标记贴齐路径线条的起点),如图3-14所示。,图3-14 让中心标记贴齐路径线条的起点,接着选择“小鸟
28、”图层第30帧,用鼠标拖动小鸟到线条终点释放(注意让中心标记贴齐路径线条的终点),如图3-15所示。,图3-15 让中心标记贴齐路径线条的终点,按“Ctrl + Enter”键测试影片,检查小鸟是否按照路径飞行。 再加个背景图效果将更好些。练习:利用移动渐变动画的知识创建一个“月亮绕着地球转”的Flash文件。,3.4 形状合成动画形状合成动画也叫形状渐变动画。所谓形状合成,是指在两个关键帧之间制作出图形对象的变形效果,让一种图形随时间变化成为另一种图形。在形状渐变动画中,对象的位置可以移动、对象的颜色可以改变,但这种变化是以矢量图形对象为动画主角。舞台上的矢量图形,在没有转化为素材库中的元件
29、之前,只是普通的图形,因此只能用来制作形状渐变的动画,不能用来制作移动渐变动画。形状渐变动画与移动渐变动画的最大不同在于动画的对象:形状渐变动画的动画对象是矢量图形;移动渐变动画的动画对象是元件。,3.4.1. 形状渐变动画形状渐变动画发生在两个不同形状的矢量图形之间,我们只要在两个关键帧上绘制不同的图形就可以了。例8 燃烧的蜡烛运行Flash MX 2004,新建的一个Flash文件,保存文件名为“燃烧的蜡烛”。先在工具箱中选择矩形工具按钮,接着在颜色选项栏选定描绘颜色工具,再点击下面的没有颜色按钮,随后在舞台上绘出一个没有轮廓线的矩形。执行菜单命令“窗口”“调色板”,打开调色板面板。选择“
30、线性”填充方式,在色彩区域调整区设定左侧为白色,右侧为深红色,如图3-16所示。设置完成后关闭窗口。,图3-16,选择工具箱的颜料桶工具 ,在矩形中心单击,完成线性填充。为矩形所在图层取名为“蜡烛”,然后中第60帧点击鼠标右键,从快捷菜单中选择“插入帧”命令。这是为了使静止的蜡烛图像作为背景一直保持在场景中。点击时间轴左侧插入图层按钮 ,新建一个图层,取名为“火焰”。在“火焰”图层第1帧,先在工具箱中选择椭圆工具按钮 ,接着在颜色选项栏选定描绘颜色工具 ,再点击下面的没有颜色按钮 ,随后在舞台上绘出一个没有轮廓线的椭圆。,再次执行菜单命令“窗口”“调色板”,打开调色板面板。选择“径向”填充方式
31、,在色彩区域调整区设定左侧为白色,中间为红色,右侧为浅黄色,如图3-17所示。设置完成后关闭窗口。选择工具箱的颜料桶工具 ,在椭圆下端单击,完成径向填充。再用选择工具 编辑椭圆,使之成为火焰状。分别在“火焰”图层的第15帧、第30帧、第45帧、第60帧插入关键帧,并对每一关键帧的火焰形状进行修改,如图3-18所示。,图3-17,图3-18,原始椭圆,第1帧,第15帧,第30帧,第60帧,第45帧,分别选定“火焰”图层的第15帧、第30帧、第45帧后点击鼠标右键,在随后弹出的快捷菜单下方选择“属性”,打开“属性”对话框。在选项“中间”栏下拉列表中选择“形状”,依次形成形状渐变动画后关闭“属性”对
32、话框。再次保存文件,按“Ctrl + Enter”键测试影片并输出一个同名的Flash电影。通过动画展示窗口可以看到蜡烛的火焰在微风中摇曳。,通过上面这个例子,我们可以看到要设计燃烧的酒精灯、篝火等都可以如法炮制。它还给我们一个启示:凡是要制作一个动态的图形在静止的背景中变化,可以将它们分别放在动态图层与静止图层之中,这样便于编辑修改。在图形渐变动画中,并不是要求起始帧与终点帧画面一定都只有一个图形。如果要设计一个图形变成多个图形,也是可行的。下面是一个图形分裂成多个图形的实例。,例9 分裂运行Flash MX 2004,新建的一个Flash文件,保存文件名为“分裂”。先在工具箱中选择椭圆工具
33、按钮,去掉轮廓线,任选一种填充色,在舞台上绘出一个没有轮廓线的圆。选中圆,点击常用工具栏的复制按钮。在第30帧插入关键帧,接着点击常用工具栏的粘贴按钮,将复制在舞台中心的圆拖放到舞台下方。按此操作连续复制三次。选定第1帧后点击鼠标右键,在随后弹出的快捷菜单下方选择“属性”,打开“属性”对话框。在选项“中间”栏下拉列表中选择“形状”后关闭“属性”对话框。再次保存文件,按“Ctrl + Enter”键测试影片并输出一个同名的Flash电影。,3.4.2 绘图纸功能图形变化的中间过程也可以显示出来,这种显示需要使用绘图纸功能。绘图纸功能不仅适用于形状类渐变动画,也适用移动类渐变动画。绘图纸功能一般也
34、称为洋葱皮窗口。这种创作动画的过程模拟的是传统的动画片制作方式。在传统的动画制作方式中,一般将一张张动作连贯的透明胶片固定叠加在灯箱上作画,由于灯箱可以清晰透出叠在下面的每张透明胶片的内容,所以绘制下一张时可以轻松地掌握图像位置关系。,以前面“例9 分裂”为例,在动画的时间轴上点击绘图纸外观按钮,帧数标尺上将显示出绘图纸起点标记符号和终点标记符号。拖动起点标记符号或终点标记符号可以改变绘图纸描绘的起始位置,如图3-19所示。,这里介绍绘图纸功能的四个按钮:绘图纸外观 、绘图纸边框 、编辑多帧 、修改标记 。绘图纸外观 :单击此按钮,动画进入绘图纸状态。如图3-20所示,即是“例9 分裂”进入绘
35、图纸状态的显示。绘图纸边框 :以外框形式显示动画的绘图结果。如图3-21所示,即是“例9 分裂” 显示绘图纸边框的状态。,图3-20,图3-21,编辑多帧 :当按下此按钮时,所有的关键帧的内容均会与原色的方式出现在舞台上,并且显示的关键帧可以选取和进行编辑,此按钮最好与绘图纸边框按钮 一起使用,以便观察得更清晰。如图3-22所示,即是“例9 分裂”同时按下绘图纸边框 和编辑多帧 的绘图纸状态。修改标记 :当按下此按钮时,会弹出绘图纸设定的相关菜单。,图3-22,3.4.3. 颜色变化的形状渐变动画在Flash MX 2004中,颜色变化的形状渐变动画在制作上与普通形状渐变动画没有什么差异,只要
36、在动画的起始帧图形与终点帧图形上设定图形不同的颜色即可。无论起始帧图形颜色与终点帧图形颜色有什么差别,也不管填充颜色采用的是纯色填充还是渐变填充(即线性填充或径向填充),计算机都会自动完成这种颜色变化的动画。,3.4.4. 添加形状提示控制点的形状渐变动画有时候我们在形状渐变动画中设定起始图形与终点图形,在测试结果的影片中,动画确实是由起始图形变成了终点图形,但我们却感觉失望,这是为什么呢?这是因为我们有时不仅要求图形变化由起始图形变成终端图形,同时还希望变化过程能按我们的设计进行。这时,运用形状提示控制点能帮助我们来控制图形的变化过程形状控制点是指在图形的起点关键帧设定控制点a、b、c、d、
37、e,这些点设置在图形的某些重要位置上。在终点帧,也会有相应的控制点,将这些点拖放到预先设计的特定位置上。起始帧的控制点与终点帧的控制点一一对应:起始帧的a点渐变到终点帧的a点、起始帧的b点渐变到终点帧的b点、起始帧的c点渐变到终点帧的c点,复杂的图形变化也能在控制点的控制下乖乖听话。,下面我们通过一个例子来研究形状提示控制点的使用方法。例10 添加形状提示点的研究新建的一个Flash文件,在工具箱中选择矩形工具按钮,在舞台左侧绘出一个矩形,去掉填充色。在第30帧插入关键帧,将矩形拖放到舞台右侧。选定第1帧后点击鼠标右键,在随后弹出的快捷菜单下方选择“属性”,打开“属性”对话框。在选项“中间”栏
38、下拉列表中选择“形状”后关闭“属性”对话框。按“Ctrl + Enter”键测试影片,可以看到图形渐变动画已经成功。下面是研究形状提示控制点的使用。选定第1帧,执行菜单命令“修改”“外形”“添加形状提示”,会在矩形中央出现一个红色的“a”点。接着按“Ctrl + Shift + H”键多次,会依次出现“b”、“c”、“d”。将这些点拖放到四个角上。,此时分别选中起始帧与终点帧观察,会发现起始帧的红色形状提示点分布在四个角上,而终点帧的红色形状提示点还叠放图形中央。显示结果如图3-23所示。下面将分别设置终点帧的形状提示控制点在图形的不同位置上,研究控制点的控制效果。为了清晰地观察到变化过程,我
39、们打开绘图纸功能的边框按钮 和编辑多帧按钮 ,并设置绘图纸起点与动画起点一致、绘图纸终点与动画终点一致。,图3-23 起始帧与终点帧形状控制点,设置终点帧形状提示控制点的位置与起点帧的形状提示控制点相同,敲Enter运行结果如图3-24所示。,图3-24 终点帧与起点帧的形状提示控制点位置相同的动画,设置终点帧每一个形状提示控制点的位置依次逆时针移动一个角,敲Enter运行结果如图3-25所示。读者可以清晰地看到图形逆时针逐渐变化。,图3-25 图形逆时针逐渐变化,相对于步骤,设置终点帧的“a”点和“c”点到对角线的角上(即交换两个点的位置),敲Enter运行结果如图3-26所示。读者可以清晰
40、地看到图形绕bd对角线进行了翻转。,图3-26 图形绕bd对角线进行翻转,相对于步骤,设置终点帧各形状提示控制点到对角,敲Enter运行结果如图3-27所示。,图3-27 终点帧各形状提示控制点到对角,关于形状提示控制点,还有两点要说明: Flash MX 2004的形状控制点共有26个,即从英文字母a至z。一般情况下,无论怎样复杂的图形变化都能够控制。在起始帧与终点帧的形状提示控制点设置完毕时,起始关键帧的变形提示控制点呈现为黄色,而终点关键帧中的形状提示控制点呈现为绿色。如果控制点不在图形曲线上,则呈现红色。利用形状提示控制点功能可以精确地控制变形方向和方式,并使变形效果趋于平滑。具体的效果和妙用还需要读者在实际的应用中认真琢磨。 练习:利用学过的知识制作一个“翻页图册”或“打开的盒子”,