二维动画设计(初稿11.12)

二维动画设计——Flash案例教程

主编：郭晓俐

二维动画设计–––Flash案例教程

内容介绍

本书通过案例教学方式全面介绍Flash动画设计的基本方法和技巧。全书包括动画入门、基础案例、综合案例、课程设计四章内容，14个基础案例中包括绘图工具、文字工具、元件、库、滤镜、逐帧动画、补间动作动画、补间形状动画、ActionScript3.0脚本语言和组件的基础知识及使用方法。12个综合案例涵盖了Flash目前流行的网站、动漫、游戏、课件等典型的应用领域。每个案例按照任务布置——知识讲授——案例设计制作——技能拓展——案例小节的流程，以应用为中心，详细讲解Flash动画设计制作原理、技能，介绍各类作品设计特点和制作思路，培养设计制作二维动画作品的能力。课程设计中通过10类选题，指导学生进行Flash项目制作，进一步巩固提高动画制作技能，培养创新能力和团队协作意识。

本书结构编排合理，图文并茂，精选案例，主要针对应用型本科学生编写，适用于相关专业动画制作类课程教材，亦可作为高职高专动画专业教材。

二维动画设计–––Flash案例教程

前言

1.本书内容介绍

本书采用案例教学法，以任务驱动、启发、引导模式，传授Flash动画制作知识、方法，提高学生实践能力和创新能力。全书共分四个部分，概括如下：

第一章：介绍动画原理、分类、发展历史；帮助学习者掌握Flash动画的特点及应用领域。介绍了Flash的软件环境，通过案例学习掌握文件创建、属性设置、保存和发布等知识点。

第二章：通过14个基础案例，融入Flash中基本绘图工具、元件、库、场景基本动画、、ActionScript脚本编程、组件等知识点，由浅入深系统地讲解动画制作的基本方法与技巧。

第三章：通过12个综合案例，全面介绍Flash在动画短片、宣传广告、游戏设计、课件、网站等方面的应用。

第四章：提供10个课程设计项目选题，并给予必要的设计思路指导、启发，提供必要的素材和技术支持，重在开拓学生思路，培养动画创新设计能力。学生可以根据自己的兴趣、爱好选择适当的项目完成课程设计。

2.本书主要特色

本书以案例教学法的理念为主导，通过案例深入浅出地讲解知识技能，在增强学生的学习兴趣的同时，又可以让学生系统地学习Flash相关知识，符合学生从具体至抽象的认知规律。本书具有以下特色：

（1）精选案例：教材以“工学结合”为理念，精选涉及Flash的各种典型应用的项目，如动画、贺卡、广告、MV、游戏等，案例新颖性、实用性、可行性强，案例选择和设计具有明确的知识、能力训练目标，案例设计、制作过程讲解清晰、细致，并配有图例，适用于教学，可以有效缩短学生理论学习与实际应用之间的距离。

（2）案例编写：每个案例（或项目）的编写采用“任务布置－知识讲授－－案例设计制作－技能拓展—案例小节”的形式组织，采用任务驱动法深入浅出地讲解Flash基础知识和操作技能，培养学生的实践能力。每个案例具有学习指导，明确列出了案例设计要求和学习要点，为初学者提供了便利；每个案例的知识讲授、技能扩展和案例小节增加案例中知识点学习的系统化。

（3）教材表达精炼、准确、科学；教材图文并茂，提高学生的学习兴趣。教材中的活动设计以学生为本，以培养学生的职业能力和素质为目标，内容具体，并具有可操作性。

I

二维动画设计–––Flash案例教程

3.课程教学方法及要求

教学方法：

①在教学过程中，采用项目驱动式教学方法，选取企业真实项目（或学生创新项目）为载体构建学习情境，培养学生的职业素质和技能。

②用生动的案例导入项目蕴含的核心技能，激发学生的学习兴趣，造就学生的成就动机。

③在教学过程中，采用讲练合一的教学方法，教师示范和学生操作训练互动，学生提问与教师解答、指导有机结合，让学生在“教”与“学”过程中，掌握平面动画制作的知识和技能。

