Flash动画制作教材

1、-. z.第二章 动画制作动画其实是一门古老的艺术，它是通过把人、物的表情、动作、变化等分段画成许多画，再通过放映手段连续播放，给人的视觉造成连续变化的图画。随着计算机技术的开展，用计算机制作动画变得越来越简单，非美术专业的人士也能成为制作动画的高手。本章以Flash动画制作软件为操作平台，来学习如何用计算机制作动画。第一节 动画制作根底计算机动画就是利用传统的根本原理，将原画作为关键帧的画面，然后再利用计算机自动将中间的连续画面模拟出来，结合科学与艺术，突破静止、平面图像的限制，创造出栩栩如生的动画作品。一、Flash动画简介Flash是一款多媒体动画制作软件。它是一种交互式动画设计工具，用

2、它可以将音乐，声效，动画方便地融合在一起，以制作出高品质的动态效果，或者说是动画。FLash动画有别于以前我们常用于网络的 GIF 动画，它采用的是矢量绘图技术，矢量图是可以无限放大而图像质量不损失的一种格式的图，由于动画是由矢量图构成的，就大大的节省了动画文件的大小，在网络带宽局限的情况下，提升了网络传输的效率；可以方便的下载观看，一个几分钟长度的 Flash 动画片可以只有一两兆大小。二、Flash的编辑环境通过开场菜单来启动Flash，启动后，在创设新工程中的选Flash文档，就可以新建一个Flash文件，进入到Flash的编辑环境，如图2.1所示。工具箱时间轴面板场景工作区图2.1 F

3、lash编辑制作环境窗口1.工具箱在窗口的左侧有许多常用的编辑工具，这些工具集中在一起，我们管它叫工具箱。在Flash中绘制图画或对图画进展编辑操作，都离不开工具箱的工具。2.时间轴面板时间轴是由许多的小格组成，每一格代表一个帧，每个帧可以存放一幅图片，许多帧图片连续播放，就形成了一个动画影片。时间轴中显示的数字是单位时间播放的帧数。默认情况下，是每秒可以播放12帧。3.认识帧和帧的类型帧是构成动画的根本单位，每一个精彩的flash动画都是由很多个精心雕琢的帧构成的，在时间轴上的每一帧都可以包含需要显示的所有容，包括图形、声音、各种素材和其它多种对象。 在Flash的帧中可以分为关键帧、空白关

4、键帧和普通帧。在动画制作的开场，只有一个空白关键帧，当我们在空白关键帧上面绘制了一个图形时，它就变成关键帧了，而普通帧和关键帧的不同点在于前者不可编辑，后者可编辑。关键帧在动画中是不能缺少的，因为它能使画面容产生变化。空白关键帧是没有包含舞台上的实例容的关键帧。 普通帧是在时间轴上能显示实例对象，但不能对实例对象进展编辑操作的帧。关键帧在时间轴上显示为实心的圆点，空白关键帧在时间轴上显示为空心的圆点，普通帧在时间轴上显示为灰色填充的小方格。4场景工作区场景工作区也称场景，它是制作动画的区域，对动画元素的绘制、修改、编辑等，都是在场景工作区中进展的。5属性面板属性面板位于Flash软件窗口下方，

5、在这里可以设置对象的一些根本属性，如图2.2是椭圆工具的属性面板。图2.2椭圆工具属性面板6.动作面板动作面板主要由命令列表窗口、目标列表窗口和程序编辑窗口三大局部组成，如下列图2.3所示。命令列表窗口位于面板的左上角，是用于放置各种ActionScript动作脚本的窗口。目标列表窗口位于面板的左下角，在该窗口中可以快速地选择需要添加动作脚本的目标元件或关键帧，从而节省了在场景中寻找及切换编辑窗口的步骤，大大提高了工作效率。动作面板的右侧是程序编辑窗口，它是用于程序编写的地方。图2.3动作面板7.混色器面板混色器面板是Flash中用于色彩处理的一个重要面板，熟练地使用该面板，可以帮助用户快速地

