第4讲基础动画

第4讲基础动画本章主要内容：4.1帧的概念以及帧操作4.2逐帧动画4.3元件与实例4.4补间动画4.5补间形状帧、时间轴和图层在Flash中，帧和图层是用以编排动画的基本组成元素。帧相当于电影中的胶片，是Flash动画的基本单位，Flash作品（影片）是由许多静态画面构成的，每一幅静态的画面就是一个单独的帧。按顺序播放这些连续画面时，这些画面就会动起来。时间轴通过帧在横向上组织和管理影片的内容。当影片顺序播放时，帧在时间轴上排列的顺序就是帧中的内容在舞台上出现的顺序。图层可以有效地组织场景比较复杂的动画，其中，使用引导层或遮罩层还可以制作特殊动画效果。

4.1帧4.1.1帧的基本概念4.1.2帧操作4.1.1帧的基本概念

帧是Flash动画的最基本组成部分，Flash动画正是由不同的帧组合而成的。时间轴是摆放和控制帧的地方，帧在时间轴上的排列顺序将决定动画的播放顺序。帧的基础知识帧的相关操作帧的显示状态动画和帧动画:由许多的画面按照一定的时间顺序进行播放。每一帧就相当于一个画片。动画的类型：逐帧动画、补间动画（形状动画、运动动画）派生动画：路径动画、遮罩动画（由补间动画衍生而来）基本动画类型逐帧动画：即分别为每帧创建单独的图像。那么也就是说每帧都是关键帧。优点是可控制性强、简单，但很花时间。形状补间动画：也称形变动画，即形状变化的动画，如从圆变为方，F变到S等。它的特点是变化的物体必须分离（即打散）。动作补间动画：对某个单独内容所做的动画。如淡入淡出、移动、旋转、沿路径运动等。它的特点是运动的物体必须是组合的。Flash中帧的类型帧和关键帧帧：一帧就是动画中静止的一格。关键帧：用于定义动画变化或包含帧动作的帧。FLASH的任何动画，总是开始于一个关键帧，也总是结束于一个关键帧。我们能够操作的也是关键帧。4.1.1帧的基本概念

1．关键帧：实关键帧-有图像的关键帧

空白关键帧-无图像的关键帧2．普通帧3．播放头用于指示当前显示在舞台中的帧。关键帧普通帧播放头空白关键帧4．帧名称和帧注释帧名称用于标识时间轴中的关键帧;帧注释用于制作者为自己或他人提供相关提示（只有关键帧才可以加注）。4.1.1帧的基本概念

帧在时间轴上具有多种表现形式，根据创建动画的不同，帧会呈现出不同的状态甚至是不同的颜色。帧的类型4.1.2帧操作

1．选择帧在同时选择连续的多个帧时，还可以先单击起点帧，按住Shift键再单击需要选取的连续帧的最后一帧。另外，按住Ctrl键单击时间轴上的帧，可以选取多个不连续的帧。

2．翻转帧：是指将整个动画从后往前播放，即原来的第一帧变成最后一帧，原来的最后一帧变成第一帧。4.1.2帧操作

3．移动播放头4．添加帧创建关键帧和普通帧是在动画制作过程中频繁进行的操作，因此一般使用快捷键进行操作。插入普通帧的快捷键是F5键，插入关键帧的快捷键是F6键，插入空白关键帧的快捷键是F7键。

5．移动和复制帧6．删除帧帧和关键帧的基本操作对帧进行操作时，必须先选中相应的帧。我们将选中的帧称为“当前帧”。一般情况下左键点击只能选中一个帧，如果需要选中多个帧，则需要点按并拖动鼠标。如果你删除了某个普通帧里面的内容，那么实际上被删除的是它前面的关键帧里面的内容。帧和关键帧的基本操作在时间轴上：“F5”插入帧，“F6”插入关键帧，“F7”插入空白关键帧。如果要清除某帧的所有内容，可以选中该帧，再按delete键。如果要删除帧，则需通过右键菜单。通过右键菜单，可以实现帧的大部分操作。常用的包括插入、删除、复制、粘贴、翻转等。4.2Flash的动画类型之逐帧动画4.2.1逐帧动画的制作方法4.2.2绘图纸功能4.2.3上机指导――人物行走动画动画类型：（1）逐帧动画（每一帧的内容都需确定）（2）渐变动画（只需确定开始帧和结束帧的内容）运动渐变动画变形渐变动画（3）引导路径动画（4）遮罩动画（5）时间轴特效动画逐帧动画是最传统的动画方式，它是通过细微差别的连续帧画面，来完成动画作品。相当于在一本书的连续若干页的页脚都画上图形，快速的翻动书页，就会出现连续的动画一样。实例“火柴小人”制作：逐帧动画的制作方法包括两个要点，一是添加若干个连续的关键帧；二是在关键帧中创建不同的、但有一定关联的画面。观看动画控制|播放控制|测试影片Ctrl+Enter4.2.2绘图纸功能