④在教学过程中，可采用启发式教学法来培养学生的分析问题和解决问题的能力。

⑤在教学过程中，可以采用分组式教学法，锻炼学生的协作能力，培养学生的团队意识。

⑥建议课堂教学全部在机房进行，每个单元4节课，前两节课以教师讲解为主，主要剖析案例内容，主要知识点和技能讲解，后两节课以学生小组练习为主，主要是案例基本内容和扩展内容。

对学生的要求：

（1）上课仔细听教师讲解案例的制作原理、方法；

（2）当堂完成案例的制作；

（3）利用课后时间完成案例的扩展部分内容，并通过e-mail或FTP等渠道提交完整案例作为平时作业；

（4）课程结束时完成本课程的课程设计大作业，提交大作业的制作说明、源文件，采用现场答辩的形式，现场打分，给出课程考核成绩。

教学评价建议：

①改革传统的学生评价手段和方法，采用阶段评价、目标评价、项目评价、理论与实践一体化评价模式。

②关注评价的多元性，结合考勤、课堂提问、课堂讨论、平时作业、课程设计（大作业），综合评价学生成绩。

③应注重学生职业素质、岗位技能和专业知识的综合性评价，着重培养学生的综合素质，并且评价体系应全面、可控、可行。

④应注重学生创新能力的培养，对具有独特创意的学生应予以特别鼓励。

II

目录

第一章Flash动画入门 (3)

1.1 动画入门 (3)

1.1.1 动画原理 (3)

1.1.2 动画分类 (3)

1.1.3 动画发展的历史 (4)

1.1.4 动画运动规律 (5)

1.2 Flash动画的特点与应用 (7)

1.2.1 Flash的特点 (7)

1.2.2 Flash的应用领域 (8)

1.3 Flash工作界面 (8)

1.4 Flash CS3文件操作 (11)

1.4.1 创建文件 (11)

1.4.2 设置文件属性 (12)

1.4.3 测试影片 (13)

1.4.4 保存、发布文件 (13)

1.5 案例一：矩形到圆的变形动画——常规文件创建 (13)

1.6 案例二：幻灯片动画——通过模板创建文件 (14)

第二章Flash基础案例 (17)

2.1 绘图工具使用——庭院设计案例 (17)

2.2 修改形状命令——生命案例 (29)

2.3 文字工具使用——3D文字案例 (39)

2.4 人物图像绘制——人物造型案例 (47)

2.5 动画补间——大风车案例 (66)

2.6 形状补间——蜕变案例 (76)

2.7 逐帧动画——人走路、鸟飞行案例 (82)

2.8 遮罩层动画——画轴案例 (90)

2.9 引导层动画——过山车案例 (100)

2.10按钮元件制作——声音的产生案例 (107)

2.11 ActionScript脚本编程——动画加载案例 (115)

2.12 ActionScript编程高级应用——创建可拖动的圆案例 (127)

2.13 UI组件应用——会员注册表案例 (134)

2.14 高级组件应用——音乐日历案例 (144)

第三章Flash综合案例 (158)

3.1组合动画——小鸡出壳案例 (158)

3.2 遮罩层、引导层应用——地球转动案例 (166)

3.3 宣传短片——和谐世博，你我共创案例 (171)

3.4动画短片——龟兔赛跑案例 (179)

3.5 课件制作——摩擦力案例 (189)

I

二维动画设计–––Flash案例教程

3.6 公益广告——雨天案例 (196)

3.7 MTV——下辈子做你的女人案例 (203)

3.8 游戏设计（1）——打飞碟案例 (216)

3.9 游戏设计（2）——智能拼图案例 (222)

3.10 全Flash网站制作——个人博客案例 (233)

3.11 应用程序（1）——电子相册案例 (246)

3.12 应用程序（2）——MP3播放器案例 (264)

第四章课程设计 (276)

4.1项目一：电子杂志制作 (276)

4.2项目二：全Flash网站制作 (276)

