中文版Flash CS6网页动画设计教程第1章.ppt

第1章Flash基础知识本章主要介绍本章主要介绍Flash CS6的一些基础知识，如的一些基础知识，如Flash的功能和特点，工的功能和特点，工作界面及创建作界面及创建Flash文档文档的基本步骤。的基本步骤。21.1Flash与动画Flash CS6是是Adobe公司目前推出的公司目前推出的Flash官方最新版本，是动画制作与特效官方最新版本，是动画制作与特效制作最优秀的软件，使用该软件可以创建制作最优秀的软件，使用该软件可以创建从简单的动画到复杂的交互式从简单的动画到复杂的交互式Web应用程应用程序之间的任何作品。序之间的任何作品。用户可以使用用户可以使用Flash软件，将零散的图片、软件，将零散的图片、声音和视频等元素组合在一起，为其添加声音和视频等元素组合在一起，为其添加各种丰富多彩的特效，制作出属于自己的各种丰富多彩的特效，制作出属于自己的Flash动画。动画。31.1.1Flash简介Adobe Flash Professional CS6为创建数字动画、交互式为创建数字动画、交互式Web站点、桌面应用站点、桌面应用程序以及手机应用程序提供了功能全面的创作和编辑环境。可以在程序以及手机应用程序提供了功能全面的创作和编辑环境。可以在Flash中创建中创建原始内容或者从其他原始内容或者从其他Adobe应用程序应用程序(如如Photoshop或或Illustrator)导入素材，快导入素材，快速设计简单的动画，以及使用速设计简单的动画，以及使用Adobe AcitonScript 3.0开发高级的交互式项目。开发高级的交互式项目。设计人员和开发人员可使用它来创建演示文稿、应用程序和其他允许用户交互设计人员和开发人员可使用它来创建演示文稿、应用程序和其他允许用户交互的内容。的内容。Flash可以制作简单的动画、视频内容、复杂的演示文稿和应用程序以可以制作简单的动画、视频内容、复杂的演示文稿和应用程序以及介于它们之间的任何内容。通常，使用及介于它们之间的任何内容。通常，使用Flash创作的各个内容单元称为应用程创作的各个内容单元称为应用程序，即使它们可能只是很简单的动画片断，也可以通过添加图片、声音、视频序，即使它们可能只是很简单的动画片断，也可以通过添加图片、声音、视频和特殊效果，构建包含丰富媒体的和特殊效果，构建包含丰富媒体的Flash应用程序。应用程序。Flash特别适合创建通过特别适合创建通过Internet提供的内容，因为它的文件非常小。提供的内容，因为它的文件非常小。Flash是通是通过广泛使用矢量图形做到这一点的。与位图图形相比，矢量图形需要的内存和过广泛使用矢量图形做到这一点的。与位图图形相比，矢量图形需要的内存和存储空间小很多，因为它们是以数学公式而不是大型数据集来表示的。位图图存储空间小很多，因为它们是以数学公式而不是大型数据集来表示的。位图图形之所以更大，是因为图像中的每个像素都需要一组单独的数据来表示。形之所以更大，是因为图像中的每个像素都需要一组单独的数据来表示。要在要在Flash中构建应用程序，可以使用中构建应用程序，可以使用Flash绘图工具创建图形，并将其他媒体绘图工具创建图形，并将其他媒体元素导入元素导入Flash文档。然后定义如何以及何时使用各个元素来创建设想中的应用文档。然后定义如何以及何时使用各个元素来创建设想中的应用程序。程序。Flash是一个非常优秀的矢量动画制作软件，它以流式控制技术和矢量技术为核是一个非常优秀的矢量动画制作软件，它以流式控制技术和矢量技术为核心，制作的动画具有短小精悍的特点，所以被广泛应用于网页动画的设计中，心，制作的动画具有短小精悍的特点，所以被广泛应用于网页动画的设计中，成为当前网页动画设计最为流行的软件之一。成为当前网页动画设计最为流行的软件之一。41.1.2动画简介传统的动画是通过把人或物的表情、动作等分段画成传统的动画是通过把人或物的表情、动作等分段画成许多幅画，再用摄影机连续拍摄成一系列画面，然后许多幅画，再用摄影机连续拍摄成一系列画面，然后连续播放这些画面就形成了动画。连续播放这些画面就形成了动画。用用Flash等软件制作的动画属于二维动画，如等软件制作的动画属于二维动画，如七龙珠七龙珠、灌篮高手灌篮高手、小鲤鱼历险记小鲤鱼历险记、喜洋洋与喜洋洋与灰太狼灰太狼等；而三维动画通常是用等；而三维动画通常是用Maya或或3ds max制制作而成的，如作而成的，如功夫熊猫功夫熊猫、玩具总动员玩具总动员、海海底总动员底总动员、玩具之家玩具之家、秦时明月秦时明月、魔比魔比斯环斯环等。等。电脑动画由于应用领域的不同，其动画文件的存储格电脑动画由于应用领域的不同，其动画文件的存储格式也不同，其中式也不同，其中GIF和和SWF是最常用到的动画文件格是最常用到的动画文件格式。下面介绍这两种常用格式。式。下面介绍这两种常用格式。GIF动画格式。SWF动画格式。51.2Flash的功能和特点在在Flash诞生之前，因特网上使用的大多是诞生之前，因特网上使用的大多是GIF动画或动画或Java动画。动画。GIF动画文件的尺寸较大，动画文件的尺寸较大，Java动画则要动画则要求制作者具有较高的编程能力。而求制作者具有较高的编程能力。而Adobe公司推出的公司推出的Flash软件则提供了创作网络动画的新途径。软件则提供了创作网络动画的新途径。目前，许多网站都采用目前，许多网站都采用Flash技术来制作网页动画，许技术来制作网页动画，许多电视广告、电脑游戏的片头和片尾也都使用多电视广告、电脑游戏的片头和片尾也都使用Flash软软件来制作。件来制作。Flash软件还广泛应用于交互式软件开发、软件还广泛应用于交互式软件开发、产品展示以及教学等方面。产品展示以及教学等方面。Flash软件可以直接输出软件可以直接输出Windows可执行文件可执行文件(.exe格格式式)，还可以制作出精致的，还可以制作出精致的Flash游戏。使用游戏。使用Flash插插件，能把件，能把Flash动画直接嵌入动画直接嵌入Visual Basic、Visual C+所生成的所生成的Windows可执行文件中。在专业的多媒可执行文件中。在专业的多媒体制作软件体制作软件Authorware和和Director中，也可以导入中，也可以导入Flash动画。动画。61.2.1Flash的优点Flash是一款非常优秀的矢量动画制作软是一款非常优秀的矢量动画制作软件，之所以被许多人广泛使用，是由于其件，之所以被许多人广泛使用，是由于其具有以下优点。具有以下优点。(1)文件体积小。(2)Flash动画是一种流式动画。(3)支持插件播放。(4)支持事件响应和交互功能。(5)可以输出多种格式的文件。(6)创建和编辑Flash动画的方法简单易学。71.2.2FlashCS6的新增功能Flash CS6 主要的新增功能如下。主要的新增功能如下。(1)设计出充满表现力的内容。(2)HTML的新支持。(3)生成Sprite表单。(4)锁定3D场景。(5)高级绘制工具。(6)行业领先的动画工具。(7)高级文本引擎。(8)CreativeSuite集成。(9)专业视频工具。(10)滤镜和混合效果。(11)基于对象的动画。(12)3D转换。(13)创建一次，即可随处部署。(14)广泛的平台和设备支持。(15)高效的移动设备开发流程。(16)创建预先封装的AdobeAIR应用程序。(17)在调整舞台大小时缩放内容。81.3Flash动画的学习方法在学习在学习Flash动画的制作过程中，有很多人都认为动画的制作过程中，有很多人都认为Flash动画很不好学，其实，动画很不好学，其实，Flash属于一款简单易学属于一款简单易学的动画设计软件，任何人都可以轻松上手，只是很多的动画设计软件，任何人都可以轻松上手，只是很多人在学习的时候没有掌握好要领。在这里，为大家推人在学习的时候没有掌握好要领。在这里，为大家推荐一套学习荐一套学习Flash动画的方法。动画的方法。(1)首先认识Flash动画的应用范围，确定自己学习Flash动画的方向。(2)掌握绘制与编辑图形的方法。(3)系统掌握与Flash有关的基础知识。(4)掌握各类Flash动画的制作原理。(5)多看、多练、多思考。多看一些别人制作好的作品，再自己实际动手做一做。另外，还需要掌握一些美术与音频、视频处理的相关另外，还需要掌握一些美术与音频、视频处理的相关知识。知识。91.4熟悉FlashCS6的工作界面成功启动成功启动Flash CS6后便会进入后便会进入初始用户界面，如图初始用户界面，如图1-1所示。所示。在在“开始页开始页”界面可以打开最近界面可以打开最近使用过的项目或者打开保存在本使用过的项目或者打开保存在本地磁盘等地的项目，也可以创建地磁盘等地的项目，也可以创建新的项目。另外，新的项目。另外，Flash CS6还还提供了非常多的模板，可以通过提供了非常多的模板，可以通过模板创建项目。如图模板创建项目。如图1-2所示为所示为Flash CS6的工作界面，主要包的工作界面，主要包括标题栏、菜单栏、主工具栏、括标题栏、菜单栏、主工具栏、工具箱、场景和舞台、时间轴面工具箱、场景和舞台、时间轴面板、属性面板及多个控制面板。板、属性面板及多个控制面板。101.4.1标题栏Flash CS6的标题栏右侧有的标题栏右侧有“搜索搜索”栏及栏及最小化、还原最小化、还原最大化、关闭按钮，如图最大化、关闭按钮，如图1-3所示。所示。在在“搜索搜索”栏可以输入要搜索的文件，使栏可以输入要搜索的文件，使用最小化、还原用最小化、还原最大化、关闭按钮可以最大化、关闭按钮可以实现窗口的最小化、还原实现窗口的最小化、还原最大化、关闭最大化、关闭操作。操作。111.4.2菜单栏Flash CS6的菜单栏中包括的菜单栏中包括11项菜单，它们是项菜单，它们是文件菜单、编辑菜单、视图菜单、插入菜单、文件菜单、编辑菜单、视图菜单、插入菜单、修改菜单、文本菜单、命令菜单、控制菜单、修改菜单、文本菜单、命令菜单、控制菜单、调试菜单、窗口菜单和帮助菜单，如图调试菜单、窗口菜单和帮助菜单，如图1-4所示。所示。这些菜单集中了制作这些菜单集中了制作Flash动画的大部分操作命动画的大部分操作命令。令。121.4.3主工具栏Flash将一些常用菜单命令以图标按钮的形式组将一些常用菜单命令以图标按钮的形式组织在一起，放置在主工具栏中。当鼠标指向某织在一起，放置在主工具栏中。当鼠标指向某个图标按钮时，在其下方会出现该按钮的功能个图标按钮时，在其下方会出现该按钮的功能说明，通过单击按钮即可执行相应的命令，如说明，通过单击按钮即可执行相应的命令，如图图1-5所示。主工具栏通常位于界面顶部，可以所示。主工具栏通常位于界面顶部，可以通过选择通过选择“窗口窗口”|“工具栏工具栏”|“主工具栏主工具栏”菜单来显示或隐藏，还可以通过拖动按钮外的菜单来显示或隐藏，还可以通过拖动按钮外的空白区域来改变主工具栏的位置。空白区域来改变主工具栏的位置。如图如图1-5所示。所示。131.4.4工具箱在默认状态下，工具箱位于在默认状态下，工具箱位于Flash CS6工工作界面的左侧，可以使用鼠标拖动来改变作界面的左侧，可以使用鼠标拖动来改变它的位置。如图它的位置。如图1-6所示，工具箱中的工具所示，工具箱中的工具又可分为以下又可分为以下4部分。部分。“工具工具”区域：包含绘图、填充、编辑工区域：包含绘图、填充、编辑工具。具。“查看查看”区域：包含区域：包含“缩放缩放”和和“手形手形”工具，它们是在应用程序窗口内进行缩放工具，它们是在应用程序窗口内进行缩放和移动的工具。和移动的工具。“颜色颜色”区域：用于设置笔触颜色和填充区域：用于设置笔触颜色和填充颜色。颜色。“选项选项”区域：显示当前所选工具的功能区域：显示当前所选工具的功能和属性。和属性。141.4.5时间轴面板时间轴面板包括两部分，即图层区域时间轴面板包括两部分，即图层区域和时间线区域，如图和时间线区域，如图1-7所示，用于管所示，用于管理动画中的图层和帧。通过选择理动画中的图层和帧。通过选择“窗窗口口”|“时间轴时间轴”菜单，可以显示或隐菜单，可以显示或隐藏时间轴面板。藏时间轴面板。151.4.6场景与舞台在当前界面中，用于设置动画内在当前界面中，用于设置动画内容的整个区域称为容的整个区域称为“场景场景”。但最。但最终动画会显示场景中矩形区域内的终动画会显示场景中矩形区域内的内容，这个区域被称为内容，这个区域被称为“舞台舞台”。舞台之外的灰色区域则称为舞台之外的灰色区域则称为“工作工作区区”。场景是对影片中各对象进行。场景是对影片中各对象进行编辑、修改的场所。编辑、修改的场所。161.4.7属性面板属性面板根据当前选定内容的不同，属性面板根据当前选定内容的不同，可以显示当前文档、文本、元件、可以显示当前文档、文本、元件、形状、位图、视频、群组、帧或工形状、位图、视频、群组、帧或工具的信息和设置。当选定了两个或具的信息和设置。当选定了两个或多个不同类型的对象时，它会显示多个不同类型的对象时，它会显示选定对象的总数。属性面板会根据选定对象的总数。属性面板会根据用户选择对象的不同而变化，以反用户选择对象的不同而变化，以反映当前对象的各种属性，如图映当前对象的各种属性，如图1-8所示。所示。可以查看舞台或时间轴上当前选定可以查看舞台或时间轴上当前选定项的常用属性，并对对象的相应属项的常用属性，并对对象的相应属性进行设置。通过性进行设置。通过“窗口窗口”|“属属性性”菜单可以实现属性面板的显示菜单可以实现属性面板的显示或隐藏操作。或隐藏操作。171.4.8浮动控制面板浮动控制面板位于工作界面的右侧，它们浮动控制面板位于工作界面的右侧，它们可以单独拖动出来，还可以收缩起来，以可以单独拖动出来，还可以收缩起来，以节省屏幕的空间。节省屏幕的空间。浮动控制面板可以帮助用户预览、组织和浮动控制面板可以帮助用户预览、组织和改变文档中的元素，利用面板中的可用选改变文档中的元素，利用面板中的可用选项可控制元件、实例、颜色、文字、帧及项可控制元件、实例、颜色、文字、帧及其他元素的特征。通过其他元素的特征。通过“窗口窗口”菜单的下菜单的下拉列表中可以显示或隐藏需要的面板。拉列表中可以显示或隐藏需要的面板。181.5Flash文档在在Flash中，可以创建新文档中，可以创建新文档或打开以前保存的文档，并可或打开以前保存的文档，并可以使用以使用“属性属性”面板或在面板或在“文文档属性档属性”对话框中来设置新文对话框中来设置新文档或现有文档的大小、帧频、档或现有文档的大小、帧频、背景颜色和其他属性。背景颜色和其他属性。191.5.1创建Flash文档创建文档的方式有以下几种。创建文档的方式有以下几种。使用“开始”页创建新文档。使用“文件”|“新建”菜单命令，打开“新建文档”对话框，在“常规”选项卡上选择各种不同的Flash文档类型，然后单击“确定”按钮。单击主工具栏中的“新建”按钮，可以创建新的Flash文档。201.5.2打开Flash文档打开打开Flash文档的方式有以下几种。文档的方式有以下几种。使用“开始”页打开Flash文档。使用“文件”|“打开”菜单命令，打开“打开”对话框，在打开对话框中定位文件所在的路径并选择文件，然后单击“打开”按钮。单击主工具栏中的“打开”按钮，打开“打开”对话框，在打开对话框中定位文件所在的路径并选择文件，然后单击“打开”按钮。211.5.3设置文档属性创建新文档或打开现有文档后，可以创建新文档或打开现有文档后，可以根据需要设置或修改文档的相关属性。根据需要设置或修改文档的相关属性。文档的属性包括大小文档的属性包括大小(尺寸尺寸)、背景颜、背景颜色、帧频等。色、帧频等。设置文档属性的方式如下。设置文档属性的方式如下。使用“属性”面板设置文档属性。右击舞台或工作区，在弹出的快捷菜单中设置文档属性。221.5.4保存Flash文档Flash文档创建完成后，文档创建完成后，就可以将它保存，通过就可以将它保存，通过“文件文件”|“保存保存”菜单命菜单命令或者令或者“文件文件”|“另存另存为为”菜单命令都可以进行菜单命令都可以进行保存。保存。231.6本章实例新建名为“第一章示例”的Flash文档1主要目的练习新建Flash文档，并更改文档属性设置，最后完成文档的保存操作。本例新建“第一章示例”文档，将其文档大小设置为300像素100像素，背景颜色设置为红色。2上机准备(1)熟练掌握新建Flash文档的操作。(2)掌握文档属性的设置方法。(3)掌握文档的保存方法。241.6本章实例新建名为“第一章示例”的Flash文档3操作步骤最终的效果如图1-22所示。251.7课后练习1.选择题2.填空题3.上机操作题参见教材P1626