作者：李旭
出版社：电子工业出版社
格式: AZW3, DOCX, EPUB, MOBI, PDF, TXT
快学Flash网页动画(含DVD光盘1张)试读：
内 容 简 介
本书是一本介绍Flash整站动画设计技法的初、中级教程。以精美的实例和新颖的版式讲述Flash整站动画制作技巧，突出了Flash整站动画的华美效果与良好的交互功能。本书通过实例深入讲解了Flash整站动画的制作方法与技巧，将实际工作中经常遇到的问题进行了清晰的解答。全书分为12章，主要包括：Flash网站基础知识、网站常用ActionScript脚本、基本动画类型、整站Loading的制作、加载外部文本、Flash网站中声音的应用、Flash网站中视频的应用、动态数据处理、网站导航制作、网站首页制作、网站二级页面制作和网站发布等。随书光盘内容为书中实例素材源文件和大量Flash相关资料。未经许可，不得以任何方式复制或抄袭本书之部分或全部内容。版权所有，侵权必究。图书在版编目（ＣＩＰ）数据快学Flash 网页动画／范明，郑俊天编著.—北京：电子工业出版社，2008.6(精彩设计零距离)ISBN 978-7-121-06848-5I. 快…Ⅱ.①范…②郑…Ⅲ.动画－设计－图形软件，Flash CS3Ⅳ.TP391.41中国版本图书馆CIP数据核字（2008）第080996号责任编辑：王树伟, 侯琦婧印 刷：出版发行：电子工业出版社北京市海淀区万寿路173信箱 邮编100036经 销：各地新华书店开 本：203×280 1/16 印张：18.75 字数：600千字印 次：2009年4月第1次印刷印 数：5000册 定价：42.00元（含DVD光盘1张）凡购买电子工业出版社的图书，如有缺损问题，请向购买书店调换。若书店售缺，请与本社发行部联系。联系电话：（010）68279077。质量投诉请发邮件至zlts@phei.com.cn，盗版侵权举报请发邮件至dbqq@phei.com.cn。第1章Flash网站基础知识
随着因特网的飞速发展，网站已经成为当今社会中企业形象推广和市场营销的重要平台，也成为个人展示的重要空间，越来越多的企业和个人都在因特网上建立了自己的网站。自己制作的网站如何在众多的网站中脱颖而出，也成为很多设计者在设计制作网站时首先需要考虑的问题。因为Flash有很好的动画表现能力，界面直观、形态生动，受到越来越多的设计者的喜欢。Flash网站与传统网站相比，具有生动的动画和良好的交互式操作等特征，给每一位访问者带来一种切身的访问感受，使浏览者在浏览的过程中自然而然地融入到网站中。基于Flash网站的众多优点， Flash网站也得到了飞速的发展，它们已经成为因特网中一种非常重要的网站类型。学习目的：● 了解Flash的发展历史● 理解Flash动画与Flash网站的区别● 熟悉Flash网站的分类● 熟练掌握Flash网站的制作流程1.1 Flash的发展历史
1996年，一个名为FutureSplash Animator 1.0的小软件由一家名为FutureWave Software的小软件公司推出。这个FutureSplash Animator 1.0就是传说中的Flash1.0。而这家FutureWave Software公司后来被Macromedia公司收购，成为了Macromedia著名的Flash开发部。………………………………………………………………………一年后，Flash 2.0推出，但是并没有引起人们的关注。直到1998年Flash 3.0的推出才真正让Flash获得了应有的重视，这要感谢网络在这几年的迅速普及和网络速度的提高，以及网络内容的丰富，人们对视觉效果的追求让Flash得到了充分的认识和肯定。经过了1999年过渡性质的Flash 4.0后，2000年Macromedia推出了酝酿已久的具有里程碑意义的Flash 5.0。在Flash 5.0中首次引入了完整的脚本语言——ActionScript 1.0，这是Flash迈向面向对象的开发环境领域的第一步。2002年推出的Flash MX，从传统Flash的角度看，它似乎只是Flash 5.0的一个增强，但随着Flash MX到来的还有两个Flash服务器商产品—Flash Communication Server MX 和 Flash Remoting MX。Flash Communication Server MX是一个基于服务器平台，用于创建和部署令人眼花缭乱的Web音频和视频的应用产品，例如视频点播（VOD）、可视聊天和实时协同应用等。Flash Remoting MX用于在Flash和Web服务器之间建立连接，通过强大易用的编程模块，可以很容易地把Flash内容与Java、.NET及ColdFusion应用结合起来创建复杂丰富的Web应用。2004年，Macromedia推出了Flash MX2004。自Flash 5.0开始，Macromedia就已经将Flash的发展方向更多地移向了多媒体和Web应用开发领域，而不再仅仅局限于交互式动画制作的范围。如果说Flash 5.0是Flash步入面向对象开发环境的第一个里程碑，那么，Flash MX2004就是Flash作为面向对象开发环境的第二个里程碑。Flash 8是Macromedia于2006年推出的版本，Flash 8提供了两种版本：Macromedia Flash Basic 8和Macromedia Flash Professional 8。Flash Professional 8是当时业界最为先进的创作环境，用于创建交互式网站、数字体验和移动内容，是业界创建高级交互内容的首选软件。Flash Basic 8是Flash Profeddional 8的一个子集，包括设计简单运动图形并实现交互性以发送给Flash Player所需的所有核心功能，非常适合临时用户，是用于创建Flash动画的经济型创作工具。2006年Macromedia公司被Adobe公司收购， Flash 8也成为Macromedia公司推出的最后一个版本。2007年，Adobe公司推出了全新的Flash CS3，增加了全新的功能，包括对Photoshop和Illustrator文件的本地支持，以及复制和移动等功能，并且整合了ActionScript 3.0脚本语言开发， Flash CS3的功能更加强大。1.2 Flash动画与Flash网站的区别
目前网站中的Flash动画非常多，用途也非常广，但是相对于Flash网站来说，两者之间还是有很多不同。抛开制作方式的不同，Flash网站和制作普通的Flash动画有以下3点不同。………………………………………………………………………（1）制作思路普通Flash动画都是制作在一个独立的Flash文件中，制作的动画效果随着时间轴的变化或场景的交替变化即可；Flash网站制作则更需要整体的把握，通过不同文件的切换和控制来实现全Flash网站的动态效果，要求制作者有明确的思路和良好的制作习惯。（2）文件播放流程普通Flash动画通常需要将所有的文件放在一个文件内，在观看效果时必须等文件下载完毕才可以开始播放。但Flash网站是通过若干个文件结合在一起，在时间流上更符合Flash软件产品的特性。文件可以做得比较小，通过陆续载入其他文件的方式，除了更适合在因特网上传播，同时还避免了访问者因等待时间过长而放弃浏览的事情发生。（3）文档结构Flash动画的场景、动画过程及内容都在一个文件内，而Flash网站的文件由若干个文件构成，并且可以随发展的需要继续扩展。Flash网站的文件动画分别在各自对应的文件内。通过Action的导入和跳转控制实现动画效果，由于同时可以加载多个SWF文件，它们将重叠在一起显示在屏幕上。1.3 Flash网站的分类
随着Flash版本的不断更新，功能也日益完善，越来越多的网站开始将网站制作成Flash整站的形式。Flash的网站效果比较漂亮，也具有很强的交互性。但是，由于Flash的局限性，这样的网站只适合内容不是很多的中小型网站，对于数据较多的大型综合性网站就不适合了。………………………………………………………………………1．商业类Flash网站商业类Flash网站主要以电子商务和宣传产品为主，这样的网站大多都是以网上购物为基础的。所以，设计应该更加人性化，更加方便浏览者的浏览。因此在设计上就应该避免烦琐的操作。这种网站在用色上应该遵循和谐统一的原则，给人以整体的美感。如图1-1所示的商业类网站。图1-1 商业类Flash网站2．企业类Flash网站企业类Flash网站动画的制作要突出该公司的特色，所以在进行设计和制作时可以尽量规则一些，给人以庄重的感觉，动画制作得较为规整而且朴实，突出该公司的精神主旨，以及该公司的主营业务和服务宗旨。如图1-2所示的企业类网站。图1-2 企业类Flash网站3．科技类Flash网站现在的科技正向着以人为本的方向发展，科技类的网站给人的整体感觉简单而不失华丽、平淡而不失神奇。这类网站大多是以简单的页面设计和复杂的动画效果来吸引浏览者，而且这类网站的设计也都比较新奇，给人以另类的感觉，因此会让人留下深刻的印象。如图1-3所示的科技类网站。图1-3 科技类Flash网站4．娱乐类Flash网站娱乐类网站动画制作中，网站栏目较多，为了突出俱乐部的特色，可以将动画页面绘制得较精美，动画制作得较炫目，并综合利用多种动画类型。如图1-4所示的娱乐类网站。图1-4 娱乐类Flash网站5．休闲类Flash网站休闲成为了时代的热潮，因此休闲类的网站也接踵而至。这些休闲类的网站大多数都是以轻松活泼、亲近自然为主，用色主要以轻松欢快的颜色为主色调，给人以舒适、放松的感觉，而且网站的整体效果也比较简单，这样即使不进行烦琐的操作也可以找到想要的资料。如图1-5所示的休闲类网站。图1-5 休闲类Flash网站6．餐饮类Flash网站餐饮类的网站主要以暖色调和中性色为主，并且配以美食图片，这样会使浏览者感到一种对美食的渴望，这就是此类网站的目的。对于比较大型的餐饮企业来说，都有自己的品牌，在网站中主要宣传自己的品牌和新研发的产品，以及宣传各种树立自己品牌形象的活动。如图1-6所示的餐饮类网站。图1-6 餐饮类Flash网站1.4 Flash网站的制作流程
要制作一个好的Flash网站，一定要突出以下3个要素：创意、设计、交互。当然，一个良好的网站规划也是相当重要的。Flash网站规划的基本思路是：根据已有的创意，有效地将设计与交互结合起来，设计与交互均为创意服务，同时三者又是相辅相成、紧密统一的。………………………………………………………………………1.4.1 Flash网站结构规划在前面提到一个好的网站除了取决于3个重要的要素外，还取决于一个重要的不可缺少的因素——网站规划。Flash网站规划的基本思路是指根据已有的创意，有效地将设计与交互结合起来，设计与交互均为创意服务，同时三者又是相辅相承、紧密统一的。Flash网站的结构和流程与HTML基本相似，但略有不同。相同的是它们都要有基本元素，如Logo、导航和内容等；不同点是可以通过一定的技术手段使Flash的结构变化万千，例如在表面上看到的Flash页面中可能只有一个Logo，也可能只有一个图形导航而已，但实际上通过鼠标的mouseRollOver和mouseRollOut交互，会将其他元素在变化中呈现出来。1.4.2 Flash网站场景规划为了达到Flash网站的最佳观赏效果，通常在载入Flash内容时都需要一个预载（Loading）过程。可能大家都知道SWF文件本身就是一种流式播放（边下载边播放），但对于当前国内的带宽较小、播放速度较慢的状况来说，制作预载动画还是很有必要的。您可以等动画完全下载完成后再对动画进行播放。同时这也是Flash网站的一个基本流程，如果有片头则先预载Flash 信息片头动画，然后预载主场景；如果没有片头则直接预载主场景。通常情况下主场景中的内容是比较多的，不可能一次将所有的内容载入。一般的原则是当点击相关的链接时，需要的内容才被载入进来。图1-7所示的就是动画的预载动画效果，下载完成后的页面效果如图1-8所示。图1-7 动画预载效果图1-8 动画载入后的效果说到主动画，其实指的是Flash网站的首页面。对于Flash的首页面而言，最关键的往往是页面的结构设置，要有清晰的栏目划分和完美的动画效果，能够给浏览者一个良好的第一印象。图1-9所示的就是场景主动画效果。图1-9 主场景动画效果制作完主页面后，接下来是各栏目的制作，也就是二级页面的制作。首先，所有的二级页面的风格要与主页面保持一致，不要为了追求动画效果而忽略了整个网站的协调。其次是二级页面的出场方式和出场位置，根据不同的网站类型及网络速度，选中不同的出场方式和出场位置。图1-10所示的就是二级栏目动画效果。图1-10 二级栏目动画效果1.4.3 Flash素材准备Flash作品到目前为止还是以矢量素材为主，它具有体积小、任意缩放都不会影响画面质量等特点。但是由于Flash功能的日益成熟，越来越多的色彩丰富的位图图像也加入到Flash动画制作中了，色彩鲜艳的位图图像为Flash动画增色不少，但位图体积过大的问题也影响了动画的下载和播放，所以在Flash动画制作过程中使用位图时，常常会把位图转换为矢量图，以减小位图的体积。下面来介绍将位图转换为矢量图的方法。1．导入位图执行【文件】【新建】命令，弹出“新建文档”对话框，新建一个Flash文档，执行【文件】【导入】【导入到舞台】命令，弹出“导入”对话框，选择需要导入的素材图像文件，如图1-11所示。单击【打开】按钮，即可以将选中的素材图像导入到Flash文档舞台中，如图1-12所示。图1-11 “导入”对话框图1-12 将图像导入到舞台中提示：除了可以将图像素材或其他文件导入到舞台中，还可以执行【文件】【导入】【导入到库】命令，将素材图像或其他文件导入到“库”面板中，再从“库”面板中拖入到场景中进行处理。2．批量导入位图在Flash动画中常常会制作如书本翻动和烟花爆发等效果，如果利用Flash本身的动画制作方法，很难表现得完美。所以常常会使用一系列位图的制作方法。当准备好的位图素材为一系列图像时，并且文件名字都是连接的。执行【文件】【导入】【导入到舞台】命令时，会弹出图1-13所示的提示对话框，单击【是】按钮，则会将相关联的一系列位图全部一次性导入到场景中，并按顺序排列到时间轴上。效果如图1-14所示，时间轴效果如图1-15所示。图1-13 提示对话框图1-14 导入位图素材图1-15 “时间轴”效果3．将位图转换为失量图选中舞台中刚刚导入的位图素材图像，执行【修改】【位图】【转换位图为矢量图】命令，弹出“转换位图为矢量图”对话框，如图1-16所示。采试读结束[说明：试读内容隐藏了图片]