4.3项目三：留言板制作 (276)

4.4项目四：手机广告制作 (277)

4.5项目五：电子贺卡制作 (277)

4.6项目六：游戏制作 (277)

4.7项目七：课件制作 (278)

4.8项目八：动画系列片 (278)

4.9项目九：饭店点菜应用程序 (278)

4.10项目十：商场导购应用程序 (279)

II

第一章Flash动画入门

1.1 动画入门

1.1.1 动画原理

“动画”（Animating）一词在词典中的解释是“赋予生命”的意思。大家所熟悉的“米老鼠”、“唐老鸭”等动画形象肯定已深深印在你的脑海中。动画，可以说是一种老少咸宜的信息传递方式，同时又是艺术与技术紧密结合的产物。动画有着悠久的历史，像我国民间的走马灯和皮影戏，就可以说是动画的一种古老形式。当然，真正意义的动画，是在电影摄影机出现以后才发展起来的，而现代信息科学技术的发展，又不断为它注入了新的活力，产生了数字动画。

动画是通过连续播放一系列画面，给视觉造成连续变化的图画。它的基本原理与电影、电视一样，都是视觉原理。医学已证明，人类具有“视觉暂留”的特性，物体在快速运动时，当人眼所看到的影像消失后，人眼仍能继续保留其影像0.1-0.4秒左右的图像，是人眼具有的一种性质。利用这一原理，在一幅画还没有消失前播放出下一幅画，就会给人造成一种流畅的视觉变化效果。因此，电影采用了每秒24幅画面的速度（1/24秒）拍摄播放，电视采用了每秒25幅（PAL制）(中央电视台的动画就是PAL制)或30幅（NSTC制）画面的速度拍摄播放。如果以每秒低于24幅画面的速度拍摄播放，就会出现停顿现象。

1.1.2 动画分类

（1）从制作技术和手段看，分为以手工绘制为主的传统动画和以计算机为主的电脑动画（又叫CG）。传统的动画是由画师先在画纸上手绘真人的动作，然后再复制于卡通人物之上。直至20世纪70年代后期，电脑技术发展迅速的纽约技术学院的电脑绘图实验室导师丽蓓卡亚·伦女士将录像带上的舞蹈员影像投射在电脑显示器上，然后利用电脑绘图记录影像的动作，然后描摹轮廓。1982年左右，美国麻省理工学院及纽约技术学院同时利用光学追踪技术记录人体动作：演员身体的各部份都被安上发光物体，在指定的拍摄范围内移动，同时有数部摄影机拍摄其动作，然后经电脑系统分析光点的运动，再产生立体的活动影像。

3

二维动画设计–––Flash 案例教程

4 世界电影史上花费最大、最成功的电影之一—《泰

坦尼克号》的成功很大程度上得益于它对电脑动画的

大量应用。世界著名的数字工作室Digital Domain 公

司用了一年半的时间，动用了300多台SGI 超级工作

站，并派出50多个特技师一天24小时轮流地制作《泰

坦尼克号》中的电脑特技。

（2）按动作的表现形式来区分，大致分为接近自然动作的“完善动画”（动画电视）和采用简化、夸张的“局限动画”（幻灯片动画）。

（3）从空间的视觉效果上看，又可分为二维动画（《小虎还乡》）和三维动画（《最终幻想》）；

（4）从播放效果上看，还可以分为顺序动画（连续动作）和交互式动画（反复动作）；

（5）从每秒放的幅数来讲，还有全动画（每秒24幅）（迪斯尼动画）和半动画（少于24幅）之分。

1.1.3 动画发展的历史

动画的发展历史很长，从人类有文明以来，透过各种形式图像的记录，已显示出人类潜意识中表现物体动作和时间过程的欲望。

早在1831年，法国人Joseph Antoine Plateau 把画好的图片按照顺序放在一部机器的圆盘上，圆盘可以在机器的带动下转动。这部机器还有一个观察窗，用来观看活动图片效果。在机器的带动下，圆盘低速旋转。圆盘上的图片也随着圆盘旋转。从观察窗看过去，图片似乎动了起来，形成动的画面，这就是原始动画的雏形。

