网页设计与制作应用教程 第2版 教学课件 ppt 作者 王任华 第14章

网页设计与制作应用教程（第2版）,机械工业出版社同名教材 配套电子课件,主要内容,第一部分 网页设计与制作基础 第二部分 Adobe Dreamweaver CS5 网页制作 第三部分 Adobe Fireworks CS5 网页图片处理 第四部分Adobe Flash CS5 网页动画制作,2,第14章 动画制作,14.1 动画元件与实例 14.2 状态的应用 14.3 创建螺旋式渐隐动画 14.4 导出动画 14.5 边学边做,3,14.1 动画元件与实例,元件就是库中存放的一些对象,4,14.1 动画元件与实例,实例就是元件在文档中的具体引用,5,14.1.1 创建元件,新建动画元件 执行主菜单【编辑】/【插入】/【新建元件】命令,6,14.1.1 创建元件,新建动画元件 文档窗口切换到“元件”编辑窗口，使用绘图或文本工具创建一个对象,7,14.1.1 创建元件,将对象转换为元件 选择需要转换为元件的对象。 执行菜单【修改】/【动画】/【选择动画】命令，将对象转换为元件,8,14.1.2 编辑动画元件,对创建成的元件，可以随时进行编辑修改，即更改各种元件属性，如动画不透明度和旋转； 也可以编辑元件的动画，使元件显示为旋转、加速、淡入淡出或者是这些属性的任意组合等。,9,14.1.2 编辑动画元件,编辑元件 双击某个实例，即可切换到元件编辑窗口，或在库中直接双击元件名称左侧的图标。或者执行菜单【修改】/【元件】/【编辑元件】命令。 编辑动画元件的属性,10,14.1.3 元件的导入和导出,1. 通过“文档库”面板导入元件 执行菜单【窗口】/【文档库】命令，打开“文档库”面板，单击面板右上角的“选项”菜单图标，在菜单中选择“导入元件”命令,11,14.1.3 元件的导入和导出,2. 通过“文档库”导出元件 从 “文档库”面板的“选项”菜单中选择“导出元件”命令。Fireworks 将这些元件保存在单个PNG文件中。 3. 通过操作实例导入/导出元件 将元件实例从包含该元件的文档拖到目标文档中。 或者在包含该元件的文档中复制一个元件实例，然后将其粘贴到目标文档中。 该元件被导入到目标文档的“文档库”面板中，同时保留与原始文档中的元件的关系。,12,14.2 状态的应用,页面包含状态，状态包含层。一个新页面仅包含一个状态。,13,14.2 状态的应用,14.2.1 状态和层 页面包含状态，状态包含层。一个新页面仅包含一个状态。早期版本中，状态被称为帧,14,14.2.1 状态和层,动画实际上是由状态组成的，要编辑复杂的动画效果，就需要编辑动画的状态。,15,14.2.2 状态的基本操作,1. 添加、移动、复制和删除状态,16,14.2.2 状态的基本操作,2. 设定状态延时数 3. 显示/隐藏状态 4. 重命名状态,17,14.2.3 在状态中编辑对象,1. 在“状态”面板中移动对象 2. 在状态间共享层 3. 洋葱皮 4. 动画播放,18,14.3 创建螺旋式渐隐动画,可以使用“螺旋式渐隐”命令创建螺旋式渐隐动画，实现画布中一个对象沿着一个扭转的路径淡入和淡出效果。,19,14.4 导出动画,当设置并设计完组成动画的元件和状态后，就可以将文件导出为动画了。在导出文件之前，需要输入一些设置使动画的载入更容易、播放更流畅。可以设置播放设置（如循环和透明度），然后使用优化处理使导出文件更小和更容易下载。,20,14.4 导出动画,执行主菜单【文件】/【导出向导】命令,21,14.4 导出动画,22,14.5 边学边做（制作网页标题动画）,例14_1 本节通过实例的介绍，读者可以详细体会使用Fireworks 完成动画制作的基本过程。本例主要应用包括：文本工具、状态基本操作和元件制作等。,观看动画,23,