6、完成色彩的填充，编辑出色彩丰富的图形，如图2.4所示。图2.4 混色器面板8.元件元件是FALSH动画的根本组成元素，FALSH里面有很多时候需要重复使用素材，这时我们就可以把素材转换成元件，或者干脆新建元件，以方便重复使用或者再次编辑修改。也可以把元件理解为原始的素材，通常存放在元件库中。Flash 元件有三种形式，即影片剪辑、按钮、图形，元件只需创立一次，然后即可在整个文档或其他文档中重复使用。 影片剪辑元件可以理解为电影中的小电影，可以完全独立于场景时间轴，并且可以重复播放。影片剪辑是一小段动画，用在需要有动作的物体上，它在主场景的时间轴上只占1 帧，就可以包含所需要的动画，影片剪辑就是

7、动画中的动画。影片剪辑必须要进入影片测试里才能观看得到。 按钮元件是用于具有交互功能的动画，当鼠标在按钮上滑过、点击、移开时按钮会产生不同的响应，并转到相应的帧。图形元件是可以重复使用的静态图像，它是作为一个根本图形来使用的，一般是静止的一副图画，每个图形元件占1 帧。9库动画是由许多的元件组成的，就像演戏一样，要有演员，当需要他们出场演出时，就会从后台走向前台；在动画制作中，后台就是库，平时场景上的图案都以元件的形式保存，存放在库里。库中有三大类元件：图形、影片剪辑、按钮。只要是元件，就一定可以在库中找到他们，我们在制作动画的时候，如果需要用到元件，可以直接从库中把元件拖到场景中。10功能面

8、板 如颜色、库、对齐等功能，都集中在这里，如图2.5所示。图2.5 功能面板三、图层图层是时间轴面板的一局部，在默认状态下，图层面板位于时间轴面板的左侧，它是按顺序一层一层地相互叠加在一起的。1.图层的概念图层是动画制作中的一个非常重要的概念，它犹如一透明的纸，上面可以绘制任何事物或书写任何文字，所有的图层叠合在一起，就组成了一幅完整的画。图层有两大特点：除了画有图形或文字的地方，其他局部都是透明的，也就是说，下层的容可以通过透明的这局部显示出来；图层又是相对独立的，修改其中一层，不会影响到其他层。如果我们把制作的动画场景看成是一个舞台，图层就相当于舞台中演员所处的前后位置。上面的图层在舞台的

9、前面，处于不同图层的同一位置的对象，前面的挡住后面的；不同位置的对象，可以透过前面图层看到后面的图层对象，如图2.6所示。图2.6图层显示2.图层的作用图层的作用主要有两个方面：一是可以对*图层中的对象或动画进展编辑和修改，而不会影响到其他图层中的对象；二是使用特殊图层可以制作特殊的动画效果。3.创立新图层了解了图层后，就让我们来试一试，为动画添加图层吧！建立一个新的Flash文档时，系统会自动建立一个图层，默认的名字为图层1。如果想创立一个新的图层，可以单击时间轴面板的增加图层按钮 ， 就增加了一个图层，默认名字为图层2。为了容易识别，我们可以将新增的图层重新取一个名字，如图2.7所示。图2

10、.7更改图层名称一个图层创立后，我们可以在该图层中使用工具箱中的工具绘图，也可以导入原有的图片或元件。4.导入图片和元件我们可以把图片和元件导入到当前的图层或库中。导入的方法如下：在文件菜单中单击导入中的导入到舞台或导入到库命令，如图2.8所示。图2.8文件菜单的导入导入到舞台，我们可以在场景中看到导入的图片和元件，如果导入到库，系统会弹出导入到库对话框，如图2.9所示。导入到库里的图片和元件我们在场景中看不到，使用时需要到库里查找。图2.9导入到库对话框如图2.10所示将小丑鱼元件导入到场景中。图2.10将小丑鱼元件导入到场景中5.参加文字接着我们为动画加上标题文字海底世界，具体操作如下：选