1906年，美国人J Steward 制作出一部接近现代动画概念的影片，片名叫“滑稽面孔的幽默形象”（Houmoious Phase of a Funny Face ）。他经过反复地琢磨和推敲，不断修改画稿，终于完成这部接近动画的短片。

1908年法国人Emile Cohl 首创用负片制作动画影片，所谓负片，是影像与实际色彩恰好相反的胶片，如同今天的普通胶卷底片。采用负片制作动画，从概念上解决了影片载体的问题，为今后动画片的发展奠定了基础。

二维动画设计–––Flash案例教程

1909年，美国人Winsor Mccay用一万张图片表现一段动画故事，这是迄今为止世界上公认的第一部象样的动画短片。从此以后，动画片的创作和制作水平日趋成熟，人们已经开始有意识的制作表现各种内容的动画片。

1915年，美国人Eerl Hurd创造了新的动画制作工艺，他先在塑料胶片上画动画片，然后再把画在塑料胶片上的一幅幅图片拍摄成动画电影。多少年来，这种动画制作工艺一直被沿用着。

从1928年开始，世人皆知的Walt Disney逐渐把动画影片推向了颠峰。他在完善了动画体系和制作工艺的同时，把动画片的制作与商业价值联系了起来，被人们誉为商业动画之父。直到如今，他创办的迪斯尼公司还在为全世界的人们创造出丰富多彩的动画片。“迪斯尼”公司被誉为20世纪最伟大的动画公司。

1.1.4 动画运动规律

动画中的活动形象，不象其它影片那样，用胶片直接拍摄客观物体的运动，而是通过对客观物体运动的观察、分析、研究，用动画片的表现手法（主要是夸张、强调动作过程中的某些方面），一张张地画出来，放在一格格中，然后连续放映，使之在屏幕上活动起来的。因此，动画表现物体的运动规律既要以客观物体的运动规律为基础，但又有它自已的特点，而不是简单的模拟。

研究动画表现物体的运动规律，首先要弄清时间、空间、速度的概念及彼此之间的相互关系，从而掌握规律，处理好动画中动作的节奏。

（1）时间

所谓“时间”，是指影片中物体（包括生物和非生物）在完成某一动作时所需的时间长度，这一动作所占胶片的长度（片格的多少）。这一动作所需的时间长，其所占片格的数量就多；动作所需的时间短，其所占的片格数量就少。

由于动画片中的动作节奏比较快，镜头比较短（一部放映十分钟的动画片大约分切为100-200个镜头），因此在计算一个镜头或一个动作的时间（长度）时，要求更精确一些，除了以秒（呎）为单位外，往往还要以“格”为单位（1秒=24格，1呎=16格）。

（2）空间

空间所谓“空间”，可以理解为动画片中活动形象在画面上的活动范围和位置，但更主要的是指一个动作的幅度（即一个动作从开始到终止之间的距离）以及活动形象在每一张画

5

二维动画设计–––Flash案例教程

面之间的距离。动画设计人员在设计动作时，往往把动作的幅度处理得比真人动作的幅度要夸张一些，以取得更鲜明更强烈的效果。

此外，动画片中的活动形象做纵深运动时，可以与背景画面上通过透视表现出来的纵深距离不一致。例如：表现一个人从画面纵深处迎面跑来，由小到大，如果按照画面透视及背景与人物的比例，应该跑十步，那么在动画片中只要跑五、六步就可以了，特别是在地平线比较低的情况下，更是如此。

（3）速度

所谓“速度”，是指物体在运动过程中的快慢。按物理学的解释，是指路程与通过这段路程所用时间的比值。由于动画是一张张地画出来，然后一格格地拍出来的，因此必须观察、分析、研究动作过程中每一格画面（1/24秒）之间的距离（即速度）的变化，掌握它的规律，根据剧情规定、影片风格以及角色的年龄、性格、情绪等灵活运用，把它作为动画片的一种重要表现手段。

