Flash动画设计教程电子教案李光忠.docx

1、Flash动画设计教程电子教案李光忠第1章 Flash综述Flash是美国Macromedia公司出品的一款集动画设计、游戏、Web网站开发等功能于一身的优秀软件。Flash开拓了多媒体制作与网页设计的新领域，给用户更多的想象空间和技术支持，用户可以结合个人的创意制作出有声有色的动画作品、交互游戏及互动性网站作品。1.1 Flash的发展Flash最初的设计者是乔纳森盖伊（Jonathan Gay）。乔纳森盖伊是一位相当有天分的程序员，在高中时代他就设计出了同步声音和平滑图像的游戏空降兵，之后又设计出了另一款游戏黑暗城堡。在这些游戏的开发过程中，他积累了丰富的声音和图像处理经验，这为他日后设计

2、Flash软件打下了坚实的基础。1993年乔纳森盖伊成立了Future Wave软件公司，致力于图像方面的研究工作。本书以Flash 8简体中文版为工作环境，系统地讲解Flash软件知识，重点讲解Flash动画的制作技巧和方法，让您尽情体验Flash 8的精彩。1.2 Flash动画特点Flash动画是一种交互式的矢量动画，能够在低文件数据传输率下实现高质量的动画效果。除此之外，相对于其他动画而言，Flash动画还具有以下显著特点：（1）矢量图形：通过Flash 8提供的绘图工具箱，可以方便地绘制任意形状的线条、色块和文字，可以方便地实现矢量线条向矢量色块的转换，对矢量色块的加粗、柔化等，同时

3、还可以任意调整图形或色块的颜色。（2）交互式动画：一般的动画制作软件只能制作标准的顺序动画，如3ds max等，此类动画只能连续播放，而Flash 8借助 ActionScript的强大功能，不仅可以制作出各种精彩的顺序动画，还可以制作出复杂的交互式动画，以便用户对动画进行控制。交互式动画是Flash的一个重要特点，它有效地扩展了动画的应用领域。（3）流式播放技术：Flash动画采用流式播放形式，用户在观看动画时，可以不用等到动画文件全部下载完毕即可开始观看。这样就实现了动画的快速显示，减少了用户的等待时间。（4）高质量的图像：矢量图可以真正无限放大，能够始终显示全部图像，并且不会因为放大而降

4、低图像的显示质量。对于一般的位图，放大到一定倍数时，就会看到图像边缘的一个个锯齿状的色块。（5）多种多样的文件格式：在Flash 8中可以导入多种类型的文件格式，如图形、图像、声音和视频文件等，这使动画能够灵活地适应各个领域的需要。（6）文件的数据量小：网络速度即网络数据的传输速度，它是网页文件的一种重要限制，是网络中最重要的一项指标。所以，如何将内容丰富的网页在网络上快速传输，即减少网络文件的数据量一直是人们关注的问题。Flash以它较小的数据量占据了网络领域的一席之地。因为Flash是基于矢量图的，它只需少量的矢量数据就可以描述一个相当复杂的对象，与位图相比，数据量大大降低，只有几千分之一

5、。这样，Flash就有效地解决了多媒体与大数据量的矛盾，成为网络上非常流行的软件。（7）插件工作方式：虽然必须安装Adobe Flash Player 插件后才能使用浏览器播放Flash动画，但是相对于其他动画的播放方式来说已经相当简单了。此插件是一个免费的共享软件，在许多网站上都可以找到。如果没有此插件，可以从Adobe公司的网站（Flash也并不是十全十美，比如它不直接支持3D。随着用户的制作水准越来越高，对影片的质量要求也越来越高，有时会希望做一些3D 的物件来增强视觉效果，而这是 Flash 的弱项，必须通过第三方的工具来建立3D模型，然后再由Flash来引入。1.3 Flash 8的