11、择工具箱中的文本工具，输入文字海底世界，翻开如图2.11所示的属性面板，设置文本属性。图2.11设置文本属性如图2.12所示，参加了标题的画面是不是更漂亮了？图2.12参加标题文字练一练新建一个图层，绘制或导入一个小孩的图形或图片。第二节 制作动画制作动画是建立根据时间运动和变化效果的过程，动画可以是对象从一个位置移动到另一个位置的运动过程，可以是一段时间颜色的变化过程，也可以是从一个形状到另一个形状的改变过程。任何位置或外观形状根据时间而做的改变都是动画。一、逐帧动画逐帧动画是将一个动画的连续动作分解成一个一个图片，把每一个图片用关键帧描绘出来。当关键帧连续播放，则显现动画效果。动画效果：夜

12、色降临,万家灯火逐渐点亮,形成一个欣欣向荣的城市夜景。图2.13万家灯火操作步骤：(1)启动FlashM*，在最下方属性对话框中将帧频设置为3，大小为550*400像素，背景颜色为深蓝色。如图2.14所示。 图2.14属性面板(2)选择绘图工具箱中的直线工具，在舞台上拖画出楼宇轮廓。其方法是：选定位置按下左键不放拖动鼠标到预期位置放开左键，放开后不要移动鼠标位置，继续画完图形，以保证各条直线端点很好地连接并形成闭合路径，为以后的填充做准备，如图2.15所示。 图2.15 楼宇的轮廓线(3)选择工具面板中的颜料桶工具，把填充颜色设置为灰色，移动鼠标在所选闭合路径区域填充颜色，如图2.16所示。图

13、2.16把楼涂成灰色(4) 选中第2帧，按右键插入关键帧，选择绘图工具条中的矩形工具 ，将填充颜色设置为黄色，边框颜色设置为无色，在舞台上画一个小正方形。用黑箭头工具选中这个黄色矩形，右键转换为元件，弹出转换为元件对话框，如图2.17所示。命名元件为正方，类型选图形，单击确定按钮，将黄色正方形作为元件保存。按此方法，再做一个名为长方的元件，其形状和大小如图2.18右上角所示。图2.17转换为元件对话框图2.18长方和正方元件(5)在菜单栏中窗口菜单中选择库命令，翻开库窗口，发现里面有两个图形类元件，如图2.19所示。选中第3帧，按右键插入关键帧，从库中把2个元件的实体拖入舞台，将作为楼宇的窗口

14、。依此类推，第3帧到第15帧中每一帧都按右键插入关键帧，并增添小窗口数目。因条件所限这里只显示第2，5，15，这3帧的容，如图2.20所示。图2.19库图2.20 第2、5、15帧图示(6)影片完成后的时间轴状态，如图2.21所示。按菜单栏 文件中保存保存源文件，并按控制中测试影片在源文件同一目录下导出影片。 图2.21完成后的时间轴二、补间动画补间动画：是通过定义动画两端关键帧的容，然后让Flash添加它们之间容的动画，补间动画有两种移动补间动画和形状补间动画。1. 移动补间动画 移动补间动画：在一个关键帧上放置元件，在另一个关键帧上更改这个元件的大小、位置、透明度等，flash根据两个关键

15、帧的值来创立中间的动画被称为移动补间动画。动画效果： 足球小将把足球踢出，足球形成飞速旋转移动效果。图2.22足球小将操作步骤：1启动FlashM*，在 属性对话框中将帧频设置为12，大小为550*400像素。在图层1的第1帧导入一带足球小将的图片作为动画背景。方法是：菜单栏文件选择导入导入背景图片，如图2.23所示。图2.23导入背景图片2选择时间轴左下角的图标，新建图层2，在图层2的空白关键帧上绘制足球。方法是：首先用椭圆工具绘制足球外框，填充为白色。然后用线条工具在足球画个六边形，填充为黑色。最后用线条工具向边框绘制直线，在适当位置填充黑色，如图2.24所示。图2.24绘制足球3把足球转