在动画中，物体运动的速度越快，所拍摄的格数就越少；物体运动的速度越慢，所拍摄的格数就越多。

在动画中，在一个动作从始至终的过程中，如果运动物体在每一张画面之间的距离完全相等，称为“平均速度”（即匀速运动）；如果运动物体在每一张画面之间的距离是由小到大，那么拍出来在荧幕上放映的效果将是由慢到快，称为“加速度”（即加速运动）；如果运动物体在每一张画面之间的距离是由大到小，那么拍出来在荧幕上放映的效果将是由快到慢，称为“减速度”（即减速运动）。

在动画中，不仅要注意较长时间运动中的速度变化，还必须研究在极短暂的时间内运动速度的变化。例如：一个猛力击拳的动作运动过程可能只有6格，时间只有1/4秒，用肉眼来观察，很难看出在这一动作过程中，速度有什么变化。但是，如果用胶片把它拍下来，通过逐格放映机放映，并用动画纸将这6格画面一张张地摹写下来，加以比较，就会发现它们之间的距离并不是相等的，往往开始时距离小，速度慢；后面的距离大，速度快。

在动画中，造成动作速度快慢的因素，除了时间和空间（即距离）之外，还有一个因素，就是两张原画之间所加中间画的数量。中间画的张数越多，速度越慢；中间画的张数越少，速度越快。即使在动作的时间长短相同，距离大小也相同的情况下，由于中间画的张数不一样，也能造成细微的快慢不同的效果。

（4）节奏

一般说来，动画的节奏比其它类型影片的节奏要快一些，动画片动作的节奏也要求比生

6

二维动画设计–––Flash案例教程

活中动作的节奏要夸张一些。

在日常生活中，一切物体的运动（包括人物的动作）都是充满节奏感的。动作的节奏如果处理不当，就象讲话时该快的地方没有快，该慢的地方反而快了；该停顿的地方没有停，不该停的地方反而停了一样，使人感到别扭。因此，处理好动作的节奏对于加强动画片的表现力是很重要的。

造成节奏感的主要因素是速度的变化，即“快速”、“慢速”以及“停顿”的交替使用，不同的速度变化会产生不同的节奏感，例如：

A．停止----慢速----快速，或快速----慢速----停止，这种渐快或渐慢的速度变化造成动作的节奏感比较柔和。

B．快速----突然停止，或快速----突然停止----快速，这种突然性的速度变化造成动作的节奏感比较强烈。

C．慢速----快速----突然停止，这种由慢渐快而又突然停止的速度变化可以造成一种“突然性”的节奏感。

1.2 Flash动画的特点与应用

1.2.1 Flash的特点

Flash是一款设计与制作动画的专业软件。Flash的前身是FutureSplash，1996年11月正式卖给Macromedia，改名为Flash1.0。经过Macromedia近十年的经营，推出十个版本，Flash已经发展为一款风靡Internet的二维动画设计与制作软件，取代了GIF等动画的地位，成为这一领域的霸主。2005年Adobe耗资34亿美元并购Macromedia，从此Flash冠上了Adobe的名头，陆续推出Adobe Flash CS3、Adobe Flash CS3版本，开始了它新的征程。

Flash具有如下特点：

（1）友好的操作界面，易学易用。Flash的操作界面美观，层次清晰，面板功能齐全，布局合理，无须任何编程基础就可轻松制作大量精美动画。

（2）输出文件格式丰富。Flash支持SWF、AVI、EXE等多种动画格式输出，适用于在线、离线观看动画，或将动画嵌入到其它程序中播放。

（3）文件体积小，易于网络传输。Flash采用使用矢量图形和流式播放技术生成动画，生成的动画文件体积小，图像不易失真，可自由缩放，自动调整图像尺寸，文件大小不改变，

7

二维动画设计–––Flash案例教程

适应与网络流式传输。

