第13章 动画基础 网页设计案例教程ppt.ppt

网页制作案例教程制作：张兴科北京大学出版社PEKING UNIVERSITY PRESS 第13章 动画基础 本章内容在网站设计中的地位 本章主要讲述如何制作动画。Flash动画的最终效果是通过将动画设计元素进行合适的空间和时间安排来实现的。设计元素的空间安排在图层上进行，而图层上元素的出场顺序和动态变化，则是通过时间轴上的帧来实现的。只有将设计对象进行动态创意实现，才能将网页中的某些内容产生动感效果。 本章要点 动画的分类和实现方法； 库的使用； 元件和实例。 教学目标 通过本章的案例学习，要求用户掌握使用Flash CS3创作简单动画的方法； 掌握Flash CS3动画的分类和实现手段； 理解库、元件和实例的概念与用法。 补间动画的创建 Flash动画分为逐帧动画和补间动画两大类，而补间动画又分为运动补间动画和形状补间动画两类，它们具有各自的特点。 时间轴 时间轴是用来设定舞台中的动画元素出场的时间和时长，组织和控制动画内容在一定的时间内播放的帧数。 帧 由于人的眼睛具有“视觉暂留”的特性，所以当人的眼睛看到一幅图像后，图像会在短时间内停留在人眼的视网膜上。将具有一种连续变化的一系列静止图像按照一定的速度播放，人们就会感觉这些图像是“动”的。在利用Flash制作动画时，采用的就是这个原理，而那些连续变化的单一静止图像，称为“帧”。 在制作Flash动画的过程中，帧的多少和单位时间内播放的帧数(帧频率)与动画的播放时间有关。Flash默认的帧频率是12fps(Frames Per Second)，即每秒显示12帧画面，用户可以通过“文档属性”对话框修改帧频率的值。 帧的基本类型 Flash动画中用到的帧具有不同的类型，它们被分为3种基本类型：普通帧、关键帧和空白关键帧，不同的帧在动画中所起的作用不同 。 (1) 普通帧：在关键帧后面的灰色方格区域就是普通帧，其中的内容与它前面的关键帧的内容完全相同。连续普通帧的某一帧中的内容如果被修改时，其他帧的内容同时被更新，并且连续普通帧的最后一帧中有一个空心矩形块。根据普通帧的这一特性，通常利用它来存放静止不变的动画元素，如背景图片和静态文字等。在动画中增加一些普通帧，可以适当延长动画的播放时间。 (2) 关键帧：非常重要的帧，它是用来描述动画中关键画面的帧，它定义了动画的变化环节，具有对相邻左侧帧内容的继承性，凡是包含内容的关键帧会显示黑色实心圆点。不必要的关键帧可以增大文档的大小，补间动画的制作就是通过关键帧内插的方法实现的。 (3) 空白关键帧：还没有包含内容的关键帧，它显示为空心圆点。如果需要让新的关键帧不再继承相邻左侧帧的内容，可以插入空白关键帧。在任何一个新建的Flash文档中，都有一个空白关键帧。 运动补间动画 所谓补间动画又叫做中间帧动画、渐变动画。只要建立起始点和结束点的画面，中间部分的画面内容由软件自动生成，省去了中间动画制作的复杂过程 。 补间动画分为运动补间动画和形状补间动画两种。 运动补间动画主要完成对象的位移、缩放、旋转、颜色以及元件的透明度的过渡等形式的动画效果，合理利用这些功能，可以创建各种渐变的Flash作品。 (1) 运动补间动画在时间轴上的表现形式。运动补间动画在时间轴上的表现形式：起始关键帧和结束关键帧用黑色实心圆点表示，中间补间帧为浅蓝色背景并被一条箭头线贯穿 。 (2) 运动补间动画的设置方法。首先在时间轴上设定好运动补间动画的起始关键帧和结束关键帧，然后选中结束关键帧之前的任何一帧，在“属性”面板中“补间”项选择“动画”，或者用鼠标右键单击结束关键帧之前的任何一帧，在弹出的快捷菜单中选择“创建补间动画”命令。 (3) 运动补间动画的删除方法。在时间轴上选中已经设置好补间动画区域结束关键帧之前的任何一帧，在“属性”面板中“补间”项选择“无”，或者用鼠标右键单击结束关键帧之前的任何一帧，在弹出的快捷菜单中选择“删除补间”命令。 (4) 动画的加速与减速运动。对于补间动画来说，动画变化的默认状态是匀速的，若想使对象产生先快后慢或先慢后快的运动效果，可以通过“属性”面板的“缓动”项设置 。 (5) 自定义缓入/缓出。在Flash的运动补间动画设计中，除了通过“缓动”项来设计动画元素的加速/减速运动外，还可以根据创作的需要，自己定义渐进/渐出规律。 形状补间动画 形状补间是Flash的另一种动画补间形式，它的原理是使一个形状对象变形为另一个形状对象。 形状补间动画与运动补间动画不同，在形状补间动画中的对象不能是元件，而只能是矢量图形。在创建这种动画时，Flash会根据开始关键帧和结束关键帧上操作对象的形状、颜色、位置等，创作出形状变化的补间帧对象，以形成变化自然的动画变化过程 。 (1) 形状补间动画在时间轴