16、换为元件，方法是：用箭头工具选中整个足球，鼠标放在足球上单击右键，选择转换为元件，如图2.25所示。命名为足球，行为为图形。图2.25转换为元件4在图层1的第24帧插入帧，在图层2的第24帧插入关键帧。选择图层2的第1帧，把足球放在起脚位置，选择图层2的第24帧，把足球放在目标位置，并用任意变形工具使足球稍稍变大一点，如图2.26所示。图2.26 足球在第1帧和第24帧位置5选择图层2的第1帧，在属性对话框补间中选择动作，旋转选择顺时针，如图2.27所示。如动作动画成功，在图层2中第1帧到第24帧显示为紫色，中间有实线箭头，如图2.28所示。图2.27设定动作补间动画图2.28动作补间在时间轴

17、的状态6这是动画就已经做好了，足球已经可以飞了。按菜单栏 文件中保存保存源文件，并按控制中测试影片在源文件同一目录下导出影片。2.形状补间动画 形状补间动画：在一个关键帧上绘制形状，在另一个关键帧上更改改形状甚至绘制新形状，flash根据两个关键帧的值来创立中间的动画被称为形状补间动画。动画效果：我是巴巴爸爸家族的一员，我在家人的关心下逐渐长大了。图2.29我长大了操作步骤：1启动FlashM*，设置 属性对话框中帧频为12，大小为550*400像素。在图层1的第1帧导入一图片作为动画背景。2选择时间轴左下角的图标，新建图层2，在图层2的空白关键帧上小巴巴。方法是：首先用椭圆工具绘制外形和眼睛

18、。用画笔工具绘制眼仁，然后用线条工具在嘴的位置绘制直线，然后使用箭头工具使嘴向下弯曲室外型更圆润，如图2.30所示。图2.30绘制小巴巴3在图层1的第30帧插入帧，在图层2的第30帧插入空白关键帧。绘制长大后的巴巴。如图2.31所示。图2.31绘制大巴巴4选择图层2的第1帧，在属性对话框补间中选择形状，如图2.32所示。如形状动画成功，在图层2中第1帧到第30帧显示为绿色，中间有实线箭头，如图2.33所示。图2.32设定形状补间图2.33形状补间在时间轴的状态5试试看，小巴巴就会逐渐长大了。选择 文件中保存保存源文件，并 测试影片看看效果吧。三、引导层动画将一个或多个图层到引导层，将会有一个或

19、多个对象沿引导层中的引导线运动的动画形式称为引导层动画。这种动画可以使一个或多个元件完成曲线或不规则远动。1.用铅笔工具绘制引导线的引导层动画动画效果：热带小丑鱼在海底珊瑚间按照我们想法自由的畅游。图2.34热带小丑鱼操作步骤：1启动FlashM*，设置 属性对话框中帧频为12，大小为550*400像素。在图层1的第1帧导入一海底图片作为动画背景。2新建图层2，在第1帧导入小丑鱼并转换为元件，在第60帧插入关键帧，在图层1第60帧插入帧使背景延续，如图2.35所示。图2.35分别插入帧和关键帧3设计小丑鱼运动的轨迹，选中图层2，选择添加引导层，并在引导层的第1帧上用铅笔工具绘制引导线，即我们希

20、望小丑鱼远动的轨迹，如图2.36所示。图2.36 铅笔绘制引导线4把图层2的第1帧小丑鱼和最后1帧小丑鱼吸附到引导线的起点和终点，方法是：选择图层2的第1帧，鼠标拖动小丑鱼元件中心点到引导线起点，当到起点时中心点小圈会有吸附感，就成功了，如图2.37所示。最后1帧同理吸附到终点位置。图2.37关键帧吸附到引导线5选中图层2第1帧，创立动作补间动画，测试影片，小丑鱼就可以按照我们的想法自由的畅游了，程序最后如图2.38所示。最后选择文件中的保存，保存动画。图2.38引导层动画最后状态2.椭圆工具绘制引导线的引导层动画动画效果： 2011年，中国第一个空间实验室天宫一号成功发射，这是它绕地球飞行的