(4) 功能强大。强大的动画编辑功能使得设计者可以随心所欲地设计出高品质的动画，通过ActionScript脚本语言可以实现交互，使Flash具有更大的设计自由度。

1.2.2 Flash的应用领域

（1）网络动画。由于Flash对矢量图的应用和对声音、视频、图形图像等媒体的良好支持以及以“流媒体”的形式进行播放，生成文件小的特点使它成为网络动画制作的首选工具。

（2）交互网站。现在极少数人掌握Flash建立全网站的技术。用Flash建立全网站可以提供无缝的导向跳转，更丰富的内容，更流畅的交互，以及跨平台和小巧客户端的支持。

（3）在线游戏。Flash中的ActionScript脚本语言可以编制一些游戏程序，配以Flash 的交互功能，使用户通过网络进行在线游戏。

（4）多媒体课件。Flash强大的人机交互性和各种媒体的集成性和良好的界面表现力适合于制作多媒体课件。

（5）应用程序开发。Flash支持跨平台、界面控制以及多媒体功能，使其开发的应用程序具有很强的生命力。

1.3 Flash工作界面

本书以目前普遍使用的Flash CS3版本为例，介绍其界面。启动Flash CS3软件，进入其主界面。

8

二维动画设计–––Flash 案例教程

9

图1-3-1 Flash CS3启动界面

Flash CS3主界面包括菜单栏、时间轴、工具栏、编辑栏、各类面板组以及舞台、工作区等部分。如图1－3－1、1-3-2所示。

图1-3-2 Flash CS3工作界面

时间轴：时间轴面板是Flash 进行动画编辑的基础。分左右两个部分，左边为图层控制区，右边为时间控制区，如图1-3-3所示。时间轴上的每一个单元格称为一个“帧”,是Flash 动画最小的时间单位。每一帧可以包含不同的图形内容，当影片在连续播放时，

每帧的内容

二维动画设计–––Flash 案例教程

10 依次出现，就形成了动画影片。

图1-3-3 时间轴 编辑栏：编辑栏位于舞台的顶部，其包含的控件和信息可用于编辑场景和元件，并更改舞台的缩放比率，如图所示。通过使用编辑栏，可以方便地在场景和元件的编辑界面之间进行切换。如图1-3-4所示。

隐藏时间轴：单击该按钮可以将时间轴隐藏，从而扩展舞台。

返回上一级：单击该―箭头‖按钮可以返回到上一级的编辑界面。

图1-3-4编辑栏

工具栏：工具栏默认停靠在主操作界面的左侧，分为：工具区、查看区、颜色区和选项区。单击工具箱最顶端的

小图标，可将工具箱变成长单条和短双条结构，此时小图标会变为形状。如图1-3-5所示。

舞台/工作区/场景：用来制作动画的区域称为舞台（默认情况下为白色，可通过修改/文档属性/背景颜色进行重新设置），它提供当前角色表演的场所；工作区是舞台周围的灰色区域，是角色进入舞台时的场所，播放影片时，处于工作区的角色不会显示出来；舞台和工作区共同组成一个场景。

显示/隐藏

当前图层锁定/解锁当前图层显示当前图层轮廓

插入图层添加引导层插入图层文件夹

删除图层

绘图纸外观绘图纸外观轮廓

编辑多个帧修改绘图纸标记

元件查看

场景切换

二维动画设计–––Flash 案例教程

11 面板组：Flash CS3包括颜色、变形、对齐、组件等多种面板，分别提供不同功能。

图1-3-5 工具栏

1.4 Flash CS3文件操作

1.4.1 创建文件

Flash CS3有几种新建文件的方式：

（1）新建Flash 文件（ActionScript 3.0）：将在Flash 文档窗口创建新的文档（*.fla ），文档中如遇脚本编程，采用ActionScript 3.0版本。

（2）新建Flash 文件（ActionScript 2.0）：将在Flash 文档窗口创建新的文档（*.fla ），文档中如遇脚本编程，采用ActionScript 2.0版本。ActionScript 2.0版是Flash 8中普遍采用的脚本语言，在易用性和功能上不如ActionScript 3.0。两个版本的语言不兼容，需要不同的编辑器进行编辑，所以新建文件时根据实际需要选择哪种方式新建文件。