6、工作环境安装了Flash 8简体中版软件后，在Windows系统的“开始”|“程序”菜单中就会出现一个Macromedia程序组，单击其中的Macromedia Flash 8就会启动Flash 8软件，进入Flash 8的工作环境。1.3.1 Flash 8工作环境简介1开始页图1-1 Flash 8开始页2工作窗口图1-2 Flash 8的工作窗口Flash 8的工作窗口由标题栏、菜单栏、主工具栏、文档选项卡、编辑栏、时间轴、编辑区和舞台、工具箱以及各种面板组成。 1.3.2 主工具栏在Flash 8中，可以通过执行“窗口”|“工具栏”|“主工具栏”命令，将主工具栏显示或关闭。如果主工具栏

7、的位置影响到操作，则可以通过拖动的方法将其移动到屏幕的其他位置，也可以将其浮动于界面之上，如图1-3所示。图1-3 主工具栏1.3.3 工具箱Flash 8的工具箱如图1-4所示。使用工具箱中的工具，可以绘制、涂色、选择和修改图形，并可以更改舞台的视图，它分为4个区域： 工具区域：包含绘画、涂色和选择工具。选中其中的某个工具按钮，就激活了相应的操作功能。 查看区域：包含“手形工具”按钮和“缩放工具”按钮，都是用来查看对象的。 颜色区域：包含“笔触颜色”按钮和“填充颜色”按钮，用于修改线条颜色和区域的填充颜色。 选项区域：显示选定工具的各种属性选项，这些属性选项会影响工具的涂色或编辑操作。图 1

8、-4 Flash 8的工具箱1.3.4 舞台舞台是放置动画内容的矩形区域，这些动画内容包括矢量插图、文本框、按钮、导入的位图图形或视频剪辑，诸如此类。图1-6 舞台1.3.5 面板1面板的基本操作2“帮助”面板“帮助”面板对Flash的所有创作功能和ActionScript语言进行了详尽的说明。可以随时按F1功能键将“帮助”面板打开，如图1-8所示。利用该面板，可以对软件的使用或动作脚本语言进行查询。图1-8 “帮助”面板3“时间轴”面板 “时间轴”面板如图1-9所示，它是用来管理不同场景中的图层和处理帧的。图1-9 “时间轴“面板4“属性”面板“属性”面板位于编辑区的下方，它会随选择对象的不

9、同而不同。当对Flash文档进行编辑时，“属性”面板中出现有关文档的属性，如图1-10所示。图1-10 文档属性面板5“动作”面板“动作”面板可以创建和编辑对象或帧的ActionScript代码，主要由动作工具箱、脚本导航器和脚本窗格组成，如图1-11所示。关于此面板的详细应用，会在后面的章节中具体讲解。图1-11 “动作”面板6“滤镜”面板Flash 8新增了滤镜功能，从而大大增强了其设计方面的能力。这项新特性对Flash动画的制作产生了巨大影响。它几乎颠覆了长期以来“Flash设计能力欠缺”的固有偏见，使人不得不对其刮目相看。默认情况下，“滤镜”面板和“属性”面板、“参数”面板组成一个面板

10、组，如图1-12所示。图1-12 “滤镜”面板7“对齐”面板“对齐”面板如图1-13所示。使用“对齐”面板，可以对编辑区中多个对象进行排列、分布、匹配大小、调整间隔等操作，使布局整齐美观。图1-13 “对齐”面板8“信息”面板利用“信息”面板（如图1-14所示）可以查看选定对象的大小、位置、颜色和鼠标指针的信息。图1-14 “信息”面板9“变形”面板“变形”面板可以对选定对象执行缩放、旋转、倾斜和创建副本的操作。图1-15 “变形”面板10“混色器”面板打开Flash 8的“混色器”面板，会发现界面比以前有了改变，如图1-16所示。图1-16 “混色器”面板11“库”面板“库”面板如图1-18