21、动画。图2.39天宫一号环绕飞行操作步骤：1启动FlashM*，设置 属性对话框中帧频为12，大小为550*400像素。在图层1的第1帧导入一太空图片作为动画背景。2新建图层2，在第1帧导入天宫一号图片并转换为元件，在第60帧插入关键帧，在图层1第60帧插入帧使背景延续，如图2.40所示。图2.40导入背景图制作天宫一号元件3设计天宫一号的椭圆形轨迹，选中图层2，选择添加引导层，并在引导层的第1帧上用椭圆工具绘制一个只有边线没有填充的圆圈，即我们希望的天宫一号的运动轨迹。然后使用橡皮擦工具在圆圈上擦出一个小缺口，好确定天宫一号运动的起点和终点，如图2.41所示。图2.41椭圆工具绘制引导线4把

22、图层2的第1帧天宫一号和最后1帧天宫一号吸附到引导线的起点和终点。选中图层2第1帧，创立动作补间动画。5新建图层3，导入地球图片作为椭圆轨迹运动围绕的中心，用地球遮挡住局部椭圆轨迹，使其产生环绕飞行的效果，如图2.42所示。图2.42 环绕效果制作6保存运行动画吧，我们的动画在运行时是看不到引导线的，所以引导线动画和你所画的引导线粗细、颜色都没有关系。四、遮罩动画 遮罩动画：在Flash的图层中有一个遮罩图层类型，可以在遮罩层上创立一个任意形状的视窗，遮罩层下方的对象只能通过该视窗显示出来，而视窗之外的对象将不会显示。动画效果：这是个对文字产生放大镜效果的动画。图2.43 文字放大镜操作步骤：

23、1启动FlashM*，设置 属性对话框中帧频为12，大小为550*400像素。在图层1中输入文字信息技术，调整字体字号颜色。2新建图层2，复制图层1的文字到图层2，放大文字，在文字下使用矩形工具绘制一个足够大可以覆盖住文字大小的就比拟适宜的白色矩形。如图2.44所示。移动图层2遮挡图层1文字。图2.44图层的文字状态3新建图层3，在图层3中使用椭圆工具绘制一个椭圆图形，并转换为原件,如图2.45所示。图2.45 绘制要做遮罩的圆4分别在图层2和图层1中第40帧插入帧，在图层3的第40帧位置插入关键帧，这时，从上到下分别是图层3”、图层2”、图层1”。把图层3第40帧关键帧移到最后位置，并对图层

24、3创立动作补间动画，如下图2.46所示。图2.46图层1、图层2、图层3状态5把鼠标移动到图层3上，在标题处右键，快捷菜单中选择遮罩层，放大镜效果的动画就制作完毕了。整体显示如图2.47所示。图2.47创立遮罩动画五、制作并使用按钮元件动画效果： 现在我们实现对前边所讲的天宫一号遮罩动画进展暂停播放停顿等按钮控制。图2.48 按钮动画天宫一号操作步骤：1在前面完成的天宫一号遮罩动画根底上，首先添加一个新的图层，在第1帧使用椭圆工具、直线工具等绘制一个暂停图标，如图2.49所示。并且转换为元件， 如图2.50所示。图2.49绘制暂停图标图2.50创立按钮元件2双击暂停按钮，我们对按钮元件进展设置

