Flash动画制作教材

第二章动画制作动画其实是一门古老的艺术，它是通过把人、物的表情、动作、变化等分段画成许多画，再通过放映手段连续播放，给人的视觉造成连续变化的图画。随着计算机技术的发展，用计算机制作动画变得越来越简单，非美术专业的人士也能成为制作动画的高手。本章以Flash动画制作软件为操作平台，来学习如何用计算机制作动画。第一节动画制作基础计算机动画就是利用传统的基本原理，将原画作为关键帧的画面，然后再利用计算机自动将中间的连续画面模拟出来，结合科学与艺术，突破静止、平面图像的限制，创造出栩栩如生的动画作品。一、Flash动画简介Flash是一款多媒体动画制作软件。它是一种交互式动画设计工具，用它可以将音乐，声效，动画方便地融合在一起，以制作出高品质的动态效果，或者说是动画。FLash动画有别于以前我们常用于网络的GIF动画，它采用的是矢量绘图技术，矢量图是可以无限放大而图像质量不损失的一种格式的图，由于动画是由矢量图构成的，就大大的节省了动画文件的大小，在网络带宽局限的情况下，提升了网络传输的效率；可以方便的下载观看，一个几分钟长度的Flash动画片可以只有一两兆大小。二、Flash的编辑环境通过“开始”菜单来启动Flash，启动后，在“创设新项目”中的选“Flash文档”，就可以新建一个Flash文件，进入到Flash的编辑环境，如图2.1所示。图2.1Flash编辑制作环境窗口工具箱时间轴面板场景工作区-欢迎下载21.工具箱在窗口的左侧有许多常用的编辑工具，这些工具集中在一起，我们管它叫工具箱。在Flash中绘制图画或对图画进行编辑操作，都离不开工具箱的工具。2.时间轴面板时间轴是由许多的小格组成，每一格代表一个帧，每个帧可以存放一幅图片，许多帧图片连续播放，就形成了一个动画影片。时间轴中显示的数字是单位时间内播放的帧数。默认情况下，是每秒可以播放12帧。3.认识帧和帧的类型帧是构成动画的基本单位，每一个精彩的flash动画都是由很多个精心雕琢的帧构成的，在时间轴上的每一帧都可以包含需要显示的所有内容，包括图形、声音、各种素材和其它多种对象。在Flash的帧中可以分为关键帧、空白关键帧和普通帧。在动画制作的开始，只有一个空白关键帧，当我们在空白关键帧上面绘制了一个图形时，它就变成关键帧了，而普通帧和关键帧的不同点在于前者不可编辑，后者可编辑。关键帧在动画中是不能缺少的，因为它能使画面内容产生变化。空白关键帧是没有包含舞台上的实例内容的关键帧。普通帧是在时间轴上能显示实例对象，但不能对实例对象进行编辑操作的帧。关键帧在时间轴上显示为实心的圆点，空白关键帧在时间轴上显示为空心的圆点，普通帧在时间轴上显示为灰色填充的小方格。4．场景工作区场景工作区也称场景，它是制作动画的区域，对动画元素的绘制、修改、编辑等，都是在场景工作区中进行的。5．属性面板属性面板位于Flash软件窗口下方，在这里可以设置对象的一些基本属性，如图2.2是“椭圆工具”的属性面板。图2.2“椭圆工具”属性面板6.动作面板动作面板主要由命令列表窗口、目标列表窗口和程序编辑窗口三大部分组成，如下图2.3所示。命令列表窗口位于面板的左上角，是用于放置各种ActionScript动作脚本的窗口。目标列表窗口位于面板的左下角，在该窗口中可以快速地选择需要添加动作脚本的目标元件或关键帧，从而节省了在场景中寻找及切换编辑窗口的步骤，大大提高了工作效率。动作面板的右侧是程序编辑窗口，它是用于程序编写的地方。-欢迎下载3图2.3动作面板7.混色器面板混色器面板是Flash中用于色彩处理的一个重要面板，熟练地使用该面板，可以帮助用户快速地完成色彩的填充，编辑出色彩丰富的图形，如图2.4所示。图2.4混色器面板8.元件元件是FALSH动画的基本组成元素，FALSH里面有很多时候需要重复使用素材，这时我们就可以把素材转换成元件，或者干脆新建元件，以方便重复使用或者再次编辑修改。也可以把元件理解为原始的素材，通常存放在元件库中。Flash元件有三种形式，即影片剪辑、按钮、图形，元件只需创建一次，然后即可在整个文档或其他文档中重复使用。影片剪辑元件可以理解为电影中的小电影，可以完全独立于场景时间轴，并且可以重复播放。影片剪辑是一小段动画，用在需要有动作的物体上，它在主场景的时间轴上只占1帧，就可以包含所需要的动画，影片剪辑就是动画中的动画。“影片剪辑”必须要进入影片测试里才能观看得到。按钮元件是用于具有交互功能的动画，当鼠标在按钮上滑过、点击、移开时按钮会产生不同的响应，并转到相应的帧。图形元件是可以重复使用的静态图像，它是作为一个基本图形来使用的，一般是静止的一副图画，每个图形元件占1帧。9．库动画是由许多的元件组成的，就像演戏一样，要有演员，当需要他们出场演出时，就-欢迎下载4会从后台走向前台；在动画制作中，“后台”就是库，平时场景上的图案都以元件的形式保存，存放在库里。库中有三大类元件：图形、影片剪辑、按钮。只要是元件，就一定可以在库中找到他们，我们在制作动画的时候，如果需要用到元件，可以直接从库中把元件拖到场景中。10．功能面板如颜色、库、对齐等功能，都集中在这里，如图2.5所示。图2.5功能面板三、图层图层是时间轴面板的一部分，在默认状态下，图层面板位于时间轴面板的左侧，它是按顺序一层一层地相互叠加在一起的。1.图层的概念图层是动画制作中的一个非常重要的概念，它犹如一张透明的纸，上面可以绘制任何事物或书写任何文字，所有的图层叠合在一起，就组成了一幅完整的画。图层有两大特点：除了画有图形或文字的地方，其他部分都是透明的，也就是说，下层的内容可以通过透明的这部分显示出来；图层又是相对独立的，修改其中一层，不会影响到其他层。如果我们把制作的动画场景看成是一个舞台，图层就相当于舞台中演员所处的前后位置。上面的图层在舞台的前面，处于不同图层的同一位置的对象，前面的挡住后面的；不同位置的对象，可以透过前面图层看到后面的图层对象，如图2.6所示。-欢迎下载5图2.6图层显示2.图层的作用图层的作用主要有两个方面：一是可以对某图层中的对象或动画进行编辑和修改，而不会影响到其他图层中的对象；二是使用特殊图层可以制作特殊的动画效果。3.创建新图层了解了图层后，就让我们来试一试，为动画添加图层吧！建立一个新的Flash文档时，系统会自动建立一个图层，默认的名字为“图层1”。如果想创建一个新的图层，可以单击时间轴面板的增加图层按钮，就增加了一个图层，默认名字为“图层2”。为了容易辨认，我们可以将新增的图层重新取一个名字，如图2.7所示。-欢迎下载6图2.7更改图层名称一个图层创建后，我们可以在该图层中使用工具箱中的工具绘图，也可以导入原有的图片或元件。4.导入图片和元件我们可以把图片和元件导入到当前的图层或库中。导入的方法如下：在“文件”菜单中单击“导入”中的“导入到舞台”或“导入到库”命令，如图2.8所示。-欢迎下载7图2.8“文件”菜单的导入“导入到舞台”，我们可以在场景中看到导入的图片和元件，如果“导入到库”，系统会弹出“导入到库”对话框，如图2.9所示。导入到库里的图片和元件我们在场景中看不到，使用时需要到库里查找。图2.9“导入到库”对话框如图2.10所示将“小丑鱼”元件导入到场景中。-欢迎下载8图2.10将“小丑鱼”元件导入到场景中5.加入文字接着我们为动画加上标题文字“海底世界”，具体操作如下：选择工具箱中的“文本工具”，输入文字“海底世界”，打开如图2.11所示的属性面板，设置文本属性。图2.11设置文本属性如图2.12所示，加入了标题的画面是不是更漂亮了？-欢迎下载9图2.12加入标题文字练一练新建一个图层，绘制或导入一个小孩的图形或图片。第二节制作动画制作动画是建立根据时间运动和变化效果的过程，动画可以是对象从一个位置移动到另一个位置的运动过程，可以是一段时间内颜色的变化过程，也可以是从一个形状到另一个形状的改变过程。任何位置或外观形状根据时间而做的改变都是动画。一、逐帧动画逐帧动画是将一个动画的连续动作分解成一个一个图片，把每一个图片用关键帧描绘出来。当关键帧连续播放，则显现动画效果。-欢迎下载10动画效果：夜色来临,万家灯火逐渐点亮,形成一个欣欣向荣的城市夜景。图2.13万家灯火操作步骤：(1)启动FlashMX，在最下方“属性”对话框中将帧频设置为3，大小为550x400像素，背景颜色为深蓝色。如图2.14所示。图2.14属性面板(2)选择绘图工具箱中的直线工具，在舞台上拖画出楼宇轮廓。其方法是：选定位置—按下左键不放—拖动鼠标到预期位置—放开左键，放开后不要移动鼠标位置，继续画完图形，以保证各条直线端点很好地连接并形成闭合路径，为以后的填充做准备，如图2.15所示。-欢迎下载11图2.15楼宇的轮廓线(3)选择工具面板中的颜料桶工具，把填充颜色设置为灰色，移动鼠标在所选闭合路径区域内填充颜色，如图2.16所示。图2.16把楼涂成灰色-欢迎下载12(4)选中第2帧，按右键插入关键帧，选择绘图工具条中的矩形工具，将填充颜色设置为黄色，边框颜色设置为无色，在舞台上画一个小正方形。用黑箭头工具选中这个黄色矩形，右键——转换为元件，弹出“转换为元件”对话框，如图2.17所示。命名元件为“正方”，类型选“图形”，单击“确定”按钮，将黄色正方形作为“元件”保存。按此方法，再做一个名为“长方”的元件，其形状和大小如图2.18右上角所示。图2.17转换为元件对话框图2.18长方和正方元件(5)在“菜单栏”中“窗口”菜单中选择“库”命令，打开“库”窗口，发现里面有两个图形类元件，如图2.19所示。选中第3帧，按右键插入关键帧，从库中把2个元件的实体拖入舞台，将作为楼宇的窗口。依此类推，第3帧到第15帧中每一帧都按右键插入关键帧，并增添小窗口数目。因条件所限这里只显示第2，5，15，这3帧的内容，如图2.20所示。图2.19库-欢迎下载13图2.20第2、5、15帧图示(6)影片完成后的时间轴状态，如图2.21所示。按菜单栏“文件”中“保存”保存源文件，并按“控制”中“测试影片”在源文件同一目录下导出影片。图2.21完成后的时间轴二、补间动画补间动画：是通过定义动画两端关键帧的内容，然后让Flash添加它们之间内容的动画，-欢迎下载14补间动画有两种——移动补间动画和形状补间动画。1.移动补间动画移动补间动画：在一个关键帧上放置元件，在另一个关键帧上更改这个元件的大小、位置、透明度等，flash根据两个关键帧的值来创建中间的动画被称为移动补间动画。动画效果：足球小将把足球踢出，足球形成飞速旋转移动效果。图2.22足球小将操作步骤：（1）启动FlashMX，在“属性”对话框中将帧频设置为12，大小为550x400像素。在图层1的第1帧导入一张带足球小将的图片作为动画背景。方法是：菜单栏“文件”→选择“导入→导入背景图片，如图2.23所示。-欢迎下载15图2.23导入背景图片（2）选择时间轴左下角的图标，新建图层2，在图层2的空白关键帧上绘制足球。方法是：首先用椭圆工具绘制足球外框，填充为白色。然后用线条工具在足球内画个六边形，填充为黑色。最后用线条工具向边框绘制直线，在适当位置填充黑色，如图2.24所示。图2.24绘制足球（3）把足球转换为元件，方法是：用箭头工具选中整个足球，鼠标放在足球上单击右键，选择“转换为元件”，如图2.25所示。命名为“足球”，行为为“图形”。-欢迎下载16图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设定动作补间动画-欢迎下载17图2.28动作补间在时间轴的状