（3）新建Flash 文件（移动）：在Device Central 中选择目标设备并创建一个新的移动文档（.fla 文件）。此文件将在Flash 中以适于设备的适当设置和您选择的内容类型打开。

（4）ActionScript 文件：创建一个外部的ActionScript 文件（.as ）并在脚本窗口中编辑它。ActionScript 是Flash 脚本语言，用于控制影片和应用程序中的动作、运算符、对象、类以及其他元素。

（5）ActionScript 通信文件：创建一个新的外部ActionScript 通讯文件（*.asc ）

，并在脚

二维动画设计–––Flash案例教程

12

图1-4-6 文档属性对话框

本窗口中进行编辑。服务器端ActionScript用于开发高效、灵活的客户端-服务器Adobe Flash Media Server应用程序。通过建立Flash项目文件，将外部脚本链接到flash文档并提供源控制。

（6）Flash JavaScript文件：创建一个新的外部JavaScript文件（*.jsf）并在脚本窗口中编辑它。Flash JavaScript应用程序编程接口（API）是构建于Flash之中的自定义JavaScript 功能。Flash JavaScript API通过“历史记录”面板和“命令”菜单在Flash中得到了应用。

（7）Flash项目：创建一个新的Flash项目（*.flp）。使用Flash 项目文件组合相关文件（*.fla，*.as，*.jsfl及媒体文件），为这些文件建立发布设置，并实施版本控制选项。

1.4.2 设置文件属性

新建Flash文件后首先要做的就是设置文件

属性。通过执行“修改/文档“命令打开属性对

话框，设置文件尺寸、背景颜色、帧频、标尺

单位等信息。如图1-4-6所示。

（1）标题：设置文档标题。

（2）描述：可以写入文档备忘录。

（3）尺寸：设置舞台的宽度和高度。

（4）匹配：有打印机、内容、默认三项。打印机：按打印机设置调整舞台大小；内容：自动以舞台中的角色为中心调整舞台大小；默认：按Flash的默认设置调整舞台的大小。

（5）背景色：设置舞台背景颜色。

（6）帧频：可在文本框中输入数值设定动画每秒钟播放的帧数。默认值为12fps（帧/秒），可以满足大多数需求。

（7）标尺单位：可选择英寸、厘米、毫米等作为标尺的长度单位。Flash默认的长度单位为像素。

（8）设为默认值：可以将当前设置定为法拉上的默认值。新建文件会自动采用默认属性。

二维动画设计–––Flash案例教程

13 图1-4-7 文档发布设置对话框

1.4.3 测试影片

Flash动画在制作完成后，接下来就是进行播放测试。执行菜单中的“控制|测试影片”（快捷键）命令，即可测试影片。

此外也可以在播放状态下观赏动画效果，具体操作步骤为：将播放头定位在第1帧上，然后按键盘上的键，动画就会从第1帧播放到最后一帧停止播放。

如果想循环播放动画，可以执行菜单中的“控制|循环播放”命令，此时该命令会被勾选，然后在按键盘上的键即可循环播放。

1.4.4 保存、发布文件

（1）使用“文件”—“保存”命令将文

件保存为“.fla”格式，在Flash产生CS3及

其以上版本的环境下对影片进行测试。使用

“控制”—“测试影片”命令或Ctrl+Enter快

捷键测试影片，对影片进行修改；

[注：]文件中若包括多个场景，可先分场

景进行测试，然后测试整个影片，提高测试效

率。

（2）使用“文件”—“发布设置”命令

可设置文件的发布格式，如常用的Flash Player

播放格式.swf格式，网页格式“.htm”格式，可执行文件.exe格式，. 以及mov、.avi等格式的视频格式，如图1-4-7所示。

（3）使用“文件”—“发布”命令根据以上设置的文件发布格式进行发布。

1.5 案例一：矩形到圆的变形动画——常规文件创建

