Flash二维动画技术探讨及其应用——乌鸦喝水-毕业论文

本科毕业论文题目：Flash二维动画技术探讨及其应用乌鸦喝水姓 名：学 院：软件学院系：软件工程专 业：软件工程年 级： 学 号：指导教师： 职称： 职称： 年 月摘 要 Flash是一个技术门槛比较低，开发成本也相对比较低的优秀软件。它让不少业余爱好者很快能够加入到创作者的行列中来。因其不少作品很符合大众口味， 而且这种新颖的动画具有便于网络传播的形式，喜好Flash动画的观众数量在短时间内迅速上升。 在商业领域，因为Flash的网络传播性和画面的可塑性。它很快成为了企业或商家们都喜好的网络展示形式，用于他们的商业站点、产品展示、会议演示，甚至电视节目都有Flash的踪影，并且业界也在进行着把Flash更加多的应用到传统媒体的尝试。由于Flash动画具有制作简单、成本低、通用性较大、受网络资源的制约小，甚至可以具备交互性等三维动画无法替代的优势，因此在动画游戏制作、网络构件、广告设计、工控界面等领域Flash二维动画依旧发挥着不可替代的作用。由此可见，Flash动画拥有着良好的前景，它的优势综合起来更加使它具备强劲的实力能够更多的创造获利机会。笔者希望通过自己实践开发完成一部动画短片来掌握Flash二维动画技术的基本概念、原理、软件工具以及实现方法，为以后进一步的应用和开发奠定基础。本文还针对Flash二维动画制作过程中的技术问题进行了深入的探讨，希望可以通过对技术问题的探讨，掌握更多技能来辅助Flash的创作，让设计工作更加高效率。 关键词 动画 路径 帧AbstractFlash appeared in China in 1997, its considered to be an excellent software for the easy-using technology and low cost. Because of the two important advantages, many amateurs are attracted to join in the group of creators. The number of its audiences increase very fast in a short term, thats not only because of many of them correspond with peoples taste, but also because of this new kind of animation can be spread easily on the Internet.Due to its advantage of spreading way and the plasticity of design, in the field of commerce, Flash becomes the enterprises or businessmens favorable way of showing on the Internet, it is used in their business stations, exhibitions, meeting demonstration, even in the TV programmes. At the same time, the field is trying to apply Flash in more traditional medium.As we see, Flash has a very good prospect, its advantages make it have much more stronger power to create more profitable opportunities.The writer hope that through designing and carrying out an animation of her own to master the basic conception, theory, software tools and the method of how to realize an animation, profoundly speaking, all of them lay a foundation for a better application and exploitation in the future.In this thesis, the writer aims directly at the discuss of the technology used in designing the Flash 2D animation. Through this discuss, the writer expects to master more technologies to assist the design of Flash so that the process of designing an animation can be more effective.Key words animation frame path 目 录引 言1 第1章概述 2 1.1Flash二维动画概述 2 1.1.1Flash二维动画的概念 2 1.1.2Flash二维动画技术的产生和发展 2 1.1.3Flash二维动画的主要技术 3 1.2Flash二维动画制作的主要特点 5 1.3Flash二维动画的应用前景 6 1.3.1Flash二维动画的优势 6 1.3.2Flash二维动画的应用前景 6 第2章 开发背景 8 2.1 开发目的 8 2.2 设计目标 8 2.3 工具介绍 8 2.3.1 Photoshop介绍 8 2.3.2 Flash MX介绍 9 2.4 环境支持 10 2.4.1 硬件环境 10 2.4.2 软件环境 10 第3章 开发步骤 11 3.1 故事情节的安排 11 3.2 为动画添加背景 123.2.1 图层的创建 12 3.2.2 绘制路径 13 3.2.3 用渐变色填充选区 13 3.2.4 花瓣的制作 15 在花瓣的制作过程中，我主要进行了以下几个步骤： 153.2.5 树的制作 163.3 动画角色的创作 17 3.3.1 使用钢笔工具创建路径 17 3.3.2 为选区填充颜色 18 3.4 动画制作说明 19 3.4.1 制作过程中应用的关键原理 19 3.4.2 翻页特效的制作 21 3.4.3 迷你文字特效的制作 243.4.4 让背景动起来 24 3.4.5 乌鸦飞行的动画制作 253.4.6 水的制作 26 3.4.7 水的变化 27 3.4.8 由远到近的镜头切换 28 3.4.9 加载音频 29 3.4.10 ActionScript编辑脚本 29 3.4.11 边缘保护层的制作 29 第4章 结论 31 致谢语 32 参考文献 33 ContentsIntroduction1 Chapter Summarize 2 1.1 The summarize of Flash 2D animation21.1.1 The conception of Flash 2D animation2 1.1.2 The appearance and development of the technology of Flash 2D animation.21.1.3 The main technologies of Flash 2D animation 31.2 The principal characters of the production of Flash 2D animation5 1.3 The prospect of the application of Flash 2D animation6 1.3.1 The superiority of Flash 2D animation61.3.2 The prospect of the application of Flash 2D animation6 Chapter The background of this programme8 2.1 The propose of this programme82.2 The traget of this programme 8 2.3 The introduction of the tools 8 2.3.1 The introduction of Photoshop 8 2.3.2 The introduction of Flash MX 9 2.4 The running environment of this programme 10 2.4.1 The environment of hardware 10 2.4.2 The environment of software 10 Chapter The steps of developping this programme 11 3.1 The arrangement of the storys content 11 3.2 Add the background to this animation 12 3.2.1 The creation of layers123.2.2 The establishment of paths 13 3.2.3 Fill up the appointed areas with gradient color 13 3.2.4 The creation of the pentals 15 3.2.5 The creation of the trees 163.3 The creation of the rule 17 3.3.1 Creat the paths with the tool of pen 17 3.3.2 Fill up the appointed area 18 3.4 The explanation of the animations production 19 3.4.1 The main principles used in this programme 19 3.4.2 The creation of the special efficacy of turning page 213.4.3 The creation of the special efficacy of mini letters 24 3.4.4 Make the background move 24 3.4.5 The creation of the flying crow 25 3.4.6 The creation of the water 26 3.4.7 The change of the water 27 3.4.8 The switch of the shots from far to near 28 3.4.9 The addition of the sounds 29 3.4.10 Using ActionScript to compiler the script 29 3.4.11 The creation of the layer protecting the edges 29 Chapter Conclusion 31 Acknowledgement 32 References 33 VI厦门大学本科毕业论文引 言二维动画在动画发展史上占据着相当大的空间，直到90年代三维动画的崛起，导致传统的二维动画面临着新的困境。在三维动画大片海底总动员取得了前所未有的成功之后，有关二维动画即将退出历史舞台的报道更是在各大媒体上频频亮相。三维动画的诞生不仅在银幕前向观众展示了立体真实的动画效果，带给了观众前所未有的视觉享受，并且改进了传统动画片的制作工艺，使得动画的制作向着更高效率的方向前进。尽管三维动画的产生确实对二维动画造成了极大的冲击，但并不能因此认定二维动画已经走到了末路。通过与Flash技术相结合制作而成的二维动画具备多媒体和互动两个特性。随着网络多媒体制作技术的发展，音乐、动漫、文字实现了互相穿插链接是一个迫近的趋势，内容变的越来越精彩纷呈。以互联网多媒体为方向的多元媒体相互竞争、并行发展的格局。并且由于Flash动画具有制作简单、成本低、通用性较大、受网络资源的制约小，甚至可以具备交互性等三维动画无法替代的优势，因此在动画游戏制作、网络构件、广告设计、工控界面等领域Flash二维动画依旧发挥着不可替代的作用。我这篇论文就是针对Flash二维动画技术探讨及其运用展开的。第1章 概述1.1 Flash二维动画概述1.1.1 Flash二维动画的概念“动画”通常被人们理解为“动画片”，实际上动画是一个广义的概念，不单是指制作完成的动画作品。动画是指除真实动作或方法外使用各种技术创作的活动影像，亦即是以人工的方式创造动态影像。二维动画一般是指传统的手工绘画，是通过动画师来绘制每一帧画面，最终用摄影机或扫描仪合成传递在屏幕上的动画。Flash二维动画指的就是凭借Flash技术制作而成的二维动画。1.1.2 Flash二维动画技术的产生和发展 Flash二维动画技术的产生在Flash出现以前，由于网络带宽不足，以及浏览器支持的问题，网页上播放动画只有两条路可以选择：一是制作成GIF动画，缺点是只有256色；二是使用Java编程，动画效果完全取决于程序编写者的功力。感谢Macromedia公司，他们收购了一家小公司的Flash，经研究开发后推出了后来的Flash，从而使得网络带宽不再是问题，无数网络爱好者也可以自己精心设计高品质的动画。 Flash二维动画技术的发展Flash最早期的版本称为Future Splash Animator，当时Future Splash Animator最大的两个用户是微软（Microsoft）和迪斯尼（Disney）。1996年11月，Future Splash Animator卖给了MM（M），同时改名为Flash1.0 。这里不得不提到的人物是乔纳森盖伊(Jonathan Gay)，是他和他的六人小组首先创造了Future Splash Animator，也就是现在Flash的真正前身了。Macromedia 公司在1997年6月推出了Flash 2.0 ，1998年5月推出了Flash3.0。Flash 3自98年面市以来以其独特的2D网页多媒体技术及交互式的编程令浏览者眼睛一亮，但新生事物总是被人忽略的，当时只在少数几个先知先觉的个人主页采用了这种技术。99年中Flash 4.0版本正式推出，Flash 4.0开始有了自己专用的播放器，称为“Flash Player”，但是为了保持向下相容性，Flash仍然沿用了原有的扩展名：.SWF（Shockwave Flash）。其动画制作与脚本编程得到了较大的加强，在短短的一年时间里，FLASH动画得到了迅猛的发展与普及。2000年8月Macromedia 推出了Flash 5.0 ，它所支持的播放器为 Flash Player 5。Flash 5.0中的ActionScript已有了长足的进步，并且开始了对XML和Smart Clip（智能影片剪辑）的支持。ActionScript的语法已经开始定位为发展成为一种完整的面向对象的语言，并且遵循ECMAScript的标准，就像javascript那样。2002年3月Macromedia 推出了Flash MX支持的播放器为 Flash Player 6。Flash 6开始了对外部jpg和MP3调入的支持，同时也增加了更多的内建对象，提供了对HTML文本更精确的控制，并引如SetInterval 超频帧的概念。同时也改进了swf文件的压缩技术。2003年8月Macromedia 推出了Flash MX 2004，其播放器的版本被命名为 Flash Player 7。Flash MX较Flash的以前版本，无论是在操作界面、图像处理方面，还是在Action Script脚本语言、 文件的支持格式和发布等方面都做了不小的改变。Flash MX除具备满足网络应用的增强型工具外，还包括其他一些新特点。与此同时Macromedia公司还开始了对Flash本身制作软件的控制和插件开放JSFL（Macromedia Flash javascript API）。1.1.3 Flash二维动画的主要技术 通过输入和编辑关键帧帧是动画制作过程中的一个最为重要的概念，因为动画其实就是利用人视觉上的停顿现象来实现的，我们可以把帧看作动画中的一个暂停镜头。动画片的最小长度单位是格，在Flash MX中叫帧，当按一定的速率播放时就会产生动画效果。关键帧是定义在动画中变化的帧。在创建“帧-帧”动画时，每一帧都是关键帧，而在“补间”动画中，只需在需要的地方定义关键帧，Flash会自动创建关键帧之间的内容。因此，关键帧在制作动画的过程中是非常重要的，只有定义了关键帧才可能定义动画的每一个图像。关键帧既可以定义一个过程的起始和终结，又可以是另一个过程的开始。 计算和生成中间帧在Flash MX中，帧大致分为关键帧与中间帧，关键帧往往表示动作的极限位置，在这些关键帧之间的过渡画面是中间帧。中间帧的是延续前一个关键帧上的内容，不可以对其进行编辑操作，中间帧数目的多少决定了前一关键帧上图形形态延续时间的长短。 补帧动画这个术语来自于旧的动画行业中“在两者之间”（in between）这个术语，它所指的是在关键帧之间创建动画序列的专业技术或者是所需要做的工作。在Flash中，补帧动画还可以放置在关键帧之间，但它们可以用于诸如比例缩放、旋转、可视化等自动化转换效果中。 定义和显示运动路径在一些动画中，动画对象在起始帧处于某一位置，在终点帧可能在另一位置上（也可以位置不变而改变对象的属性）。如果不设定对象运动的路径，单纯依靠设置关键帧，对象从起点到终点的运动将是直线运动，仍然无法实现一些复杂的动画效果，然而有很多运动是弧线或不规则的。因此为了使运动对象沿着设计者制定的路径运动，还需要定义一条运动路径。 力学在物理世界中，物体都是以可预知的方式运动的。因为动画中角色的各个部分都是连接在一起的，所以要对重力之类的外力做出反应，因此它们时常会做出弧形的动作。 交互式给画面上色 给画面上色的过程就是给动画中出现的各个角色和场景赋予生命的过程，画面的颜色体现了故事发生的环境和气氛，角色的颜色体现了其个性与外表的关系。几乎所有的事物都可以有个性，一条线或者一个点都可以有自己的特点。因此使用正确的颜色为画面交互式着色的过程也是动画制作过程中的关键技术之一。 实现画面与声音的同步在动画制作过程中，为了使影片更加形象生动、有声有色，通常还需要在影片中 添加声音，从而制作出有声影片。制作有声影片的关键技术问题就是要保证画面与声音的同步。在这个过程中就需要利用属性面板对导入的音频进行编辑，包括声音的淡入、淡出、左右声道的切换等。也可以使用“编辑封套”对话框手工编辑声音，如改变声音播放和停止播放的点，以删除无用的声音等。1.2 Flash二维动画制作的主要特点 在Flash中，用户可以通过在舞台上移动对象的位置，改变对象的形状、颜色与不透明度，或者旋转对象来方便地制作动画。概括起来，Flash动画主要有如下的一些特点：1. 用户既可以直接创建简单的“帧-帧”动画，此时可分别为每帧创建单独的图像，也可以通过创建动画的第一帧和最后一帧，然后设置创建中间帧的方法来创建补间动画。2. 在Flash MX 2004中，用户还可以利用“时间轴特效”制作一些特定类型的动画；如变形、转换、模糊、分离和投影等。“时间轴特效”是系统预建的动画创作方法，可将它们应用于文本.图形、位图和按钮。3. 动画设置是以图层为单位进行的，因此用户在使用Flash创建动画时通常要创建大量的图层，以便对动画的不同元素进行控制。4. 如果动画比较复杂，还可将动画划分为不同的场景。5. 为了能够重复使用某些动画片段或者为其增加交互性，可以创建影片剪辑、按钮或图形元件，然后再将其添加到合适的场景中，此时的对象被称为元件实例。6. 为了给动画增加交互特性或者制作一些特殊效果，可编写附加到元件实例与关键帧上的动作脚本。此外，用户还可以通过将系统提供的“行为”（预先编写的动作脚本）添加到某个对象（影片剪辑、视频及声音）来控制该对象，而不必自己创建动作脚本代码。例如，可以使用行为链接到Web站点、载入声音和图形、控制嵌入视频的回放、播放影片剪辑和触发数据源。7. 为了创建能够与服务器交互的影片、网页等，可在文档中添加组件（实际上是带有预定义参数的影片剪辑）并编写脚本。1.3 Flash二维动画的应用前景1.3.1 Flash二维动画的优势第一、Flash动画受网络资源的制约一般比较短小，所以在情节和画面上往往更夸张起伏，致力在最短时间内传达最深感受。第二、Flash动画具有交互性优势，更好的满足的受众的需要，他可以让欣赏者的动作成为动画的一部分，通过点击、选择等动作决定动画的运行过程和结果。这一点是传统动画所无法比拟的。第三、由于只需要掌握一些特定的软件就可以尝试，Flash动画的制作相对比较简单，一个爱好者很容易就能成为一个制作者。全新的Flash动画(Flash)使动画制作变得非常简单：一套电脑软件，一个人，一台电脑就可以制作出一段有声有色的动画片段。第四、Flash动画可以放在网上供人欣赏和下载，由于使用的是矢量图，文件小，传输速度快的特点，助长了高速动画的崛起，可以利用独有的优势在网上广泛，有着可比拟的传播性。Flash制作的MV比传统的MV就易于在网络上传播。第五、Flash动画虽然现在还是比较粗糙、简陋，但Flash有新的视觉效果，比传统的动漫更加灵巧,更加的酷。它不可否认已经成为了一种新时代的艺术表现形式第六、用Flash制作动画会大幅度降低制作成本，减少人力，物力资源的消耗。同时，在制作时间上也会大大减少。半小时的节目，若用Flash技术制作，大约3至4个月就可杀青，若用其它技术通常需用10-14个月。第七、Flash制作的动画可以同时在网络与电视台播出，实现一片两播。正因为Flash动画的几点优势，所以利用任何一家搜索引擎，在卡通动漫类目录下能搜索到数以千计的网站，个人网站以绝对的数量优势遍地开花。1.3.2 Flash二维动画的应用前景Flash被称为是“最为灵活的前台”，由于其独特的时间片段分割（TimeLine）和重组（MC嵌套）技术，结合ActionScript的对象和流程控制，使得在灵活的界面设计和动画设计成为可能，同时它也是最为小巧的前台。Flash具有跨平台的特性（这点和Java一样），所以无论你处于何种平台，只要你安装了支持的Flash Player，就可以保证它们的最终显示效果的一致，而不必像在以前的网页设计中那样为IE或NetSpace各设计一个版本。同Java一样，它有很强的可移植性。最新的Flash还具有的手机支持功能，可以让用户为自己的手机设计喜爱的功能。当然首先必需要有支持Flash的手机，同时它还可以应用于Pocket PC。因此，Flash的运用前景主要体现在以下几个领域：1. 应用程序开发：由于其独特的跨平台特性、灵活的界面控制以及多媒体特性的使用，使得用Flash制作的应用程序具有很强的生命力。在与用户的交流方面具有其它任何方式都无可比拟的优势。当然，某些功能可能还要依赖于XML或者其它诸如javascript的客户端技术来实现。但目前的现状是：很少有人具有运用Flash进行应用程序开发这方面的经验。但这个难度会随着时间的推移而逐步减弱。事实上，对于大型项目而言，使用Flash此时未免有些言之过早，因为它意味着很大的风险。当然，在最早的时间掌握和积累这方面的经验无疑是一种很大的竞争力。可以将这种技术运用在项目中的一小部分或者小型项目中，以减少开发的风险。2. 软件系统界面开发：Flash对于界面元素的可控性和它所表达的效果无疑具有很大的诱惑。对于一个软件系统的界面，Flash所具有的特性完全可以为用户提供一个良好的接口。 3. 手机领域的开发：手机领域的开发将会对精确（像素级）的界面设计和CPU使用分布的操控能力有更高的要求，但同时也意味着更加更广泛的使用空间。事实上手机和Pocket PC的分界已越来越不明显，开发者必须为每一款手机（或Pocket PC）设计一个不同的界面，因为它们的屏幕大小各有不同。当然软件的内核可能是相同的，所要注意的是各类手机CPU的计算能力和内存的大小。这无疑是些很苛刻的要求。4. 游戏开发：事实上，Flash中的游戏开发已经进行了多年的尝试。但至今为止仍然停留在中、小型游戏的开发上。游戏开发的很大一部份都受限于它的CPU能力和大量代码的管理。不过可喜的是，Flash Player 7运行时性能提高了2至5倍；而且最新的Flash MX 2004 Professional提供了项目管理和代码维护方面的功能，Actionscript 2.0的发布也使得程序更加容易维护和开发。5. Web应用服务：其实很难界定Web应用服务的范围究竟有多大，它似乎它拥有无限的可能。随着网络的逐渐渗透，基于客户端-服务器的应用设计也开始逐渐受到欢迎，并且一度被誉为最具前景的方式。但是，这种方式开发者可能要花更多的时间在服务器后台处理能力和架构上，并且将它们与前台（Flash端）保持同步。6. 站点建设：事实上，现在只有极少数人掌握了使用Flash建立全Flash站点的技术。因为它意味着更高的界面维护能力和开发者整站架构能力。但它带来的好处也异常明显：全面的控制；无缝的导向跳转；更丰富的媒体内容；更体贴用户的流畅交互；跨平台和瘦客户端的支持；以及与其它Flash应用方案无缝连接集成等。7. 多媒体娱乐：其实，在这个方面无需再说什么。尽管它的发展速度没有像当初预言的那样迅速，但它仍然还在不断前进。Flash本身就以多媒体和可交互性而广为推崇。它所带来亲切氛围相信每一位用户都会喜欢。第2章 开发背景2.1 开发目的Flash二维动画从问鼎互联网到风靡至今，已经赢得了越来越多网络爱好者的青睐与关注。在网上随处可见到使用Flash制作的二维动画，搞笑的、讽刺的、宣传的应有尽有。这种制作简单、容易上手的动画形式，以喜闻乐见的方式引领了网络革命新潮流，在互联网世界的霸主地位日益显著。二维动画不仅在网络中有着非凡的表现，同样也涉及到了动画游戏制作，网络构建，广告设计，工控界面等等，正逐步与人们的生活紧密相连。笔者希望通过自己实践开发完成一部动画短片来掌握Flash二维动画技术的基本概念、原理、软件工具以及实现方法，为以后进一步的应用和开发奠定基础。2.2 设计目标我的设计目标是设计一部以“乌鸦喝水”为主要题材的动画短片。为了保持内容的连贯性和独创性，我把动画片的展示平台定位在了一个虚拟的“幼儿视频教育”，通过这个虚拟的视频教程中“经典寓言故事”系列的展示，很自然的引出了这次动画设计的主体篇章乌鸦喝水。由于这部动画片的观看主体为幼儿，我把片中各个元素的颜色都设计得很鲜艳，让画面明快、活泼、艳丽，符合儿童的欣赏趣味，此外，为了满足儿童在观赏动画片时的趣味性，我还将在场景中出现的动植物造型也设计的夸张了些，并且在片中加入配音，使得整部动画片更加生动有趣。2.3 工具介绍2.3.1 Photoshop介绍Photoshop是平面图像处理业界霸主Adobe公司推出的跨越PC和MAC两界首屈一指的大型专业图像设计软件。它拥有强大的图像处理能力、友好的操作界面,并且易于广大用户学习和操作，因此得到了广大第三方开发厂家的支持，从而也赢得了众多的用户的青睐。在几乎所有的广告、出版、软件公司，Photoshop都是首选的平面工具。 Adobe Photoshop最初的程序是由Mchigan大学的研究生Thomas创建，后经Knoll兄弟以及Adobe公司程序员的努力Adobe Photoshop产生巨大的转变，一举成为优秀的平面设计编辑软件。它的诞生可以说掀起了图像出版业的革命，目前AdobePhotoshop最新版本为Photoshop CS3，它的每一个版本都增添新的功能这使它获得越来越多的支持者也使它在这诸多的图形图象处理软件中立于不败之地。 Photoshop支持众多的图像格式，是一款非常专业的图象编辑应用程序，可以用它来创建图象，或者修改扫描的图片或数码照片。Photoshop允许用户对每个像素、所有像素集或像素的单个元素采取全方位控制，它对图像的常见操作和变换做到了非常精细的程度，使得任何一款同类软件都无法望其颈背，它用于对照片或任何扫面作品的修改。可以用它修饰图象，应用特殊效果，交换照片中的细节信息，导入文字和徽标，调解色彩平衡，甚至锐化照片的焦点。Photoshop还提供了从头开始创作一幅艺术作品所需的一切，包括矢量绘图工具和特殊的绘画板等。这些工具于压敏板完全兼容，因此完全可以像绘制水彩画或油画那样，创作出生动自然的作品。2.3.2 Flash MX介绍Flash是一种创作工具，设计人员和开发人员可使用它来创建演示文稿、应用程序和其它允许用户交互的内容。Flash可以包含简单的动画、视频内容、复杂演示文稿和应用程序以及介于它们之间的任何内容。通常，使用 Flash创作的各个内容单元称为应用程序，即使它们可能只是很简单的动画。使用者可以通过添加图片、声音、视频和特殊效果，构建包含丰富媒体的 Flash应用程序。Flash特别适用于创建通过 Internet 提供的内容，因为它的文件非常小。Flash是通过广泛使用矢量图形做到这一点的。与位图图形相比，矢量图形需要的内存和存储空间小很多，因为它们是以数学公式而不是大型数据集来表示的。位图图形之所以更大，是因为图像中的每个像素都需要一组单独的数据来表示。在 Flash中创作内容时，需要在 Flash 文档文件中工作。Flash 文档的文件扩展名为 .fla (FLA)。Flash 文档有四个主要部分：1. 舞台是在回放过程中显示图形、视频、按钮等内容的位置。在Flash 基础中将对舞台做详细介绍。2. 时间轴用来通知 Flash 显示图形和其它项目元素的时间，也可以使用时间轴指定舞台上各图形的分层顺序。位于较高图层中的图形显示在较低图层中的图形的上方。3. 库面板是 Flash 显示 Flash 文档中的媒体元素列表的位置。4. ActionScript 代码可用来向文档中的媒体元素添加交互式内容。例如，可以添加代码以便用户在单击某按钮时显示一幅新图像，还可以使用 ActionScript 向应用程序添加逻辑。逻辑使应用程序能够根据用户的操作和其它情况采取不同的工作方式。Flash 包括两个版本的 ActionScript，可满足创作者的不同具体需要。有关编写 ActionScript 的详细信息，请 参阅帮助面板中的学习 Flash 中的 ActionScript 2.0。Flash包含了许多种功能，如预置的拖放用户界面组件，可以轻松地将 ActionScript 添加到文档的内置行为，以及可以添加到媒体对象的特殊效果。这些功能使 Flash 不仅功能强大，而且易于使用。2.4 环境支持2.4.1 硬件环境安装使用Flash MX需要如下硬件环境：（1） CPU：对于Windows 9/NT4或更高版本，要求Intel Pentium 200 MHz或同频处理器。（2） 内存：至少32MB（推荐使用64MB以上内存）。（3） 硬盘空间：在系统盘上有40MB以上剩余空间。（4） 显示：最低需要一个256色VGA图形加速卡。彩色显示器至少是256色以上，分别率最好能为1024768。（5） CD-ROM：8倍以上光驱。（6） 其他：鼠标等。2.4.2 软件环境 若在浏览器中播放Flash SWF格式影片，一般需要：（1） Microsoft Windows 95/98/2000/XP/NT或更高版本。（2） Internet Netscape4或更高版本中应用Netscape插件。（3） 如果播放ActiveX控件，需要Internet Netscape4或更高版本。（4） 如果播放Flash Player Java Edition，需要支持Java浏览器。（5） 播放Flash MX电影，至少需要32MB内存。第3章 开发步骤3.1 故事情节的安排剧本可以说是整个动画短剧的灵魂。在剧本里应该安排好故事情节的发展、场景之间的切换、角色之间的对话等，所以在设计动画之前应该有一个好的剧本才能开始动画的制作。我起初对这个二维动画的故事情节设计大致为：把这个动画的展示平台假设成为一个多媒体的软件“幼儿视频教育系列”中的一则故事，然后自然而然地展现出动画的主体部分“乌鸦喝水”。这样就不会因为整部动画片没有一个合理的发生背景，导致观众认为故事展开得太过唐突。有了初步的构想以后，我对这个想法进行了更加深入细致的设计和规划。我把整个故事安排在了五个的场景。第一个场景作为动画的片头部分，我计划采用一个翻页特效作为片头动画引出我虚拟的动画展现平台“幼儿视频教育系列之经典寓言故事”。把场景一设计为这个视频教育系列的片头动画，以增强整个动画片的新颖性和独创性以及制作的难度。场景一中在翻页后向观众展现出这个“视频系列之经典寓言故事”中所包含的故事，然后通过把前几个故事的名称所采用字体的大小和颜色逐个进行变化，表达出“这些故事我们之前已经讲述过了”，当字体的变化轮到了“乌鸦喝水”的时候，把这个名称的变化采用不同于前几则故事的方法，以突出“我们这次学习的课程是乌鸦喝水”这个思想。场景二接上场景一结束前提到的这次学习的主要内容，对这个动画设计一个单独的片头，但是因为是第二个片头，所以展现方式要比第一次简单一些才能显得更加真实，所以我计划采用特效“多层渐变效果”让文字逐个又圆形变化而出。从场景三开始就进入了动画的主体部分。在场景三就主要是向观众展现出乌鸦在空中飞翔，然后飞着飞着突然看到了一瓶水就俯冲了过去，此刻就转到了第四个场景。第四个场景主要描述的就是乌鸦走到了水杯前发现里面的水太少了，而且瓶口太窄它的嘴伸不进去所以喝不到水。在这个时候它看到了不远的地方有一些小石子，聪明的乌鸦立马想到了把石子衔过来扔到瓶子里让水面涨起来，这样的话它就可以喝到水了。第五个场景就是描述了乌鸦一次次的衔来小石子，直到水面上升到了瓶口。然后它喝了水后心满意足的飞走了。3.2 为动画添加背景这个Flash二维动画的背景我是在Photoshop里面进行绘制的，然后另存为.jpg格式导入Flash。下面就对我在制作Flash动画背景的过程中的一些关键技术问题进行说明。 3.2.1 图层的创建图层的作用就好像是一些单独的文档，相互堆叠在一起把图像的不同部分隔离到独立的图层上。将每个图像放置在它自己的图层上，我们就可以自由地独立编辑和变化一层的像素，而且这些更改结果不会相互影响。这就给我在创建背景的时候带来了极大的好处，因为第一次创作好图像以后，很难一次性的就创作出自己想要的效果，如果把所有图像都绘制在同一图层的话，要进行修改或是擦涂就可能会导致其它图像受到影响。下图就是我把在场景一的背景里面出现的所有图像元素都单独进行了分层。这在给我做最后图像编辑的时候带来了极大的便利。图3-1 独立的图层在图层工具栏里面通过点击左侧的那一列眼球状的图标，可以暂时隐藏或是显示图层。通过这个功能可以帮助我们在绘图或是编辑图像的时候暂时把其它会干涉到我们视线的图层暂时隐藏起来。并且由于Photoshop的图层排序采用了堆栈中的顺序的方法，可以通过调节图层的顺序来确定图像中各个元素的堆放层次。所以在编辑图像的过程中我时常会对图层的顺序进行调整。一般来说调整图层的方法就是两种：第一种方法是在滚动列表中上下拖动图层名称，以改变图层的前后顺序。在使用这个方法的时候要注意：在放开鼠标之前一定要保证黑色细条达到要移动的目标点。第二种方法是从菜单栏的“图层排列”子菜单中选择适当的命令。3.2.2 绘制路径使用普通的钢笔工具绘制路径时，是通过创建一系列独立的点产生路径。Photoshop自动用直线或曲线将这些点一段一段地连接起来。Photoshop中的所有路径都是Bzier路径，贝济埃曲线模型允许路径中的每个点有零个、一个或两个相关的控制柄，它们成为贝济埃控制柄或控制柄。通过移动一个点的手柄，可以调节经过该点的路径曲线。路径与一般的选取轮廓不同，因为路径处于不同的面向对象图层上。这些图层位于位图图像的前面。通过路径的建立用户能够在画完路径之后进行逐点准确修正，以确保满足图像的要求，同时可以避免编辑普通选区轮廓时经常出现的弄乱图像的问题。建立路径后，将它转换为标准的选取轮廓，然后再编辑图像的内容。下图就是我在创作背景的时候所画出的路径并对其进行描边后的效果图：图3-2 描边后的路径因为在制作背景的过程中路径的创作方法太过简单，所以把钢笔工具的使用放到3.3.1使用钢笔工具创建路径中进行详细阐述。3.2.3 用渐变色填充选区在路径创作好以后我就对其进行了填充。因为需要背景颜色具有渐变的效果，所以不能简单的使用前景色进行填充。填充选区的时候主要有以下几个步骤：（1） 用魔术棒选中所需要进行填充的选取。（2） 在工具栏里选中“渐变工具”，然后在下图所示的状态栏选取渐变的颜色和渐变的样式。在Photoshop中向用户提供了五种渐变样式，在我的背景里面我用到的只是其中的一种线形渐变。图3-3 线形渐变选择框（3） 因为Photoshop里面自带的几种渐变方案都不是我想要的，所以我通过渐变编辑器对自己想要的渐变色进行设置。下图就是渐变编辑器的样式：渐变栏图3-4 渐变编辑器 在我的背景里面用到的是“实底渐变”也可以称为“纯色渐变”。渐变栏中展示了实际的渐变效果。开始颜色位于左侧小房子标志制定的位置，结束的颜色位于最右边。若要对选取的颜色进行调整就需要通过双击渐变栏下方的小房子，或是单击渐变编辑器里“色标颜色”，然后进入到拾色器对颜色进行选取。图3-5 拾色器图示（4） 填充选区。在填充选区的时候还需要注意根据自己的需要对渐变色填充的方向进行设置。在渐变填充里面颜色的渐变方向取决于用户拖动的“开始点”到“结束点”的方向。3.2.4 花瓣的制作在花瓣的制作过程中，我主要进行了以下几个步骤：（1） 用椭圆形画出一片花瓣的形状；（2） 用颜料桶对花瓣进行填充；（3） 用加深和简单工具对花瓣进行加工，让花瓣的左边和右边颜色明亮度有所区别，这样才能使花瓣真实感的效果更加突出。（4） 对画好的那片花瓣进行复制，然后把所有的花瓣进行排列。排列的过程中主要就是用到了主菜单栏里 “编辑”选项中的子菜单“变换”。下图就是制作好的花瓣放大效果图：图3-6 组合后的花瓣3.2.5 树的制作在我创建的背景图中出现的那几棵树不是自己画的，而是搜索了一些素材库找到的。下面具体谈一下我是如何把找到的背景为白色的树应用到自己的背景中的。（1） 在Photoshop中打开树的图像。（2） 把魔术棒的容差值设置到10，然后对图像中的背景色进行选择。选中的背景色按Delete键删除。（3） 大部分背景色都删除以后把魔术棒的容差值调小，然后对图像中树叶间还剩下的白色背景进行选择。选中的区域按Delete键清除。这样的话树的背景色就被完全清除了。图3-7 删除背景后的树（4） 按住Ctrl+Alt，然后用鼠标把树的图像拖动到我自己创建的背景图中。这时候在我创建的背景图里就自动新建了一个图层，复制过去的树就存在于这个图层中。（5） 通过对树进行复制和变形，在背景中创建出大小不同的树。3.3 动画角色的创作 在动画背景设计完成之后，接下来我做的就是对动画片内的角色进行设计和创作。这一部分我主要就是针对动画角色创作的过程，包括在具体实现过程中运用到的技术进行一个说明。3.3.1 使用钢笔工具创建路径使用钢笔工具在Photoshop中绘制路径时，每次只能绘制一个点。通过单击可以在路径上建立一个转角；拖动将产生平滑点，形成连续的圆弧。如果想让路径的弧度符合自己的需要，画路径点时不要马上放开鼠标，而是继续移动鼠标，使路径点出现调节杆，再用调节杆来调节路径的弧度。如果要填充路径的话那么路径必须是闭合的，让路径闭合的方法就是画到最后一个点的时候，单击该条路径的起始点，这样的话Phot