25、，如图2.51所示，按钮有4种状态，分别为弹起、指针经过按下点击弹起：表示鼠标指针不在按钮上时的状态； 指针经过：表示鼠标指针在按钮上时的状态；按下：表示鼠标单击按钮时的状态；点击：表示对鼠标作出反响的区域，这个反响区域在电影中是看不见的。图2.51按钮元件的四种状态据此，我们对暂停按钮也对应绘制四种状态。弹起指针经过按下点击3设置完暂停按钮元件后，回到场景一，方法是单击时间轴下的场景一如图2.52所示。图2.52回到场景一4选中刚刚编辑过的暂停按钮元件，当属性上面的动作面板显示动作-按钮时，展开选项，选择左侧的动作影片控制stop，双击stop右侧命令行会显示on(release)stop(

26、)按钮命令设定完成，如图2.53所示。图2.53动作面板的设置5同理分别新建图层制作播放按钮和返回按钮，在设置按钮动作时播放按钮动作为动作影片控制play；返回按钮动作为动作影片控制goto帧输入1，如图2.54所示。图2.54播放和返回的按钮动作设置6接下来我们可以测试影片看看按钮控制动画的效果，最后保存。六、导入声音和视频动画效果： 清明上河图如涓涓流水般向右徐徐播放，同时背景响起清新的古筝曲。图2.55 清明上河图动画操作步骤：1启动FlashM*，设置 属性对话框中帧频为12，大小为550*400像素。背景为灰色，在图层1中导入清明上河图节选图片，并转换为图形元件。2把图层1第1帧的清

27、明上河图元件对齐在右边起点处，在图层1第15帧和第240帧分别插入关键帧。把第240帧清明上河图元件对齐在左边终点处。并在第15帧到第240帧之间创立动作补间动画。目的是让图片在1-15帧间作短暂停留，如图2.56所示。图2.56 清明上河图元件的关键帧位置(3)新建图层2，在第1帧输入文字清明上河图，在第15帧插入空白关键帧。目的是在前15帧显示文字。如图2.57所示。图2.57输入文字并延续14帧4新建图层3，插入背景音乐。方法是：首先选择文件导入选择音乐，这样就把文件导入到库中了，然后选择菜单栏窗口库翻开库窗口，最后选择刚刚导入的音频文件，拖动到场景1画布中。图层3就显现了音频波形，如图

28、2.58所示。图2.58 创立声音图层5最后我们在图片播放完后让图片和声音停顿下来，选中图层1的第240帧关键帧，当动作框显示动作-帧时，展开选项，选择左侧的动作影片控制stop，双击stop右侧命令行会显示stop()，图层1关键帧上会显现，帧命令设定完成。在图层三的第240帧插入空白关键帧，选中，同理，当框显示动作-帧时，选择左侧的动作影片控制stopAllSounds，双击stopAllSounds右侧命令行会显示stopAllSounds()，图层3关键帧上会显现，帧命令设定完成。如图2.59所示，由此可见，帧命令必须在关键帧上完成。图2.59 帧动作的设置6最后我们测试影片看看清明上

29、河图配背景音乐的播放效果，最后保存。第三节 综合实践： 拼出家乡好风光家乡，是每个人永远记忆的地方,不管我们走到哪里，它的样子永远印在我们的心上。我们深爱我们的家乡，为他的每一点开展而欣喜。你了解家乡吗？作品赏析图2.60 拼图游戏界面上面是用家乡图画制的Flash拼图游戏，运用你的聪明与才智，让我们一起动手试一试。思考交流你了解家乡的哪些方面。你能为家乡的变化做哪些事情。如何选择图片，怎样分割才是合理的。综合实践我们伟大的祖国，每天都在发生日新月异的变化；我们身边的生活，每天也有感动你的画面。你可以收集你喜欢的图片，将它们制作成拼图小游戏，并将它展示给大家。相信你一定会有更多创意的！制作步骤.利用文件菜单，导入选定准备好的图片。在场景里调整好图片的大小注意不要把图片调整得和主场景一样大，要留一点空隙。然后选中图片，按快捷键Ctrl+B将图片打散。2.接下来就要将图片分解成小图块了，点击工具面板里的套索工具，点选工具栏底部的多边形模式。用套索工具把图片分成8个不规则的形状，每分出一个形状，即将这个剪切下来的图片与原图片别离开来，效果如图2.61所示。图2.61 剪切后的界面3.用选取工具选取其中一局部，将其转换为影片剪辑类