绘图纸是一个帮助定位和编辑动画的辅助功能，这个功能对制作逐帧动画特别有用。通常情况下，Flash在舞台中一次只能显示动画序列的单个帧。使用绘图纸功能后，就可以在舞台中一次查看两个或多个帧了。“绘图纸外观”按钮“绘图纸外观轮廓”按钮“编辑多个帧”按钮“修改绘图纸标记”按钮绘图纸就像洋葱皮那样是一层套一层的显示方式，在编辑动画时能够一次性看到多个帧的画面。要注意的是绘图纸功能不能使用在已经被锁定的图层上，若要在该图层使用绘图纸功能，应该首先解除对图层的锁定。

4.2.3上机指导——人物行走动画

1．导入12张人物行走动作图像到“库”。2．将“走路1.jpg”拖放到舞台中央。3．用交换位图的方法将各帧上的卡通人物图像更换为需要的人物行走动作图像。

实例讲解4．每个关键帧后面插入4个普通帧。范例效果1、动画实例—流动的方块1（1）什么叫逐帧动画呢？故名思意，逐是逐个，帧是关键帧，所谓的逐帧指的就是每一帧都是关键帧，对于有的动画我们需要一个一个关键帧去制作中间不需要插入过渡帧。从而形成一种特殊效果。（2）滴管工具：为了使多个物体填充颜色或边框色相同，可以使用滴管工具来进行吸取，吸取的时候可以吸取填充色也可以吸取边框色。按住shift键：表示同时吸取填充色和边框色。1、动画实例—流动的方块2（1）工具箱中每个工具都有相对应的快捷键，将鼠标放上去停留一会就可以看见。（2）翻转帧：将所选择的动画反向播放2、动画实例—马奔跑（1）对于一些序列图片（根据名称判断），当导入到舞台后将按照名称顺序自动创建关键帧，从而行成动画效果。（2）默认情况下，我们所编辑的图片指的是当前帧的图片，所谓当前帧指的就是磁头停留的帧。（3）编辑多个帧：可以同时对多个帧进行编辑，这里的帧既包括关键帧，又包括过渡帧等。3、动画实例--打字效果（1）显示标尺：ctrl+shift+alt+R（2）选择多个帧按F6可以快速插入关键帧。（3）在制作逐帧动画时，由于不需要创建补间（即过渡帧），所以对象的类型可以为任意类型。（包括：散件、元件、文字、组合的对象等。）4、动画实例--倒计时4.3元件和实例

4.3.1认识元件和实例

4.3.2元件的类型和创建元件的方法使用元件、实例和库元件是Flash中一个非常重要的概念，在动画制作过程中，经常需要重复使用一些特定的动画元素，用户可以将这些元素转换为元件，就可以在动画中多次调用。实例是指在舞台上或者嵌套在另一个元件内部的元件副本，用户可以修改它的颜色、大小和功能而不会影响元件本身，重复使用实例不会增加动画文件的大小，这是使动画文件保持较小体积的一个很好的方法。每一个实例都有区别于其他实例的属性，这可以通过修改该实例属性面板的相关属性来实现。【库】面板是放置和组织元件的地方，在编辑Flash文档时，常常需要在【库】面板中调用元件。库：ctrl+l是用来存放元件、声音、视频、图片等元素的地方，在库中的对象可以反复调用，实现资源共享。4.3.1元件

元件又称为符号或图符，是可以重复使用的图像、按钮或电影剪辑，放在“库”中。元件特点：修改元件，所有因它而产生的实例都会被更新。运动渐变动画必须使用元件产生的实例。4.3.1元件1、形状:2、元件：【修改】|【转换为元件】。可以把“库”比喻为元件的后台“演员休息室”。“休息室”中的演员随时可进入“舞台”演出，无论该演员出场多少次甚至在“舞台”中扮演不同角色，动画发布时，其播放文件仅占有“一名演员”的空间，节省了大量资源。

实例元件从“库”中进入“舞台”就被称为该元件的实例。实例：1、从【库】面板中把“元件1”向舞台拖放。2、分别把各个实例的颜色、方向、大小设置成不同样式。3、分别选择4个实例，观看它们的【属性】面板。实例实例的属性面板-亮度的变化亮度100%，变成白色，而不是透明，-100%为黑色，0保持原色实例实例的属性面板--色调的变化实例实例的属性面板-Alpha的变化不透明度100%，就是不透明，0%完全透明不是变成白色实例实例的属性面板-高级效果元件和实例的关系：元件需要通过实例来表现实例依赖于元件而存在。4.3.2

元件的类型和创建元件的方法

1元件的类型

2元件的创建方法

3编辑元件

1元件的类型

元件存放在Flash影片文件的【库】面板中，【库】面板具备强大的元件管理功能，在制作动画时，可以随时调用【库】面板中的元件。依照功能和类型的不同，元件可分成以下3种。1．影片剪辑元件影片剪辑元件是一个独立的动画片段，具备自己独立的时间轴。它可以包含交互控制、音效，甚至能包含其它的影片剪辑实例。2．按钮元件按钮元件是对鼠标事件（如单击和滑过）做出响应的交互按钮。3．图形元件图形元件通常用于存放静态的图像，也能用来创建动画，在动画中可以包含其它元件实例，但不能添加交互控制和声音效果。2元件的创建方法