下面通过创建一个常规文件完成矩形到圆的变形动画，学习掌握Flash文件创建、属性设置、保存与发布的方法。如图1-5-1所示。

二维动画设计–––Flash 案例教程

14

图1-5-1 矩形到圆的变形动画效果图

设计设计制作：

步骤1：新建“Flash 文件（ActionScript3.0）”类型的文件。

步骤2：使用“修改｜文档”命令修改文档属性，尺寸设置为800*600。

步骤3：在图层１第１帧舞台左上侧绘制矩形，填充为红色，第30帧“插入|时间轴|关键帧”，（也可以通过F6功能键进行插入关键帧操作），删除第30帧矩形，在舞台右下侧绘制椭圆。右击图层１第１帧，在快捷菜单中选择“创建补间形状”命令，在第１帧与第30之间形成补间帧。

步骤4： 按“Enter ”播放动画。

步骤5：保存文件为xl-1.fla ，观察其文件存储容量。

步骤6：“文件|发布设置”，设置发布文件为swf 、html 、exe 格式，发布文件。观察比较各类文件存储容量，得出结果。

步骤7：“文件|导出|导出影片”，将文件导出为avi 、位图序列格式*.bmp ，比较文件存储容量和播放效果。

1.6 案例二：幻灯片动画——通过模板创建文件

幻灯片动画通过交替显示来展示图像，在显示图像时，幻灯片动画既可以自动播放，

二维动画设计–––Flash 案例教程

15 也可以通过手动逐一显示图像。这样的动画需要制作许多图形元件、按钮元件，甚至需要创建动作才可以实现。利用“照片幻灯片放映”模板创建文件，进行图像替换很容易实现这样的功能。如图1-6-1所示。

图1-6-1 幻灯片动画效果图

设计设计制作：

步骤1：执行“文件|新建”命令，在对话框中切换到“模板”选项卡。选择“类别”列表中的“照片幻灯片放映”选项，在“模板”列表中选择“现代照片幻灯片放映”，确定。

步骤2：由于该模板文档是一个完整的动画，所以保存后即可预览效果。想要播放自己的照片，需要先将照片导入到库。执行“文件|导入|导入到库”命令，将准备好的图片素材导入到库。如图1-6-2所示。

二维动画设计–––Flash 案例教程

16

图1-6-2 设置替换图片

步骤3：在时间轴面板中找到图像所在图层（Picture Layer ），并且选中第一幅图像，单击属性面板中的“交换”按钮，在“交换图像”对话框列表中选择要替换的图像文件，确定。如图1-6-3所示。使用任意变形工具调整替换的图像大小和位置，使图像位于边框内部。

图1-6-3 替换图片后

步骤4：使用相同的方法，为其他图像交换导入的图像。完成后保存文件，执行“控制|测试影片”（Ctrl+Enter ）预览幻灯片效果。

二维动画设计–––Flash 案例教程

17 第二章 Flash 基础案例

2.1 绘图工具使用——庭院设计案例 学习要点

（1）学习文档属性修改；

（2）学习画线、圆、矩形、多边形工具的使用；

（3）学习普通图层的使用；

（4）选取工具的使用

（5）学习铅笔工具使用；

（6）学习颜色面板使用、滤镜的使用；

（7）学习影片测试、保存、发布。

Flash 不仅是一个制作动画的软件，它强大的绘图功能更可以使它成为一个优秀的绘图软件。利用Flash 制作动画，关键的一个环节就是绘制图形，得到所需要的动画场景和角色。虽然Flash 支持多种位图格式，但不建议过多的采用位图制作动画，因为利用位图制作的动画文件容量大，将直接影响动画的传播效果。建议学会利用Flash 绘制所需对象。

任务布置：

设计一庭院场景，如图2-1-1所示。要求在庭院中绘制房屋、树木、花草等典型对象，并且将庭院中每一类对象放在不同图层中。

图2-1-1 庭院设计效果图

本文来源：https://www.bwwdw.com/article/bmoq.html