11、所示。该面板存储为了在Flash文档中使用而创建或导入的媒体资源，还可以包含已添加到文档中的组件。图1-17 自定义渐变填充图1-18 “库”面板12“行为”面板“行为”面板如图1-19所示。利用该面板，无需自己编写代码就可为动画添加交互性，如转到Web页、从库中加载声音及控制声音的播放、控制嵌入视频的回放、控制影片剪辑的播放及触发数据源等。“行为”面板的上方有一排功能按钮，它们是：图1-19 “行为”面板13“场景”面板一个动画可以由多个场景组成，“场景”面板中显示了当前动画的场景数量和播放的先后顺序。图1-20 “场景”面板14“历史记录”面板“历史记录”面板能跟踪自创建或打开某个文档以来

12、执行的步骤列表。列表中的项目数默认为100。选择“编辑”“首选参数”命令，可以在弹出的“首选参数”对话框中更改列表中显示的项数。图1-21所示标示出了该面板的组成。图1-21 “历史记录”面板1.3.6 网格、标尺和辅助线网格、标尺和辅助线是Flash中用于精确绘制和定位对象的辅助工具。可以在Flash文档中放置辅助线，然后使对象贴紧至辅助线，也可以打开网格，然后使对象贴紧至网格。图1-23 拖出的辅助线1.4 简单Flash动画的制作图1-25 实例效果图下面介绍实例制作的步骤。1新建Flash文档和设置文档属性图1-26 “新建文档”对话框图1-27 “文档属性”对话框2导入动画素材图1-

13、28 实例“库”面板4保存并测试动画5文件的导出图1-29 “导出Flash Player”对话框6文件的发布图1-30 “发布设置”对话框7文件的关闭与打开1.5 本章小结本章首先介绍Flash的发展史和Flash动画的特点，然后详细介绍了Flash 8简体中文版的工作界面以及各种面板，最后以一个简单Flash动画的制作为例，介绍了Flash动画制作的整体过程。在学完本章之后，读者应该熟悉Flash 8的工作环境，掌握制作Flash动画的一般操作步骤。第2章 静态图像制作Flash提供了很多实用的矢量绘图工具。这些工具功能强大而且使用简单，对于初学者来说，不需要太多的绘图专业技能就能绘制出很

14、漂亮的静态图像。通过线条、颜色的设置，一幅幅精美的图像跃然纸上。本章通过几个实例引导大家学会手工绘图。2.1 简单制作2.1.1 眼球的制作 图2-8 最终效果图2.1.2 放大镜的制作 图2-12 最终效果图2.1.3 齿轮的制作图2-13 最终效果图2.1.5 制作精美的珠链图2-28 最终效果图2.2 复杂画图 图2-36 最终效果图2.3 本章小结本章通过几个手工绘图实例讲述了Flash工具箱中各种绘图工具的使用方法和技巧，以及各种面板（“属性”面板、“混色器”面板和“变形”面板）在绘图中的应用。利用这些绘图方法和技巧，可以画出生动活泼、颜色鲜明的图形图像。第3章 动画制作Flash最

15、主要的功能就是制作动画，它具有强大的动画制作功能和卓越的视听表现力。Flash动画分为两大类：逐帧动画和补间动画。在逐帧动画中，需要为每一帧创建图像；而在补间动画中，只需在动画的起始和结束处建立关键帧，制作关键帧中的图像，两个关键帧中间的过渡帧中的内容均由Flash系统自动生成。补间动画是一种很有效的动画创建方式。3.1 动画原理动画是通过人眼视觉暂留原理，快速地播放连续、具有细微差别的静止图像内容，让原本固定不动的图像变得生动起来。人眼所看到的影像大约可以在脑海中暂存1/16秒，如果在暂存的影像消失之前，观看另一张连续动作的影像，便能产生活动画面的幻觉。实验证明，如果动画的画面刷新率为24帧/秒左右，即每秒放映24幅画面，则人眼看到的就是连续的画面效果。3.2 时间轴、帧和图层3.2.1 时间轴图3-1 “时间轴”面板3.2.2 帧的基本概念和操作1关键帧 关键帧是定义动画变化的帧。2普通帧 普通帧显示为一个个的小方格。3帧标签和帧注释帧标签用于标识时间轴中的关键帧，用红三角加标识名表示。4帧的操作（1）改变帧的播放频率。（2）选择帧。图3-2 选择帧（3