元件的创建方法一般有两种，一种方法是新建元件，另一种方法是将舞台上的对象转换为元件。1．新建元件2．转换为元件在使用【转换为元件】对话框将对象转换为元件时，可指定对象在元件场景中的位置，这个位置以元件中心点为基准。

3编辑元件

编辑元件时，Flash会更新文档中该元件的所有实例。Flash提供了3种方式来编辑元件：在当前位置编辑元件、在新窗口中编辑元件和在元件编辑模式下编辑元件。1．在当前位置编辑元件2．在新窗口编辑元件3．在元件编辑模式下编辑元件通过具体操作进一步加深理解。3编辑元件动画的制作中使用最多的动画效果是由渐变动画进行创建的。制作渐变动画时，只需要建立动画片断的第一个关键帧的画面和最后一个关键帧的画面即可，当在两个关键帧间创建动作后Flash会自动生成动画的中间效果。

优点：制作简单、动画效果连贯，且生成的作品文件容量很小。

渐变动画分为形状补间动画和动作补间动画。渐变动画形状补间动画：也称形变动画，即形状变化的动画，如从圆变为方，F变到S等。它的特点是变化的物体必须分离（即打散）。动作补间动画：对某个单独内容所做的动画。如淡入淡出、移动、旋转、沿路径运动等。它的特点是运动的物体必须是组合的。渐变动画逐帧动画动画补间形状补间（淡紫色）（淡绿色）4.4运动渐变动画的制作动画对象必须是元件、群组对象或文本矢量图形需要转换为元件可以改变动画对象的位置、大小、旋转角度等，也可以使对象沿着路径进行运动。动作补间动画需要制作两个关键帧，然后在这两个关键帧之间创建动画。

提示：动作补间通常用于有位置变化的补间动画中。4.4运动渐变动画的制作实例演示打开的字画、在字画上写字风吹文字文字旋转4.4.1运动补间动画的制作方法补间动画基本制作方法：在一个关键帧上创建一个对象，然后在另一个关键帧改变这个对象的大小、位置、颜色、透明度、旋转、倾斜、滤镜等属性。1、使用文本工具输入飞机符号。实例“飞机飞行”动画制作：2、在第35帧上插入一个关键帧，并改变飞机位置。3、创造补间动画。4.4.1运动补间动画的制作方法制作步骤：插入开始关键帧创建动画对象并编辑起始帧内容插入结束关键帧并编辑内容在起始帧处右击，创建补间动画选中起始帧，在属性面板中设置效果4.4.1运动补间动画的制作方法帧的属性面板补间：运动渐变动画应选择动画；形状渐变动画应选择形状。缩放：如果对象大小发生变化，需选择“缩放”。旋转：设置旋转方向和旋转次数。调整到路径：使对象的基线与路径保持一致4.4.1运动补间动画的制作方法帧的属性面板缓动-默认匀速-100~100-100先慢后快0匀速100先快后慢旋转：顺时针：次数越多，速度越快逆时针缓动：自定义缓入/缓出位置、旋转、缩放、颜色、滤镜动画实例--文字旋转（1）要想修改元件的属性，必须要选中想对应的元件。（2）按住alt键加鼠标拖动可以复制选择的动画。

上机指导――网络广告补间动画是Flash动画类型中最基础的一种动画类型，它是很多动画作品的基石，用途十分广泛。下面利用补间动画制作一个网络广告动画范例。这个动画主要使用的就是补间动画技术，它由若干个补间动画效果连接和叠加而成。1．新建文档和制作动画背景2．制作气球3．制作动画中的其他“演员”4．制作第一段动画5．制作第二段动画实例讲解4.5形状渐变动画的制作所谓形变动画指的是形状发生改变的动画。形状渐变动画中只能使用矢量图形（网状），如果要用其他对象设置变形渐变动画，必须先将它们转化为矢量图形（修改|分离）。建议在同一个图层中使用一个矢量图形，如果有多个矢量图形，要将其分别放置在不同的图层中，否则，变化过程不易控制。形变、缩放、旋转、颜色、运动。4.5形状渐变动画的制作实例演示方变圆苹果红了圆变文字灯笼变文字4.5形状渐变动画的制作制作步骤：插入开始关键帧创建动画对象插入结束关键帧并编辑选中起始帧，在属性面板中选择形状补间补间形状的基本制作方法是，在一个关键帧上绘制一个形状，然后在另一个关键帧更改该形状或绘制另一个形状。接着在这两个关键帧之间定义补间形状，Flash就会自动补上中间的形状渐变过程。4.5.1形状渐变动画的制作实例五边形变成五角星的动画制作：1、绘制一个无边框红色填充的五边形。2、在第20帧绘制一个无边框红色填充的五角星。3、定义补间形状。4、将第20帧上的五角星的填充颜色更改为黄色。4.5.2补间形状的参数设置定义了补间形状后，在“属性”面板中可以进一步设置相应的参数，以使得动画效果更丰富。1．“缓动”选项(范围：-100~100）