![Flash动画原理与实战](https://wfqqreader-1252317822.image.myqcloud.com/cover/794/687794/b_687794.jpg)
第3章 循环动作
前面两章从传统动画的角度出发,讨论了几种动画理论及其应用。从这一章起主要讨论Flash特有的一些使用方法和技巧。但这并不意味着前面讲的传统动画原理可以不顾,后面章节还将不时地引用前面讲述到的一些内容。
在将来使用Flash的过程中,初学者要时刻想到动画原理,从造型、原画和运动规律等几方面,全方位地考虑面对的实际问题。这应该养成一种习惯,也是作为一名Flash动画工作者应该具有的素质。
在这一章的学习过程中,要求我们更多地使用Flash,最好跟随进度亲自实践每一种制作方法。
这一章中主要讨论一些常用的循环动作。循环动作是动画中一类比较特殊的动作。顾名思义,它的每个“动作单元”可以首尾相接,因此可以用这一个单元的反复播放来表现很长的重复动作。
在传统动画中,经常要采用循环动作来解决问题,Flash中应用得更多。
3.1 走和跑
最常见的是人的走路和跑。如果做成循环动作,可以不知疲倦、不停地走下去。走和跑的循环如图3-1所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0053_0001.jpg?sign=1738780804-rdBN8pyltMMrjWXDEkMICln8j0DAKLLa-0-9cc88b00ce0187e5d5ade11bc207594d)
图3-1 走和跑的循环
在图3-1中,走和跑都用8帧表现,应该注意它们的起伏,跑的起伏要比走的起伏大一些,跑有一个明显向上窜的动作。
3.1.1 走
下面介绍在Flash中画走路的方法。许多人觉得走路十分复杂,碰到实在躲不开的情况,就用各种省事的方法“混”过去,最常见的是只画上半身,或者干脆让人像僵尸一样,腿不动,在地上平移。这些都是不对的做法。
实际上,走路的规律性很强,也有许多技巧可用,并不难掌握。
现在来制作没有特殊需要的、一般性的走路。走路是一个循环动作,左右脚分别向前迈一步形成一个循环。如果从身体的一侧来看,是一个左右腿交换的过程,即可以把一条腿的运动看成是另一条腿的复制。
那么这是否意味着在制作时可以在做好一条腿的动作之后,复制这条腿,然后稍加修改做出另一条腿的动作呢?我们经常看到,许多Flash动画里,用两条颜色不同的腿(同一个symbol)拼出一个完整的动作。
复制是一种取巧的办法,但面临的问题是在用一个symbol拼接完整动作时会麻烦点。如果你对走路的动画很熟练,也可以同时画出两条腿的运动。
首先要确定在fps=12的前提下,表现走路需要多少帧才合适。我们不妨自己站起来在屋子里走走,看看一个循环需要多少时间。实践表明,如果是一般中速的走路是16帧,即1秒多一点比较合适。如果用1拍2的方式,实际上只需要画出8帧完全不同的画就行了。
然后按下【Ctrl+F8】组合键,新建一个symbol,取名为“legs”。
画出走路循环的一半,如图3-2所示。图中画面可以看做右脚从后到前的过程,一共4帧。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0054_0001.jpg?sign=1738780804-HnvDt3dL1pbNA94IrDoC6tAr0tKgbtRH-0-2d7d611b6339958b805d0ebd3634c4f5)
图3-2 走路循环的一半
画好后在脚下面加一层,在这层上用半透明的黑色画一个椭圆,如图3-3所示。这个椭圆作为身体的阴影。它还有个用处,可以作为参照物调整腿的上下位置,因为在画的过程中,难免会有各帧上下位置偏移的现象。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0054_0002.jpg?sign=1738780804-FmLFTXDazDOU8Ad1r10bU4tvsXxxaIP9-0-38ec19851cc96e7c548089f1fc2efd1b)
图3-3 加阴影是一种常用的方法
在完成了这一半之后,可以将这4帧复制下来,复制第5帧至第8帧。但由于左右腿交换,要修改一下两条腿前后遮挡的关系,其他地方本着近大远小的透视原理也要微调一下。现在有8帧的动画。根据要求,给它加上颜色,如图3-4所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0054_0003.jpg?sign=1738780804-bkb24NeEgYnn6oo8YPxmqKJ8X9unp7nW-0-41148eb9871d36ab682d1df1fc30ca38)
图3-4 上好颜色
在这个基础上,在每个keyframe后面加1帧,形成一个16帧的循环,如图3-5所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0054_0004.jpg?sign=1738780804-qKF7leJmgFwuAuReGYeqTaS7iAEtlWPl-0-e0e24f97732ae2f5c5e80d9a5bc7ec65)
图3-5 形成16帧的循环
这就是一个走路的腿的symbol,可以用它来组合出新的symbol,即在它上面加上任何身体。
当然,这只是个最简单的走路的例子,实际影片中的要求可能千变万化,走路的一双腿不可能一成不变地使用一个symbol,也不可能总用一个循环16帧的固定节奏。根据实际情况创作出不同的走路形态,但其基本原理是不变的。
3.1.2 跑
跑步和走路类似,但速度更快,动作的起伏更大。一般用8帧来表现,如图3-6所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0055_0001.jpg?sign=1738780804-qAXOmMoUhNEqTeWt3SnNQaVz2dwktHR1-0-8addccf2643feb2dd0f3e881bdde79ed)
图3-6 跑
如图3-7所示的是经典动画讲义中奔跑的动画,也用8帧表现。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0055_0002.jpg?sign=1738780804-oFsni39y3Lthv9Pcq1OdOwJehJKkylX6-0-358cbd6794f8f4c674a61ed1cf4e9611)
图3-7 奔跑的动画
请注意图3-7中用各种几何体代替身体各个部分的画法。如果跑得再快的话可以用4帧来表现。还有些动画中用模糊的手法把腿画成一个滚动的圈,也是一种流行的、省事的做法。
3.1.3 跑出画面
在第2章中探讨过各种角色快速跑出画面的动画。这是一种特殊的跑,更多的情况是它没有具体的动作,只是一个预备动作。在停顿几帧之后,下一个画面角色将完全在画面中消失。
这也是现在经常采用的画法。需要注意的是跑出去后画面上残余的烟圈,如图3-8所示即为跑出去的画面。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0055_0003.jpg?sign=1738780804-xxVLb7H6w7VVl8Jjt8pyvvGt7eZZAO8A-0-0d52c4f6130fdfbe843f9be3ed250f88)
图3-8 跑出去
在图3-8中,角色摆出一个标准的预备动作,下一帧中他就要跑出画面。人跑出去后形成一个中空的烟圈,似乎是人把空气带跑了,然后再逐渐分散成一个个小烟圈,逐渐消散。这个消散的过程不要太快,要在2秒以上。
如图3-9所示是一个比较简单的跑出画面产生烟圈的动画,编号是keyframe的位置。如无特殊要求,一般影片中使用这样的烟圈也就够了。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0056_0001.jpg?sign=1738780804-lK8xpIL7oI3X7Z1gagHWQJbCA4eAMczI-0-8611cc64a700e0c7e1161edf289aca33)
图3-9 跑出画面产生的烟圈
3.2 烟与火
3.2.1 袅袅轻烟
袅袅轻烟有很多种,比如烧香产生的烟、吸烟时烟头升起来的烟(不是吸烟者嘴里吐出来的烟)等。画这种烟的重点在于画出烟在空气中的状态。即使在很平静的地方,这样的烟也会因其颗粒的微小而被流动的空气吹动产生轻微的摆动,但它不会有很大很剧烈的跳动。
在Flash中使用shape(创建形状动画)变形功能来完成对袅袅轻烟的模拟。
以雪茄冒出来的烟为例。首先画出烟的第1个形态,注意曲线的光滑程度,以便体现它袅娜的姿态,如图3-10所示。其中a、b两个端点很重要,可以通过控制调整它们生成下一帧。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0056_0002.jpg?sign=1738780804-5PahgqPVmRrJeMfRUpGpfmOR0AvZaIWy-0-07c4892c2b78adeb30f9d316638f0278)
图3-10 烟的形态
然后按下【F6】键,产生1个新的keyframe,实际上是复制第1帧。在新的一帧里,选择箭头工具,将a点位置做一个微小的拖动,如图3-11所示。在拖动过程中,两侧的曲线也自动随之得到了调整。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0056_0003.jpg?sign=1738780804-gffaWZGJqeX7mN8yb3gcU6FTqQ4jes8f-0-d1847b7719a6fb2bbf61da4a21bcda69)
图3-11 拖动a点
不能轻易改动b点的位置,因为它是烟“发生”的起点,是整个循环动作的一个关键点,即雪茄烟头的位置(和松鼠尾巴例子中尾巴的根部类似)。如果它的位置有上下左右的移动会使动作不稳定,失去参照系。
用同样方法再做出第3个keyframe,仍然是将a点做微小的调整,如图3-12所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0056_0004.jpg?sign=1738780804-51KHdpejEL11QhdLWDjecvjKjBqV8gGc-0-04604f5f174a7a8255db07bc26544d1f)
图3-12 继续拖动a点
在第4帧里,我们可以将两侧曲线的弯曲方向做一个调整,如图3-13所示,和原来的方向相反。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0056_0005.jpg?sign=1738780804-v70Hs3XPd9g0dcseeCqRAEbJhEgg5jcd-0-8b68c5daddf51aa4a85356caa1b9450c)
图3-13 调整曲线的弯曲方向
接下去的2帧可以看成是这种调整的继续,分别如图3-14和图3-15所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0057_0001.jpg?sign=1738780804-3etP3zuunfnUE9UWvUrpNiSozo1zZ0D6-0-29867b34d58114c23375a52a4a3a5e1c)
图3-14 调整
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0057_0002.jpg?sign=1738780804-OvuEUZRfmcffemYp1W7lIcx6IDMO6fJh-0-2dd1c3a3114ae3fe81e078425ac04531)
图3-15 继续调整
在第7帧和第8帧中再增加一点曲线的变化,分别如图3-16和图3-17所示。如果将第6帧至第8帧连起来看,好像是烟受了流动空气的影响,轻轻摆动了一下,一个波浪从底部b点升上去,沿着烟的主体上升,在a点冒出去。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0057_0003.jpg?sign=1738780804-QWTvP8jPuzeYTeUVNhVOyIY3xDIZSdEG-0-0036bdfd3e98bc6ea1b8ac20c7528a84)
图3-16 增加曲线的变化
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0057_0004.jpg?sign=1738780804-xswtpWHFRf9l1DGAbNDF21gCy9JkmlEE-0-1c25085c73709f34d066f70cfd1e2f8e)
图3-17 继续增加曲线的变化
这个循环动作画了8个keyframe,它们的底部,即“发生点”都维持在b点,没有移动。现在将在每个keyframe后面插入1帧作为延时(按【F5】键),如图3-18所示。此时,整个动作共16帧,即1.5秒。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0057_0005.jpg?sign=1738780804-hbxtvG5vZBUSehjmm2IOjHCxYHj72Kb1-0-664e444d0ce5fa1f1083f352b04c6d7d)
图3-18 16帧的循环
此时好像还缺点什么,可以再加上一层。在这一层中,可以在某些帧上随意画上一些“小”烟,使整个动作更生动些。注意,这些小烟摆动的形态总是依附于烟的主体。
至此,一个完整的烟的循环动作就完成了,如图3-19所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0057_0006.jpg?sign=1738780804-itwvLE70Sk8eQmnucjRZIF6wwcKaqxhV-0-70f750e539da9f97b41cf0058171b734)
图3-19 完整的循环
有许多人希望用shape变形的方法来制作更多的动画,但实际操作起来发现,原本设想很简单的变形却是不可捉摸的,并且很难把握。Flash的shape变形功能一直做得不尽如人意,可操作性比较差,除非将一个圆变成一个矩形,否则,稍微复杂些的变形在中间过程就会“变乱”,使用hint(提示点)控制点也很难把握。相信大家都有这样的体会吧。因此,尽量少用shape变形,或者说有增加hint点的工夫通过手绘也解决问题了。这是一种习惯,慢慢你会发现,手绘实际上是最自由、最方便的绘图方法。
3.2.2 滚滚浓烟
烟囱里冒出的烟、爆炸产生的烟,由于体积大、颗粒粗重,表现出来的形态和袅袅轻烟有很大的不同。滚滚浓烟是通过大团和块来体现的。同时,它不断上升的形态也可以处理成循环动作。
先来画烟的“单位”,即烟团。实际上,不仅是烟团,动画中许多团状、絮状物都用这样的方法。第2章中讲到的人迅速跑出画面的动画,产生的“气团”也是同样的画法。
如图3-20所示是烟团的一种画法。这样的画法散乱,没有体现出质感。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0058_0001.jpg?sign=1738780804-aUcV3EttzWkuVqPfjLGs1SL6kz4jShRE-0-bd0501b3e9ddd8605101caac7b0763f0)
图3-20 烟团的一种画法
如图3-21 所示是烟团的正确画法。要点是:每一道弧线的圆心都大致是烟团的中心点,整体形象统一,且体现出了质感。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0058_0002.jpg?sign=1738780804-xRl9uuHzQsPUulRYMWuVp1smDaU0D6HP-0-4e7deb18c24db8a664724b98d61a0309)
图3-21 烟团的正确画法
下面一步一步地画出一个烟的循环。只需要4个keyframe就可以做出一个漂亮的循环动作。
按【Ctrl+F8】组合键,建立一个新的symbol,命名为“smoke”。
首先,画出一个烟囱。所有烟从这里冒出来,如图3-22所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0058_0003.jpg?sign=1738780804-HtwDq93p4GWzAgf9ybLRN1P7TOLd8eKF-0-226f90a51fc637c86dee2d03f5aa6274)
图3-22 先画一个烟囱
然后增加一层,在这层上用【铅笔】工具画出一条曲线。它只是用做参考,代表了烟上升的路径。这条路径叫做轨迹线,如图3-23所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0058_0004.jpg?sign=1738780804-Us79QMYhexbopxDOUl6RWxe0zSrHeIpl-0-4281bd53dc4d852521e48bb52dd56824)
图3-23 轨迹线
然后再增加一层,并将它拉到最下层。在这层上画出4个圆圈(第1帧),这4个圈可以不一样大小。分别把它们编号,从下到上依次为1、2、3、4。注意,这4个圈的圆心都大致在轨迹线上,如图3-24所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0058_0005.jpg?sign=1738780804-xapFmkMm5dxHB9MYC9kVumIDiT15JZBs-0-afe25e89874e485e46123da420e625bb)
图3-24 画出4个圆圈
按【F7】键加1个keyframe(第2帧),打开“onion skin”,对照第1帧,画出4个圈的新位置。新位置的基本思想是1追2,2追3,3追4,4走出画面。或者理解成,1欲取代2的位置,2欲取代3的位置……依次类推,如图3-25所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0058_0006.jpg?sign=1738780804-X0trBHZjUcbVDxcLTDlEHkm7bzPQsyTM-0-679ba921fefbbac3d3f7e740025563eb)
图3-25 增加1帧
但要注意两点:第一,圆圈的运动都要保持圆心始终在轨迹线上;第二,因为要用4帧的长度完成循环,所以每个圈每次沿轨迹线移动的距离大致是两圈之间距离的1/4,这是做循环动画的一个小窍门。循环动作的规律如图3-26所示。这是一个单独的例子,和烟很相像:一个球花费4帧从a点沿着曲线到达b点,图中标明2、3和4的3个白圈是它在第2帧、第3帧和第4帧的位置。可以看到,每帧的位置比上一帧向前1/4,最后剩余1/4,即走到4 时循环就结束了,而不必走到 b 点,因为这是个循环动作,从1重复开始。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0059_0001.jpg?sign=1738780804-teRlqqGYrmE6I5VGb3ciDILDQH9KjADz-0-68d759c6b1869c305995612e52abad87)
图3-26 循环动作的规律
按【F7】键加keyframe(第3帧),每个圈继续向上升1/4间隔,如图3-27所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0059_0002.jpg?sign=1738780804-hxddKaVjfbO9upZY3NOVyNlkY6y5Tqjy-0-119466e03a141781bf114fb281bd47eb)
图3-27 再增加1帧
按【F7】键加keyframe(第4帧,最后一帧),每个圈继续向上升1/4间隔,这时,4已经在画面上消失,而1下面的烟囱口又冒出了一个新的圈。此时,每个圈距离它的目标球还有1/4的距离,如图3-28所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0059_0003.jpg?sign=1738780804-a7T3UtyxeaTzyNfKPsHq8y7Aq6nwsowl-0-9b9a024789592d72798e77e49455af39)
图3-28 增加最后1帧
注意,为避免死板,在这4帧的变化中,每个圈的大小可以做一些变化。
至此,循环大致的模样就出来了。可以将它拖进场景中,按【Ctrl+Enter】组合键检测一下是否像是在冒烟。
到这里,只是搭了一个骨架,下一步要丰富这4个圈。用刚才画烟团的方法在每一keyframe上将圆圈用烟团取代。画烟团时可以在圆圈上加一层,如图3-29所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0059_0004.jpg?sign=1738780804-SUoV1Mv4xENlBzcDXKZpZYOkONpISiDI-0-fde4deb99357556e4ea8a6a8cac1692c)
图3-29 增加1层
参照下面一层圆圈的位置画出一个个烟团,如图3-30所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0059_0005.jpg?sign=1738780804-ChGiP8DputfRDrtwIdK7IW2KFqHZrlYK-0-98ae9cc4282f234c3bc6a4e994ecd8fc)
图3-30 参照圆圈的位置画出烟团
现在想一下现实生活中浓烟的形态,它们并不是这样一团团的,所以还需要做进一步处理,如图3-31所示。用另外几组小的烟团将几个大的烟团连接在一起,像一条锁链一样。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0060_0001.jpg?sign=1738780804-gDpoQ5aqbiWUE6dyq5NCwKaMH8gD3Y1T-0-e19c9111747a6228435663f1bc8b260d)
图3-31 修饰一下烟团
最后,我们修饰一下整个形态,填色、增添阴影、增加中间帧延长节奏。最后完整的浓烟循环如图3-32所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0060_0002.jpg?sign=1738780804-QUq7AytmAp415NGQ3jUdmrPNe2wXJViH-0-7efaaa23463d01800e59a2e0d2667c07)
图3-32 完整的浓烟循环
3.2.3 火
火有简单的画法,比如蜡烛火苗,只需画出几个形态稍有不同的火苗形状作为不同的几帧就可以了;也可以复杂地画,比如篝火,因为它可以看成许多小火苗的集合,所以要从整体上考虑。可以像3.2.2节讨论的烟一样,做成循环动作。在上一节中,将烟的运动分解成几个逐渐上升的圈,火也一样,要找到它运动的规律性。
火焰的循环如图3-33所示,这是哈拉斯概括的火的形态,用8帧完成的一个循环。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0060_0003.jpg?sign=1738780804-DvmtS4HRfHxwpVGVsOMbdKWsfTapMzTK-0-95a5e2e40905d56346694813dfc2f01c)
图3-33 火焰的循环
火焰的特点是下面粗壮,越向上越细小,最后消散在空气中。它的运动规律通过火焰两侧标有×的几个旋涡的上升体现出来,运动速度越向上越慢。这和浓烟的规律类似。
3.3 雨和雪
3.3.1 雨
一般来说,雨可以简单地画,用3到4帧不同的“雨滴”或“雨线”布满画面即可。因为雨的速度比较快,单个的雨滴又比较细小,多数时间连成一片,看不出每一个单独的雨滴,因而不必像烟那样体现出循环,自然布满画面的雨本身就可以看成循环。
如图3-34所示的雨,用3个keyframe画出3种随意的线条。注意,每个线条的宽度设为【hairline】,每个线条的倾斜角度都相同(可采用复制同一线条、稍加修改的方法)。在3帧之间各加1帧延时。这样的效果在fps=25时比较满意。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0061_0001.jpg?sign=1738780804-ns5HYjwBXN6RLaiTaRQlGkYbv9liH9B8-0-d6a505f60319da3ef4d81fa1785c9dcd)
图3-34 雨
如果需要比较大的、卡通味道比较浓的雨滴,可以画成传统的一头尖一头圆的形状,但注意在随手画的过程中,应该有意画出大小不同的雨滴来。同图3-34中一样,随机画出3、4帧不同的雨滴布满画面即可。雨滴如图3-35所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0061_0002.jpg?sign=1738780804-kqJbWhYXV9fN1dhVCvX47bBXXPlQPdqq-0-80e19677aa56ea38eaf28d493548ac0b)
图3-35 雨滴
3.3.2 雪
雪与雨的不同之处在于雪飘落的速度比较慢,因而无法用图3-34 那样的方法随机画出。通常采用描绘飘落路径的方法。与前面浓烟的制作相似,但方向相反。
在这个方法中,最值得注意的是symbol的调用。这是Flash动画的根本思想。
首先建立一个新的symbol,属性是“Graphic”,命名为“s1”。这个symbol只有1帧,这里先不限制形状、颜色,随便画上一个黑色的煤球代表一个雪花,如图3-36所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0061_0003.jpg?sign=1738780804-v7kK4o9kqvT8UeTyTSEZuRwFUZYPLPPC-0-7eab057cdb0cae3cfe163fb5d8242509)
图3-36 像煤球一样的雪花
其次再建立一个symbol,命名为“s2”。在这个symbol里,将描述单独一个雪花下落的过程。将s1拽进来,将总帧数增加到35,第35帧定成keyframe,在这一帧将s1向下移动一段距离,中间创建补间动画。在这层上增加一个导向层。在导向层中用【铅笔】工具画出一条曲线,代表雪花下落的路径。将s2按照导向层运动,如图3-37所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0061_0004.jpg?sign=1738780804-R3V9FHBpxZa6Brgr8ncHpmIOn9QCh3Kb-0-b57e2c2c3b0e697d725438f58f790d83)
图3-37 雪花下落的轨迹
然后再建立一个symbol,命名为“s3”。在这个symbol里将描述在纵向上一组雪花下落的过程。将总帧数定为35,将s2拽入,利用属性面板上的x、y坐标将它的位置定在中央(x=0,y=0)。注意,这个实例要按照graphic(图形,元件的三种形式之一)模式引用,循环起始帧定为1。
增加一层,将第1层的整个内容复制到这一层,但将实例的循环起始帧定为12,如图3-38所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0062_0001.jpg?sign=1738780804-DDawAIyaH6UEgRieyhZKaEpxZN2BnkES-0-b6dcba93d74aecbfe0a426e722e9cc1e)
图3-38 instance参数的调整
用同样的方法再加2层,分别复制第1层,将instance的起始帧分别定为24和30。这样,在35帧内形成一个连续的,但错落有致的循环,如图3-39所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0062_0002.jpg?sign=1738780804-DsW1ADVAIq8toxhsBgAucwc1KxLiLfx5-0-b70d5ac4da2d21bf3109972d7488fcc2)
图3-39 形成循环
再建立一个symbol,命名为“s4”。这是最后形成的symbol。将s3以graphic模式拽入,instance的循环起始帧定为1,同样将s3再重复拽入4次,形成5个s3,把它们并列,但后面4个instance的循环起始帧分别定为5、7、9和11,如图3-40所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0062_0003.jpg?sign=1738780804-m5d5eXju1OvqvTajUEyGG6JRuyc1ZLgz-0-f882c1f69e974088f5ea6b0de45b46e5)
图3-40 重复引入s3
这时按回车键检验一下动作。
下面将s4拽入场景,将instance的引用模式定为【movieclip】。按【Ctrl+Enter】组合键检测循环的正确性。
现在回过头来看这雪有点不像雪——倒像是漫天飞舞的煤球!我们回到第1步,在s1中重新画雪花的形状,可以只简单地改一下颜色,这样的雪像个大元宵,很可爱、很卡通;也可以画成传统的六角形的雪花。只要改了s1中的雪花,s4中的雪花也自动改过来了。这就是Flash的方便之处。
制作雪的要点:用graphic模式引用同一个symbol的instance,分别调整其循环起始帧数。这是Flash最重要的技巧之一。
3.3.3 落叶
之所以在这里将落叶插进来,是因为其制作原理和下雪基本一致。
制作落叶的循环动作时也需要强调symbol的调用。
树叶飘落时受到空气阻力,会在空气中翻转,呈现摇曳多姿的形态。在做树叶飘落的循环时应该考虑到这一点。
落叶的8个形态如图3-41所示。建立一个新symbol,命名为“y1”,一共8帧,在每帧中画出树叶翻转的一个特定形态,并且这8帧形成一个循环。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0063_0001.jpg?sign=1738780804-pSJJYcWk1pnn7kRXEVwcteTqrGcfGcNn-0-dc7b9c784cd36fbf14d07d90b3b16245)
图3-41 落叶的8个形态
再建立一个新symbol,命名为“y2”,在这个symbol中引用y1做出落叶过程。这个57帧的symbol,每隔3帧为1个keyframe,现在看看每个keyframe上对y1的引用,如图3-42所示。(图中编号是symbol内部时间线上的帧数。)
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0063_0002.jpg?sign=1738780804-Y2TaOIiGLNpmDi2Vr18N4bl9IjpKcU6E-0-de086e86fb5f071cf86a62cb3fa1eafa)
图3-42 合成57帧的symbol
图中的编号是这个帧在symbol时间轴上的顺序。
在引用y1的过程中,模式均为“Graphic/Single Frame”,但First参数不一样。下面结合这19个关键帧来看树叶飘落的过程。
第1帧、第4帧、第7帧:First=1,实际上是同一个帧在3帧中旋转了不同的角度。
第10帧:引用了两个instance,其中一个First=2,另一个First=1/Alpha=35%,这样,利用Alpha值的调整造成“在这一帧上还保留有上一帧的残像”的效果,即一种过渡效果。
第13帧、第16帧、第19帧:First=2,还是同一个帧在3帧中旋转了不同的角度。
第22帧:类似第10帧,引用了两个instance,其中一个First=3,另一个First=2/Alpha=35%。
第25帧:First=3。
第28帧:类似第22帧,引用了两个instance,其中一个First=4,另一个First=3/Alpha=35%。
第31帧、第34帧:First=4。
第37帧:类似第28帧,引用了两个instance,其中一个First=5,另一个First=2/Alpha=35%。
第40帧:类似第37帧,引用了两个instance,其中一个First=6,另一个First=2/Alpha=35%。
第43帧:First=6。
第46帧:类似第40帧,引用了两个instance,其中一个First=7,另一个First=6/Alpha=35%。
第49帧:First=7。
第52帧:类似第46帧,引用了两个instance,其中一个First=8,另一个First=7/Alpha=35%。
第55帧:First=8。
这样形成一个完整的飘落过程。在实际应用中,可以运用它在场景中划过一条自上而下的轨迹多定一些帧,再配合舒缓的节奏。
其实利用Alpha制造过渡帧的方法不是Flash动画的专利。如果仔细地、一帧一帧地分析过像日本《机器猫》这样的电视动画片,你会发现它们大量采用了同样的方法——在本来应当加一个过渡帧的地方,直接跳到了下一帧,而将上一帧变成半透明覆盖在上面一层上。这无疑是一种取巧的方法,但对节省工作量、降低制作成本有莫大的好处,效果也说得过去。
下面这个例子结合了上面的内容和雪花飘落的制作技巧,反映的是落叶纷纷飘落的场景。
首先建立一个symbol命名为“z1”,用5个keyframe画出枫叶翻转的各个角度,如图3-43所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0064_0001.jpg?sign=1738780804-c74MJXS8kDpiJE2tDFJwAn5voTIoGesz-0-c83ec248d2509433ba300808f65b5b98)
图3-43 先画出红叶的5个形态
其次再建立一个symbol命名为“z2”,共27帧,1层。调用z1,合成一个更复杂的飘落过程,中间也利用重叠帧调整Alpha值的方法做出比较自然的过渡,如图3-44所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0064_0002.jpg?sign=1738780804-zFjbCqLQowIS7uSIo8qUQub6PnDqxXCk-0-9f790003bffb27cf1c82409d2de99aa9)
图3-44 合成一个复杂的飘落过程
然后再建立一个symbol命名为“z3”,制作1片枫叶下落的过程。一共54帧,调用z2,加导向层(Motion Guide),将z2下落的轨迹定位于一条曲线上,如图3-45所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0064_0003.jpg?sign=1738780804-hB7GgsWORZu1r1WftYdLbdnNq7jfz72i-0-069cd5b8750d69ab3bfd94b0ab58b2c3)
图3-45 下落的轨迹
再建立一个symbol命名为“z4”,制作一个4片枫叶下落的循环动作。共54帧,分成4层,每层都在中央位置(x=0,y=0),调用z3,instance的模式为Graphic/loop,不同的是First值,从下层到上层分别为1、13、30和40。4片枫叶下落的循环动作如图3-46所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0064_0004.jpg?sign=1738780804-7THmY4ITNSQaj0PNGXHpJU9gq2vx6Lc2-0-9e5a2b31284ffbfbe00aec86d4a781a3)
图3-46 4片枫叶下落的循环动作
最后建立一个symbol命名为“z5”,共54帧,1层。仅第1帧为keyframe。在这帧中,调用4次z4(根据需要次数自己定),每个instance的模式均为Graphic/loop,不同的是First值,具体值可根据需要自行调整。另外,有些instance经过缩放,有些做了镜像旋转(Flip horizontal),总之,要将一个“死”的symbol变活,尽量产生多个变化的instance,如图3-47所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0065_0001.jpg?sign=1738780804-nCk9wogAU4dKjMWR8Sc8IIdIrjvVIYOm-0-adc9e80905fcb2828b4d05f45be39e9a)
图3-47 漫天红叶
这样,一个漫天红叶的浪漫场面就做好了。
3.4 动物
3.4.1 飞翔的鸟
飞翔的鸟就像人走路,是一个循环动作。飞鸟的翅膀是否很简单呢?在优秀的动画中,并没有“很简单”的动画,即使要做成循环动画,依然要仔细考察这个动作自身的特点。如果不考虑这些特点,做出来的动作必然是僵硬死板的。
一般的做法是将鸟的身体分解,把头、身体和尾巴连成一体成为一个symbol,把翅膀做成另外一层或两层。这个做法没有问题,但注意,飞鸟的翅膀并不是简单地上下扇动。它正符合前面讲到的“追随动作”。飞翔的鸟如图3-48所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0065_0002.jpg?sign=1738780804-5VfkIu5ng0dDQeSpuadIg1pdsrIKBqxY-0-9fe30ca1f746577b30ee4170f23e5dfd)
图3-48 飞翔的鸟
这里考虑的重点是:鸟的翅膀毕竟是柔软的,还要考虑翅膀的运动对整个身体的影响。图3-48 中的虚线是参考线,当鸟的翅膀扇到下面时,身体抬高,位于虚线上面(位置1);当鸟的翅膀抬到上面时,身体降低,位于虚线下面(位置4);鸟的身体就在这高低之间循环往复。
再看翅膀,在位置3中,翅膀的根部已经抬到了最高位置,但看翅膀末梢部位,仍然没有到达高点,明显是一个跟随的动作;同样在位置6中,翅膀根部已经压到最低位置,但末梢仍然拖在后面,位于虚线左右。通过这样的处理,突出了翅膀柔软的特性和无形的空气对鸟的托举。
如果从正面看鸟的飞翔,可以把上面的描述简化成如图3-49所示的飞翔示意图。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0065_0003.jpg?sign=1738780804-Vz326L8O0EslS6UcJUfIhWSLEhkt4RuO-0-dde37ff72d40296cd19cedd2fb3f5dbe)
图3-49 飞翔的示意图
这里用8帧代表一个循环。两道简单的线条代表翅膀的位置。请对照图3-48研究一下鸟的翅膀的运动规律。
3.4.2 四蹄动物
在循环动作中,最难掌握的大概就是四条腿的动物走路了。如果简单地处理成两条前腿是一个人走路,两条后腿是另一个人走路的姿态,多少会显得不伦不类。
首先,四蹄动物前后腿的关节走向和人腿有很大区别;其次,在运动过程中,同一时间内,四蹄动物只有一只蹄子是用力着地的。
如图3-50所示的为母狮走路的画面。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0066_0001.jpg?sign=1738780804-CpxDeBDu6wNtxKAJIYuQ6BV3lTaMx1tk-0-16216d146cc73a91cd741e1197975689)
图3-50 母狮走路的画面
四蹄动物的行走规律是先用一侧的腿迈出一步,再用另一侧的腿迈出第二步。
如图3-50所示,假设狮子先用左后腿开始走,然后是左前腿。
现在它移动了左侧的双腿,下一步自然要开始移动右侧的腿。首先移动右后腿,然后是右前腿。
这个动作按照这样的顺序进行:
(1)左后腿;
(2)左前腿;
(3)右后腿;
(4)右前腿。
复杂情况发生在这些脚步之间,因为当一条腿着地的时候,其他腿正分别向后滑行、抬起跨过或者准备着地。
记住:一个时间里,只有一只脚接触地面。
为加深理解,再举一个马行走的例子,如图3-51所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0066_0002.jpg?sign=1738780804-4LRxP82kxGZEjGdiQ2cPE6N7p7imfurI-0-e50f9a93709e77ffb5c126ba510e1a56)
图3-51 马的行走
这里用简单的4帧表示出前面说的【后左】→【前左】→【后右】→【前右】的循环顺序。
在慢走的过程中,前腿比后腿慢跨半步。由于前后腿的交替迈步,身体的头部略微倾斜,这样更加生动。
3.5 循环背景
在制作Flash动画时经常要用到循环背景。例如,角色在走,背景向后移动。如果角色走的时间很长,就要考虑背景是否采用循环。再例如,从飞驰的火车车厢里看到外面的景色,在动画片中几乎都用循环的方法处理。
在Flash中制作循环背景很方便,这得益于symbol的思想。
3.5.1 循环背景的制作
顾名思义,循环一旦制作完成,就可以当做背景,就可以无限地循环下去,左右贯通,没有破绽。背景的制作方法和前面介绍的雪、落叶等循环不太一样,背景制作的关键是要将左右连贯起来。
新建一个文件,可以随便确定画面大小,这里是400×300。
画一些背景上要用的元素,比如树、房子等,如图3-52所示。注意不要画到画面宽度之外。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0067_0001.jpg?sign=1738780804-I4QHKd9a93S8xR2OIdzXqOSLcCxT4ony-0-97d2cd42bd627cf8e65b3919d1f1b0e0)
图3-52 房子和树
用矩形画一个地面,如图3-53 所示,把它移动覆盖到刚才画的背景上。要注意,矩形的长度和影片画面的宽是一样的(400),并且位置严格顶在画面左边。可以通过调整属性面板上的x、y坐标做到这一点,如图3-54所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0067_0002.jpg?sign=1738780804-jtCoRjMNS6o53mj6HR1ZjKvnxgqBAglD-0-7d37cbab1cc1eeda1e4e76f36e8b798e)
图3-53 增加一个地面
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0067_0003.jpg?sign=1738780804-2itVoZU07PkpKUEyRS5RiZXryYrnC0RA-0-522d1e82af6aa08a277c6f039bdbc462)
图3-54 调整属性面板上的x、y坐标
右键单击画面,选择【Select all】命令,选中全部元素。然后按【F8】键,将它们设成一个symbol,属性是Graphic,命名为“bk0”,如图3-55所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0068_0001.jpg?sign=1738780804-dxOyPSTCDOaF88QAbyax6DGjFjg72uBA-0-f1069f7f617f626ab298e1578ff37c97)
图3-55 将全部元素转换成symbol
在时间线上第51帧处按【F6】键,设置keyframe,在这一帧将bk0右移400,如图3-56所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0068_0002.jpg?sign=1738780804-gxN1v58mfuzCoqXEG4dRwsDxkpYSVv6b-0-ffb8f337ef95663f95188a477fd72764)
图3-56 设置关键帧
回到第1帧,右键单击bk0,选择【Copy】命令。新增加一层,在第1帧处按【Ctrl+Shift+V】组合键,将bk0原位复制,如图3-57所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0068_0003.jpg?sign=1738780804-Hyyxkx1dIzjcJ5JrbarMafMlCpo4zK2U-0-27526c7ec8f798ac76aff99d273c551f)
图3-57 原位复制bk0
同样,在第51帧处按【F6】键。回到第一帧,在这一帧将bk0左移400。
按住【Shift】键的同时选中两层,右键单击,在两个keyframe中间创建补间动画,如图3-58所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0068_0004.jpg?sign=1738780804-NwphRsjMeWt3MRNeEr18DJtIsdfKvizI-0-c3876f9305d8f7d67081194fb418f7e2)
图3-58 创建补间动画
按住【Shift】键,同时选中两层的第50帧,按【F6】键,将第50帧设为keyframe,如图3-59所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0069_0001.jpg?sign=1738780804-0V7qhxTu1fC4DAb5XhhLRAWx5M5VZfvu-0-25972a26a5ba765c64f1557781627518)
图3-59 第50帧设为关键帧
同时选中两层的第51帧,按【Shift+F5】组合键将第51帧删除,如图3-60所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0069_0002.jpg?sign=1738780804-ALqi2vep95yJluY0SiWkWMN8FEHoHmoP-0-df0d743389f19d0e5f9a6d4baacf1497)
图3-60 删除第51帧
选中两层所有内容,右键单击,选择【Copy Frames】命令,如图3-61所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0069_0003.jpg?sign=1738780804-KeYS5efPeo6HD59qzYNqXwcxxNI0oaad-0-663273d580857007ae651aadfbbd1b9d)
图3-61 选择【Copy Frames】命令
按【Ctrl+F8】组合键,新建一个symbol,命名为“bk”,属性为“Movie Clip”,单击【OK】按钮进入bk。选中第1帧,右键单击,选择【Paste Frames】命令,这样就做好了一个循环背景的symbol,如图3-62所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0069_0004.jpg?sign=1738780804-Io0XWKeUIYofDFvS0IRurhyrTDvSJda6-0-8e4b14ca560828b54976feacf39d4176)
图3-62 循环背景的symbol
回到主场景中,新建一层,然后删除现有的两层。将bk拉进场景,x坐标定为-400,如图3-63所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0070_0001.jpg?sign=1738780804-i8zSRpzBrSdtVzDR060AzIgMcFrfFUKS-0-6219fc311d371912539279cd868011c2)
图3-63 引用symbol
现在可以按【Ctrl+Enter】组合键检测一下这个循环背景的效果了。
另外,可以用相同的方法再做一个稍远一点的循环背景,比如山,放在这层的后面。但一定要注意,山移动的速度一定要慢于房子移动的速度,这样就可以形成一个很生动立体的背景。
3.5.2 循环背景的灵活使用
在3.5.1节中,总结了如何制作循环背景。最后的成果是一个性质为Movie Clip的symbol。将它引用到场景中,就可以任意地循环下去。
在实际工作中,有时候要灵活运用一下循环背景。如图3-64所示为循环背景的“单元”。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0070_0002.jpg?sign=1738780804-dL4k0SHmqE9Xv01Tr2CyWjRHYTBgaOBy-0-e840a69a3217a448c8c771e31beb4532)
图3-64 循环背景的“单元”
图3-64是一个“单元”,即制作成的循环背景重复这样的场景。
按照上面介绍的方法,用图3-64 的“单元”制作成循环symbol,制作完成的循环背景如图3-65所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0071_0001.jpg?sign=1738780804-qkdloTIMPAXqUV8DADLHUUGnbnHe7BaP-0-89e2a2ceb12cea9e8d1d0a4754693cc9)
图3-65 制作完成的循环背景
在图3-65中,循环一共50帧。
现在,我们得到一个Movie Clip,它可以无限循环下去。
再来看故事情节:主人公的飞机在天上飞,如图3-66所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0071_0002.jpg?sign=1738780804-BnTNMTVZLLgSrlj1YW3lE03rV9xTxsLX-0-1a578c574bdd97f29110985244557762)
图3-66 飞机
图3-66中,在时间轴上只有1帧,因为飞机和循环背景都是Movie Clip,因此有自我播放的性质,在主时间轴上不需要加足相应的帧数。
实际问题是如果设计的飞机在飞了一定时间之后突然掉下去了,背景怎样处理呢?
首先,加任意多的帧,假设飞机在某处掉下去,如图3-67所示。那么到掉下去时背景应该停止移动了。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0071_0003.jpg?sign=1738780804-3WtcdaQyusU8f8oPbJNm6SRRaNH2BXAg-0-e75b14c9e335c30d35e5a6ffee3b3670)
图3-67 掉下去的位置决定了
然后处理飞机。这比较简单,把飞机拽下去就行了,飞机掉下去如图3-68所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0071_0004.jpg?sign=1738780804-pP1r19QH4opaF34Bp7KOPp3ZDIDhXVE4-0-f536181e24a5a6f1484b3705a131c7d7)
图3-68 飞机掉下去
在图3-68中,第78帧到第85帧反映飞机下坠的过程。记住,别忘了调整Ease值。
再回到第1帧,选中bk层中的背景symbol,在属性面板中改变instance的调用属性为Graphic/Loop/First=1,如图3-69所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0071_0005.jpg?sign=1738780804-Ju7nRtHlEZLGn1trbFrxaNAMDHcNSKbh-0-11716523ad8b11ef9b268bc3e32afc01)
图3-69 改变instance属性
再到飞机掉下去的第78帧。在这一帧,背景应该停止,选中bk层中的背景symbol,在属性面板中,改变instance的调用属性为Graphic/Single Frame/First=28,如图3-70所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0071_0006.jpg?sign=1738780804-MXj7Sa0UwIKd9cl5j5HRisadREoGMbHJ-0-1c1bc06a57183a303cbacc482784ae8a)
图3-70 继续调整instance
需要注意的是,图3-70里的First值28并不是我们定的,是在选择Single Frame时自动生成的。它按照开始循环所定的顺序自动计算出来。
这是一个灵活运用的例子,教大家灵活运用symbol的方法。
我们知道symbol有3种,其实它本身是什么属性不太重要,重要的是它在场景中的instance的性质。这个性质可以随需要而调整。
读者在Flash中亲自实践一下这个例子就会更明白。
3.6 说话
说话和走路一样是一般动画片中最常用的动作。如果是一般性的对话,可以做成循环;如果是大叫、呼号、大哭大笑等必须单独做出来。
3.6.1 简单的说话
在这里,简单的说话指的是一般性的对话。许多影片正是用说话带动整个情节发展的。
除非有特殊要求(比如,要求口型严格地和声音吻合),说话一般都简化成一个循环动作,即在一个时间段内,不管实际上说的是什么话,都是一个动作在循环着。最简单的就是画3帧不同的嘴型即可代表千变万化的说话。Flash动画中更是如此。
下面是具体的制作过程。新建一个symbol,在第1 帧先画一个闭着的嘴。可以看见它是一个带笑的嘴,如图3-71所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0072_0001.jpg?sign=1738780804-OAgaAZXXkZa1bEM7GFvDRDrCzgcrA518-0-51d4045279b36b3e09a122e8ad426535)
图3-71 闭着的嘴
在第2帧画一个半张的嘴,加上牙齿,如图3-72所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0072_0002.jpg?sign=1738780804-RraI7EgkCn7xRzs2Z7s5f7g9VEyH1EJS-0-a43b659bf95110a7cb1bcdf39f6866fb)
图3-72 半张着的嘴
最后在第3帧画一个完全张大的嘴,加上牙齿和舌头,如图3-73所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0072_0003.jpg?sign=1738780804-Lj2Ol0Vix3faFUhCzU3MgjKZTyzDjzP2-0-1eef42b3676c09244fca5de0b552209c)
图3-73 全张的嘴
在这3帧中间适当地加上中间空白帧,这样不至于使动作太快,如图3-74所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0072_0004.jpg?sign=1738780804-DAmtzPe7lvSxRYDOBgG90smM3nKsjUBQ-0-e6555e80c097c75f439d6e9f0a899409)
图3-74 6帧循环
在实际情况中,如果按照【闭】→【半张】→【全张】这个循环走,可能会很机械。一般采取【闭】→【半张】→【全张】→【半张】→【全张】→【半张】→【闭】的循环顺序,这样,同样是以3帧为基础,搭配出来的效果就比较自然了,如图3-75所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0073_0001.jpg?sign=1738780804-s3G0Lxw3jxHSfb2XZOBQnnnVIwgMOuMW-0-052480424e3879db16a0d43a579491ba)
图3-75 说话的循环
可以根据不同的要求将循环打破,插入一些特定的帧,比如,根据剧情的需要,加进一个特别大的嘴表示大喊大叫等。
3.6.2 元音和辅音
如果要求精细的说话,就需要对口型,这时就不能用循环的方法一劳永逸地解决问题了。
在国外动画片中,角色自然是讲外语的。以英语为例,动画家按照元音将口型分成几类,如图3-76所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0073_0002.jpg?sign=1738780804-ZGIdozPkrBCfKgluEANx9CclfrsrLqUl-0-4dda09afbaf5b1233a79f90fb0678176)
图3-76 按元音分类的口型
按照辅音,将口型也分成几类,如图3-77所示。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0073_0003.jpg?sign=1738780804-0xTu625Ep6T0YJQcF6GnkUFMrgw7KEvL-0-bdcb9a344a4ddcb88c152f6ceeae83b5)
图3-77 按辅音分类的口型
我们看迪斯尼的动画片,发现角色的说话很生动逼真,好像他们真的是在讲话,这就是按照一个个单词来精确对口型的结果。
汉语是否也适用这样的做法呢?好像还没有人做这样的总结,但整体从发音上把握,应该也跑不出英语这几个范围去。在需要对口型时,大家可以参考这几个分类。
3.7 习题
(1)在图3-49中请注意两点:
第一,鸟的翅膀扇动在水平线之上和在水平线之下,有什么不同?主要受什么因素的影响?
第二,鸟身体的上下起伏是怎样确定的?在示意图中,哪个点是参照点?
(2)请按照下面的图进行临摹,做成Flash。
![](https://epubservercos.yuewen.com/69EEBF/3590498804434801/epubprivate/OEBPS/Images/figure_0074_0001.jpg?sign=1738780804-6Ddz5CMjU11ro6HSE7oBTi34vuz0imeN-0-b0cbe4f3f70807d6bb57047af3625ab7)
(3)在循环背景的制作中,为什么采用如图3-60所显示的步骤?为什么一开始不设成50帧?
(4)请按照所学内容制作一个循环背景。如果以前采用过其他方法制作循环背景,比较一下哪个更好一点?