网页设计与制作 (4)

单击此处编辑母版标题样式,*,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,Flash,1,第,5,章,动画制作软件,Flash,网页作为一种新兴的媒体，正成为当今人们获取信息的重要方式。随着网络技术的发展，单调的页面及布局已经能做得像其他媒体一样丰富多彩了。就目前而言，要想改变静态页面呆板的面貌，并且突破网络传输速度的限制，相信每一个网络设计人员都会说，使用,Flash。,的确，目前,Flash,在网络设计上的应用正像它的名字一样光彩照人、势不可挡。,2,第,5,章,动画制作软件,Flash,5.1,Flash MX,概述,5.2,Flash,基本操作,5.3 图形操作,5.4 动画制作,5.5 声音处理,5.6 动画的交互控制,5.7 使用组件,5.8 优化和发布,5.9 综合实例,思考与练习,3,5.1,Flash MX,概述,Flash,是由美国,Macromedia,公司出品的一款矢量图形编辑和动画制作软件。因为这款软件在基于矢量图形压缩方面有着惊人的能力，并且可以在,Web,上发布，所以很快便在互联网世界中流行起来。用户除了可以利用它制作普通动画外，还可以在动画中加入背景音乐。更重要的是，用户还可以利用它制作交互动画及动态网页。,4,5.1.1,Flash MX,的,功能特点,导入功能的扩展。,Flash MX,可以非常容易地通过导入功能将,AVI、MPEG,或,GIF,等视频文件导入到,Flash,文件中，还可导入,Flash,发布后的,SWF,文件。, 工具箱中新增加了两个工具。自由转换工具，可以对绘制内容进行任意的缩放或旋转等变化；填充转换工具，主要用来调整填充颜色。,图层可做成文件夹。在时间轴中，新增了图层文件夹，使得管理图层更加方便。,5,5.1.1,Flash MX,的,功能特点, 利用文本工具设定超级链接。在,Flash MX,中可以直接通过文本工具设定超级链接，这与设计网页时的操作一样简单。, 增强了,Actions,编辑器的功能。改进的,ActionScript（,动作脚本）编辑面板使得用户可以方便地访问、查找所有的（包括潜在的）动作语句。, 新增了属性面板。,Flash MX,进一步向面向对象的技术靠拢，提供了独立的属性面板。,支持组件功能。组件是面向对象技术的一个重要特征，,Flash MX,开始支持组件。,6,5.1.2,动画知识简介,7,与我们平时看到的电影和录像一样，,Flash,动画也是基于帧构成的，也就是通过若干个静止的画面连续播放来产生动作效果，我们把这些静止的画面称为帧。通常的电脑动画大部分都是基于这种原理来创建的。对于这种以帧的连续播放产生的电影，一般来说，每一秒钟的电影至少包含,24,帧，或者更多，而且帧数越多，电影画面就越连贯。例如我们看的电视每秒钟包含,25,帧。为了降低网络流量，,Flash,通常将动画一秒钟播放的帧数设置为,12,。如果就以每秒钟,12,帧来计算，要生成,1,小时的,Flash,动画，它将包含,43200,帧。如果对每一帧的画面都进,8,行绘制，那将是不现实的。于是在设计,Flash,动画时，引进了关键帧这个概念。所谓关键帧,就是指用来描述动画中关键画面的帧。在制作,Flash,动画时，只要将动画中的关键帧画面制,作好后，两个关键帧之间的各帧则可以通过插值的方法来自动产生，这将大大提高动画制作的效率，同时也大大减少了动画中的冗余数据。有时一个帧中的内容非常复杂，为了减少每一帧中内容的复杂程度，,Flash,又引入了图层的概念，我们可以将帧中复杂的内容分别绘制到不同的图层，以减少每一帧动画的复杂程度。,Flash,就这样将时间线、帧和图层分别用在横纵结构上以构成动画。,9,选择“开始,程序,MacromediaMacromedia Flash MX,”,菜单选项，启动,Flash MX,应用程序，打开的程序窗口，布局如图,5-1,所示。在,Flash MX,程序窗口中，根据功能的不同，可以将,Flash MX,的操作界面分成,7,个部分，它们分别是菜单栏、工具栏、工具箱、属性面板、面板容器、时间线和动画设计窗体。,5.1.3,Flash MX,工作界面,10,图,11, 5.2.1,参数设置, 5.2.2,文件的建立、保存, 5.2.3,时间轴的操作, 5.2.4,场景操作, 5.2.5,动画播放,5.2,Flash,基本操作,12,Flash,允许用户根据需要设置常用参数，如设置应用程序的常规操作、编辑操作和剪贴板操作等。,选择“编辑,参数选择”菜单选项，打开“参数选择”对话框，可对常用参数进行设置，如图,5-2,所示。,5.2.1,参数设置,13,图,14,1.,文件的建立,选择“文件,新建”菜单选项，就可以新建一个,Flash,文件。,2.,文件的保存,Flash,电影创建完成后，可以将其保存为当前使用的名称或所在位置，也可以保存为其他的名称或位置。,选择“文件,保存”菜单选项，使用当前文件名保存当前文件。,如果选择“另存为”命令，或文件从来没有保存过，这时候将打开,Save As,（,另存为）对话框，如图,5-3,所示。选择文件存储位置并输入文件名，单击保存按钮即可。,5.2.2 文件的建立、保存,15,图,16,时间轴的组成部分有帧、层和播放指针，如图,5-4,所示。时间轴用于组织动画各帧的内容，并可以控制动画每帧每层的显示内容，还可以显示动画播放的速率等信息。单击“帧视图”按钮，在弹出的下拉菜单中包含许多对帧的操作。,5.2.3 时间轴的操作,17,一个动画可能包含多个场景，使用场景可以更好地组织动画。场景的顺序和动画的播放顺序有关。一个场景就好象话剧中的一幕，一个出色的,Flash,动画就是由这一幕幕场景组成的。,有关场景的基本操作，包括场景的切换、添加、删除及调整顺序等，全部都可以在场景面板中进行，如图,5-5,所示。,也可利用场景右上角的“编辑场景”按钮或查看、插入菜单的有关菜单选项对场景进行部分操作。,5.2.4 场景操作,18,图,19,要播放当前的场景，可以选择“控制,播放”菜单选项或选择“窗口,工具栏,控制栏”菜单选项，打开“控制器”，然后单击“播放”按钮。,5.2.5 动画播放,20, 5.3.1,图形的复制与删除, 5.3.2,图形的层次顺序, 5.3.3,网格的使用, 5.3.4,组合与分离操作, 5.3.5,图形的显示模式, 5.5.6,图形变形, 5.3.7,使用位图,5.3 图形操作,21,1.,复制图形,在场景中选中图形后，选择“编辑,拷贝”菜单选项，可以将选中的图形复制到,Windows,剪贴板上。这时，如果选择“编辑,粘贴”菜单选项，复制的图形将被粘贴到场景中心。选择“编辑,粘贴到当前位置”菜单选项，复制的图形将原位粘贴到场景中。,2.,删除图形,选中场景中要删除的图形，然后选择“编辑,/,清除”菜单选项或选择“编辑,/,剪切”菜单选项即可删除图形。,5.3.1,图形的复制与删除,22,在,Flash,中创建图形对象时，创建对象的次序与对象的位置是有关系的。同一层上的对象，后创建的对象处于先创建对象的上面，即最先创建的对象位于其他对象的下面。对象的层次顺序决定对象覆盖时的显示方式。,执行“修改,排序”菜单选项，可以对当前活动图层中所选定的对象进行层次顺序的调整。,置于顶层：,将选中的对象移动到当前图层中所有对象的最上方。,上移一层：,将选中的对象在当前图层向上移动一级。,下移一层：,将选中的对象在当前图层向下移动一级。,置于底层：,将选中的对象移动到当前图层中所有对象的最下方。,5.3.2 图形的层次顺序,23,若在绘图时使用格线，可以准确定位对象。要显示或隐藏格线，可以通过“查看,网格”下的选项来设置。还可以通过“编辑网格”子命令来打开“网格”对话框，以便设置格线的颜色、对齐网格的精确度以及是否显示格线。图,5-6,所示为网格设置对话框。,5.3.3 网格的使用,24,1.,群组对象,所谓群组对象，就是将两个以上的对象组合成单个对象，以便于移动、缩放及旋转等操作。,若要群组对象，只要选中了所有要群组的对象，然后选择“修改,群组”菜单选项或者按快捷键“,Ctrl+G,”,即可。,2.,分解对象,分解对象可以将群组对象、文字对象、组件或点阵图分离成线条与填色区块，以后可以使用“墨水瓶”工具与“颜料桶”工具来编辑这些对象。,选取对象后，只要执行“修改,分解组件”命令，或者按快捷“,Ctrl+B,”,即可分解对象。,5.3.4 组合与分离操作,25,Flash MX,提供了,4,种图形显示模式，可以从查看下拉菜单中选择。,外边框模式只显示对象的外框，因此显示速度快。,高速显示模式会显示对象的框线与填充色，但不提供去锯齿功能，因此显示的品质较为粗糙，但显示速度快。,清除锯齿模式显示质量比较好，但速度稍慢些。,清除文字锯齿模式显示质量最好，但在这,4,种模式中，显示速度最慢。,5.3.5 图形的显示模式,26,图形变形包括图形的缩放、旋转、倾斜和翻转等。,1.,对图形进行缩放,（,1,）首先，选取要进行处理的图形。,（,2,）单击“工具箱”中的“自由转换”工具按钮，此时在图形的四周出现,8,个小黑方块。,（,3,）将鼠标放在图形四周的,8,个小黑方块上，当鼠标出现双箭头状时，拖动鼠标即可对图形进行缩放操作，如图,5-7,所示。,5.3.6 图形变形,27,（,1,）首先，我们选取要进行处理的图形。,（,2,）单击“工具箱”中的“自由转换”工具按钮，此时在图形的四周出现,8,个小黑方块。,（,3,）将鼠标指针移到图形的,4,个角落的任意一个小黑方块上，当鼠标变成状时，按住鼠标左键不放进行拖动，即可旋转图形，如图,5-8,所示。,2.,对图形进行旋转,28,（,1,）首先，我们选取要进行处理的图形。,（,2,）单击“工具箱”中的“自由转换”工具按钮，此时在图形的四周出现,8,个小黑方块。,（,3,）将鼠标指针移到,4,个边的边线上，当鼠标指针变成双箭头状时，按住鼠标不放进行拖动，则可以将图形进行倾斜，其效果如图,5-9,所示。,3.,对图形进行倾斜,29,（,1,）首先，我们选取要进行处理的图形。,（,2,）选择“修改,转换,垂直翻转”菜单选项，即可将图形进行垂直翻转，如图,5-10,所示。,（3）选择“修改转换水平翻转”菜单选项，即可将图形进行水平翻转。,4.,对图形进行翻转,30,1.,打碎位图,输入到,Flash,中的图像，经过打碎后生成多个独立的填充区域和线条，可以使用,Flash,中的绘图工具或填充工具对它进行修改。打碎图像的步骤如下：,（,1,）首先要导入一张位图。,（,2,）选择“修改,分解组件”菜单选项，即可将位图打碎。,2.,将位图转换成矢量图,Flash MX,允许从外部导入多种图形格式，并可将其转换为矢量图，其具体操作步骤如下：,（,1,）首先要导入一张位图。,（,2,）选定位图后，执行“修改,描绘位图”命令，此时会出现如图,5-11,所示的对话框。,（,3,）可以调整各参数，最后单击“确定”按钮即可。,5.3.7 使用位图,31,32,在,Flash MX,中可以创建丰富多彩的动画效果，可使一个对象在场景上穿梭运动、放大或缩小、旋转、变色、淡入或淡出以及改变形状等。这些改变可以单独发生，也可以组合发生。,5.4,动画制作,33,5.4.1,使用元件库,5.4.2,图层操作,5.4.3,帧的使用,5.4.4,逐帧动画,5.4.5,动作渐变式动画,5.4.6,形状渐变式动画,5.4.7,淡出淡入式动画,5.4.8,编辑动画,5.4,动画制作,34,5.4.1,使用元件库,Flash,中的元件包括3种，即图形元件、按钮元件和影片剪辑元件。,1. 使用元件,在动画中使用元件可以简化影片的编辑，缩减影片文件的尺寸，方便制作运动类型的过渡动画，加快影片的播放速度。下面说明元件的使用方法：,35, 选择“窗口共享库,Buttons”,菜单选项，打开共享按钮库，通过双击目录名可以展开该目录下的内容，当单击任意一个按钮元件时，在预览窗口中将观察到它的效果，如图5-12所示。 选择“窗口共享库,Learning Interactions”,菜单选项，打开共享学习交互库，在该库中，多是影片剪辑元件，是,Flash,提供的、已经设计好的、用于人机交互的一些表单元件，如图5-13所示。,36, 选择“窗口共享库,Sounds”,菜单选项，打开共享声音库，单击任意一个声音元件时，在预览窗口中观察到它的波形效果，并可单击按钮播放声音，如图5-14所示。,在元件预览窗口中用鼠标将其拖放到场景中，它们就成为实例。,37,2. 新建元件,（1）将场景中的元素转换成元件在场景中，选中的任何图形对象都可以被转换成元件。其操作步骤为： 选取工具箱中的箭头工具，在场景中选中要转换为元件的图形元素。 选择“插入转换为元件”菜单选项，打开“转换为元件”对话框，如图5-15所示。,38, 选中需要转换的元件类型，然后单击“确定”按钮，这时选中的元素将被转换成了元件。如果选择“窗口库”菜单选项，在打开的元件库中将显示被转换成的元件。,（,2,）创建新元件,创建新元件是指直接创建一个空白元件，然后进入元件编辑模式创建和编辑元件内容。其操作步骤为：,选择“插入,新建元件”菜单选项，打开“创建新元件”对话框，如图,5-16,所示。,39,在“名称”编辑框中输入元件名称，在“作用”选项区中选择所要创建的元件类型，然后单击“确定”按钮，工作区会自动从影片编辑模式转换为元件编辑模式。这时元件名称将显示在舞台的左上角，工作区中心位置会出现元件的注册点，以“,+,”号表示。,选取工具箱中的绘图工具，在工作区中制作元件。制作完毕后，单击窗口左上角的“场景,1,”按钮，切换到场景编辑模式，打开元件库，可以看到新增加的元件。,3. 创建按钮元件,按钮是元件的一种重要类型，当使用鼠标与其交互时，它会显示出不同的外观。,40,在,Flash MX,中，按钮有,4,种状态，每种状态都有特定的名称与之对应，它们可以在时间轴窗口中进行定义，这,4,种状态分别是：,UP（,弹起状态）、鼠标经过（触摸状态）、,DOWN（,按下状态）和反应区（点击状态）。下面通过一个实例来说明创建按钮元件的方法，其操作步骤如下：（1）选择“文件新建”菜单选项，创建一个新文件。（2）选择“插入新建元件”菜单选项，在打开的“创建新元件”对话框中设置创建的元件名称和类型。,41,（,3,）单击“确定”按钮，进入按钮元件编辑模式，在时间轴窗口中可以看到已有,4,帧：,UP,、,鼠标经过、,DOWN,和反应区，如图,5-17,所示。,42,（4）单击时间轴窗口中的,UP,帧，并选取工具箱中的椭圆工具，以按钮注册点为中心，按下,Shift,键的同时绘制一个红色填充圆，如图5-18所示。（5）在“鼠标经过”帧上单击鼠标右键，从弹出的快捷菜单中选择“插入白色关键帧”选项，插入一个空白关键帧。（6）单击时间轴窗口中的“洋葱皮”按钮，使,UP,帧以较淡的形式显示出来。（7）选取工具箱中的椭圆工具，再绘制一个绿色渐变圆，并将绘制的圆稍微偏移注册点，如图5-19所示。,43,（,8,）在,DOWN,帧上单击鼠标右键，从弹出的快捷菜单中选择“插入白色关键帧”选项，插入一个空白关键帧。,（,9,）选取工具箱中的椭圆工具，再以注册点为中心绘制一个红色渐变圆，如图,5-20,所示。,44,（,10,）选择“编辑,编辑影片”菜单选项，回到场景中。,（,11,）选择“窗口,库”菜单选项，打开元件库，选中制作的按钮元件，并将其从预览窗口中拖放到场景中，创建它的一个实例。,4. 创建动态元件,影片剪辑就好像一小段事先做好的影片，然后我们可以在舞台上调用它。它有一个独立于舞台中主时间轴的自己的时间轴。使用影片剪辑就可以实现组合的动画效果。下面我们通过实例来说明影片剪辑元件的制作过程，具体操作步骤如下：,45,（1）单击“文件”菜单中的“新建”命令，创建一个新的文件。,（,2,）单击“插入”菜单中的“创建新元件”命令，在弹出的“创建新元件”对话框中设定元件名称为,Bird,，,设定元件作用为“影片剪辑”，如图,5-21,所示。完成后单击“确定”按钮，,Flash,将进入元件编辑模式。,46,（3）在影片剪辑元件的第2帧使用快捷键,F6,插入关键帧，然后分别在第1帧和第2帧中绘制小鸟飞行的两个动作，如图5-22、图5-23所示。,47,（,4,）单击工作区左上角的标签“场景,1,”切换到场景,1,，然后单击“窗口”菜单中的“库”命令，打开库面板，将元件,Bird,拖动到舞台中，创建它的一个实例。,48,5.4.2,图层操作,Flash,提供的图层操作除了一般的可见性操作、锁定操作和隐藏操作外，还提供了两种特殊的图层：运动向导层和遮罩层。这两种图层提供了一般图层所不具有的属性和功能。,1. 图层的创建和删除,创建和删除图层既可通过菜单命令进行操作，也可通过时间线面板左下方的图形按钮进行操作。在时间线面板的左下方有4个图形按钮，如图5-24所示。,49,4,个按钮的作用分别为：插入新图层、新建运动向导层、插入层文件夹和删除图层。,2.,图层的选择和拷贝,Flash MX,中没有提供图层拷贝的功能，当我们希望获得两个内容完全相同的图层时，可以使用“复制帧”命令解决问题。操作步骤如下：,（,1,）单击“图层,1,”的名称，以选择“图层,1,”中的全部内容。,（,2,）单击“编辑”菜单中的“复制帧”命令，将“图层,1,”中的内容拷贝到剪贴板中。,（,3,）单击空白图层“图层,2,”的名称，使其成为当前的活动图层。,（,4,）单击“编辑”菜单中的“粘贴帧”命令，这样就将剪贴板中的内容拷贝到“图层,2,”中去了。,50,3.,图层的锁定与解除,当在一个或多个图层上已经完成了许多工作，而这些内容在短时间内又不需要调整时，那么可以将这一个或多个图层锁定，以免因误操作而导致辛苦的工作付诸东流。,图层锁定与解除的方法如下：,只要在时间线面板上单击按钮下方每一个图层中的小圆点或按钮即可锁定或解锁相应的图层。如果只是单击按钮，那么可以锁定或解锁全部图层。图层被锁定以后，小圆点会变成形状。如图,5-25,所示，“层,1,”和“层,2,”是被锁定的图层，“层,3,”是没有被锁定的图层。,51,4.,改变图层的次序,图层被创建以后，您可以通过改变图层上下次序来改变图层的可见性，在上面的图层会遮挡住下面的图层。改变图层的次序只需在时间线面板中拖动图层到希望的位置即可。,5.,图层的隐藏与显示,为了设计简单明了，可以隐藏掉设计中的一个、多个或所有图层。单击时间线面板中按钮下方每一个图层中的小圆点或图标即可隐藏或显示相应的图层。如果只单击按钮，那么可以隐藏或显示所有的图层。图层被隐藏以后，在按钮下方的圆点会变成形状。图,5-26,所示是单击按钮后隐藏掉所有图层的样子。,52,6.,运动向导层,在,Flash,动画设计过程中，运动向导层的主要功能是用来绘制物体运动的路径。在制作以元件为对象并沿着路径运动的动画中，运动向导层的应用是最为普遍、也是最好的方法。其实例操作可参见“,5.4.5,动作渐变式动画”。,7.,遮罩层,遮罩层就好像是一块不透明的布，它可以将自己下面的图层挡住，只有在遮罩层的填充色下，才可以看到下面的图层，而遮罩层中的填充颜色是不可见的。其实例操作可参见“,5.9,综合实例”。,53,5.4.3 帧的使用,关键帧在制作动画的过程中是非常重要的，它用于定义动画中对象的变化。只有定义了关键帧，才可能定义动画中每一个图像。关键帧可以是一个过程的起始或终结，还可以是另一个过程的开始。,在创建逐帧动画时，每一帧都是关键帧。在过渡动画中，只要在重要的地方定义关键帧，,Flash MX,会自动创建关键帧之间的内容。,1.,创建帧,要在时间线中添加关键帧，可以通过,3,种方法实现。,在时间线面板中选择一个关键帧的位置，然后单击“插入”菜单中的“插入关键帧”命令。,54,在时间线面板中要插入关键帧的位置右击，在弹出的快捷菜单中单击“插入关键帧”命令。,在时间线面板中选择一个关键帧的位置，然后按快捷键,F6,。,2.,复制帧,在制作动画时，为了方便操作，有时需要复制一些帧。其操作步骤如下：,选定需要拷贝的帧，可以是一个帧，也可以是多个帧，然后单击鼠标右键，从弹出的快捷菜单中选择“拷贝帧”选项，需要拷贝的帧就复制到了剪帖板上。,选择要粘贴帧的位置，然后单击鼠标右键，从弹出的快捷菜单中选择“粘帖帧”选项，这样就完成了复制帧的工作。,55,3.,翻转帧,翻转帧功能可以将选定的一组帧按照顺序翻转过来，最后一个帧变为第一个帧，第一个帧成为最后一个帧，播放顺序也刚好掉转。其操作步骤如下：,要选择所有图层上的所有帧，可以在任意帧上单击鼠标右键，然后从弹出的快捷菜单上选择“全部选择”选项；要选择某一图层上的所有帧，可以单击图层名称；要选择某一段帧，可以先单击所需选取的第,1,帧，然后按下,Shift,键单击所需选取的最后一帧。,在被选帧上单击鼠标右键，从弹出的快捷菜单中选择“翻转帧”选项，这时，所选定的帧就被翻转了。,56,5.4.4 逐帧动画,逐帧,动画是最传统的动画创建形式，也是,Flash,动画的一个重要类型。逐,帧,动画适用于非常复杂的动画，它的每一帧都是关键帧，每一帧都由制作者确定，而不是由,Flash,通过计算得到关键帧。与过渡动画相比，逐,帧,动画的体积较大。,下面通过一个实例来介绍创建逐帧动画的方法。其步骤如下：,（,1,）选择“文件,新建”菜单选项，新建一个影片。,（,2,）选取工具箱中的文本工具，然后在“属性”面板中设置文字大小为,150,，颜色为红色。,57,（,3,）在场景中单击鼠标，并输入文字,F,，,如图,6-27,所示。,（,4,）单击第,2,帧，然后选择“插入,关键帧”菜单选项，插入一个关键帧，并输入文字,L,，,如图,5-28,所示。,（,5,）重复步骤(,4,)，输入其他的文字，如,A,、,S,、,H,，,第,5,帧的结果如图,5-29,所示。,（,6,）选择“控制,测试影片”菜单选项测试影片播放效果，如图,5-30,所示为影片中的一帧。,58,5.4.5 动作渐变式动画,动作渐变动画是在影视、卡通动画作品中最常用的一种动画形式，在使用组合、元件和可编辑文本等对象进行动画制作时经常要用到。动作渐变主要用于将对象从一个地方移动到另一个地方，也可以用于制作缩放、扭曲或旋转对象的动画，或用于制作元件的颜色和透明度的动画。,制作动作渐变动画，只需要制作好若干关键帧的画面，其余中间各帧由计算机自动生成。,下面通过一个实例来介绍创建动作渐变动画的方法。其步骤如下：,（,1,）单击“文件”菜单中的“新建”命令，创建一个新的文件。,59,（,5,）在工作区中拖动元件,Bird,的实例，将实例的中心点和运动向导层中曲线的起点对齐，如图,5-33,所示。,（,2,）单击时间线面板左下方的按钮，创建一个运动向导层。,（,3,）在新建的运动向导层中使用铅笔工具绘制一条曲线，这条曲线将作为小鸟飞翔的路径，如图,5-31,所示。,（,4,）选中图层“层,1,”，将“,5.4.1,使用元件库”,“,4.,创建动态元件”中创建的影片剪辑元件“,Bird,”,拖曳到工作区中，如图,5-32,所示。,60,（,6,）在时间线面板中同时选中图层“层,1,”和运动向导层的第,20,帧，并使用快捷键,F6,在这里插入关键帧。然后拖动元件,Bird,的实例，将实例的中点和运动向导层中曲线的终点对齐，如图,5-34,所示。,（,7,）选中图层“层,1,”的第,1,帧，然后在属性面板中的“中间”下拉列表框中选择“移动”，设置完成后如图,5-35,所示。,（,8,）单击“控制”菜单中的“测试影片”命令，对影片进行测试，可以发现，在运动向导中绘制的曲线是不可见的，而元件,Bird,的实例仍然按照这条曲线的路径在运动，如图,5-36,所示。,61,5.4.6 形状渐变式动画,形状渐变动画也称形变动画，用户只需要创建关键帧上的不同形状的对象，就可以设置形变动画了。,需要注意的是形变动画中的关键帧上的对象不能是元件、组合对象和位图。所以对于各关键帧中创建的对象，除了直接在工作区中绘制的图形外，如果是使用别的元件在场景中创建形变动画，一定要将元件对象打散。,下面通过一个实例来介绍创建形状渐变动画的方法。其步骤如下：,（,1,）选择“文件,新建”菜单选项，新建一个影片。,（,2,）选择“修改,影片”菜单选项，打开影片“属性”对话框，设定动画尺寸为,500,px,400,px,，,背景颜色,62,为浅黄色（,#,FFFFCC,），,然后单击“确定”按钮。,（,3,）选取工具箱中的文本工具，在“属性”面板中设置字体为“幼圆”，字号为,300,，颜色为黑色(或其他颜色)。,（,4,）在场景上单击鼠标，然后输入字母,F,。,（,5,）,选取工具箱中的箭头工具，然后选择“修改,分解组件”菜单选项，打散字母，可以看到字母变形为打散的颜色方块，如图,5-37,所示。,（,6,）在时间轴的第,5,帧上单击鼠标，然后选择 “插入,白色关键帧”菜单选项，插入一个空白的关键帧，此时输入的字符将会消失。,（,7,）单击时间轴下方的“绘图纸外观”（洋葱皮）按钮，可以看见字母,F,以较淡的颜色显示出来。,63,（,8,）再次选择文本工具在场景上继续输入字母,L,，,覆盖在字母,F,上，然后选择“修改,分解组件”菜单选项，将其打碎，如图,5-38,所示。,（,9,）用同样的方法，分别在时间轴的第,10,、,15,、,20,帧处输入字母,A,、,S,、,H,，,并将它们打散，这时的时间轴如图,5-39,所示。,（,10,）在第,1,帧上单击鼠标，然后在帧“属性”面板的“中间”下拉列表框中选择“形状”选项，如图,5-40,所示。,（,11,）设置完毕后，可以看到时间轴的第,1,帧到第,5,帧之间产生了一条绿色箭头线。,（12）用同样的方法，单击第5帧、10帧和15帧，并在帧“属性”面板的“中间”下拉列表框中选择“形状”选项，这时时间轴变为如图5-41所示。,64,（,13,）选择“控制,测试影片”菜单选项，观看影片播放效果，如图,5-42,所示为影片中的一帧。,5.4.7,淡出淡入式动画,淡出淡入式动画属于变形动画的一种，只不过是颜色的变化而已。下面通过一个实例来说明淡出淡入动画的制作方法，其步骤如下：（1）选择“文件新建”菜单选项，新建一个影片。（2）选择“修改影片”菜单选项，打开“影片属性”对话框，设定动画尺寸为500,px400px，,背景颜色为浅黄色（#,FFFFCC），,然后单击“确定”按钮。（3）设置填充颜色为淡绿色，选取工具箱中的椭圆工具，在场景上画一个椭圆，如图5-43所示。（4）在时间轴的第5帧上单击鼠标，然后选择 “,65,“插入白色关键帧”菜单选项，插入一个空白的关键帧。（5）单击时间轴下方的“绘图纸外观”（洋葱皮）按钮，可以看见椭圆以较淡的颜色显示出来。（6）再次选择椭圆工具在场景上继续画一个椭圆，覆盖在前一个椭圆上，其填充颜色为深绿色，如图5-44所示。,（,7,）用同样的方法，在时间轴的第,10,帧处画一个椭圆，其颜色为淡绿色，这时的时间轴如图,5-45,所示。（8）在第1帧上单击鼠标，然后在帧“属性”面板的“中间”下拉列表框中选择“形状”选项。（9）设置完毕后，可以看到时间轴的第1帧到第5帧之间产生了一条绿色箭头线。,66,（,10,）用同样的方法，单击第,5,帧，并在帧“属性”面板的“中间”下拉列表中框中选择“形状”选项，这时时间轴变为如图,5-46,所示。,（,11,）选择“控制,测试影片”菜单选项，观看影片播放效果。如图,5-47,所示为影片中的一帧。,5.4.8,编辑动画,创建完动画后，可以对动画进行编辑。但是，只有关键帧是可编辑的。普通帧只看得见，不能直接进行编辑。通过改变普通帧前面的关键帧的属性，或在渐变动画的首尾关键帧之间新建一个关键帧，就可以改变普通帧的属性。,67,通常，,Flash,动画只能显示1帧的画面，而当制作逐帧动画需要给每帧定位时，就需要用到位于时间轴下部的洋葱皮工具。洋葱皮工具具有填充模式显示、线框模式显示、多帧编辑和游标设置等功能。利用洋葱皮工具，可以同时显示或编辑多个帧。,填充模式显示,单击按钮，位于时间轴标尺上的起始游标和终止游标之间的帧在面板上就由深到浅显示出来。当前帧的颜色最深，其他帧的颜色依次变浅。但只能对当前帧或当前关键帧进行编辑。 线框模式显示单击按钮，位于时间轴标尺上的起始游标和终止游标之间的帧以线框模式显示。,68,多帧编辑,多帧编辑的功能在制作复杂的动画时非常有用。例如，在制作动画的时候，需要查看动画在各个帧中内容的相对位置，这时，使用多帧编辑功能可以同时选择多个帧的内容，然后利用对齐面板调整它们的相对位置。,单击按钮，位于显示游标之间的帧以正常模式显示出来，虽然不是所有帧，但显示出,来的帧都能进行编辑。,游标设置,要改变所显示的帧的范围，可以移动时间轴标尺上的显示游标，一般情况下，移动播放指针时，游标会跟着指针移动。单击按钮，弹出下拉菜单，可对游标进行设置。,69,5.5,声音处理,在,Flash MX,中，可以使用多种方法在影片中添加声音。这些声音既可以独立于时间轴连续播放，也可以和影片保持同步。当给按钮添加声音后，如果按钮被触摸或按下，则可以发出特定的声音。此外，使用声音淡入淡出可以创造出优美的音效。,5.5.1,导入音频文件,5.5.2 声音的设置,5.5.3 声音的编辑,70,71,5.5.1,导入音频文件,要在,Flash MX,中导入声音文件，可按如下步骤操作：,（,1,）首先选取要导入声音的图层，执行“文件,导入”菜单下的命令，打开如图,5-48,所示的对话框。 （,2,）可以从中选择想要导入的声音，单击“打开”按钮即可。,5.5.2 声音的设置,当声音导入,Flash MX,后，就会成为组件库中的一员，因此，可以从组件库中修改声音的基本设定。只要在组件库中选取要修改的声音组件，并单击下侧的“属性”按钮，就会打开声音属性对话框，如图,5-49,所示。,72,73,在这个对话框中，上方显示了声音文件的详细资料，例如文件来源、建立日期、播放长度及文件大小等等。下方的导出设置选项可以设置输入动画时，其中的声音要用何种方式压缩，以减少文件体积。而,Flash MX,最大的特色之一，就是支持,MP3,的压缩算法，可以很有效地将声音文件压缩为原来大小的,1/10,，同时仍然保持,CD,水准的音质。在下拉列表框中可以选择不同的压缩格式。,默认值,该选项在影片发布时，一般在“发布设置”对话框中的设置。,ACPCM,该选项用来设置,8,位或,16,位的声音数据。一般应用在比较短的声音事件中。,MP3,这种压缩格式是现在非常流行的音乐文件压缩格式，使用于比较长的音乐文件中。,Raw,对输出的声音不做任何压缩。,74,5.5.3 声音的编辑,编辑声音文件时，首先需要在时间线中选中声音文件的实例，然后单击属性面板上的按钮，会弹出“编辑封套”对话框，如图,5-50,所示。,75,在“编辑封套”对话框最上方的“效果”设置选项中，可以设置声音播放的特效。,拖动“编辑封套”对话框中间的滚动条，可以设定声音播放的起始位置和结束位置。,在两个波形预览窗口中，可以手动设定声音的特效。,在“编辑封套”对话框的最下方，有一排图形按钮，其功能如下：,（播放）,对声音编辑对话框中的声音文件进行播放，可以对起始点、结束点和波形线的设定进行测试。,（停止）,停止当前正在播放的声音。,（放大）,对预览窗口中的内容进行放大显示。,（缩小）,对预览窗口中的内容进行缩小显示。,76,（以秒为单位）,设定“编辑封套”对话框中的声音单位以秒为单位。,（以帧为单位）,设定“编辑封套”对话框中的声音单位以帧为单位。,77,5.6,动画的交互控制,创建交互性动画的关键是设置在指定的事件发生时执行某个特定的动作。事件既可以在播放指针到达某帧时触发动作，也可以在用户单击按钮或按键时触发动作。用户可通过创建相应的说明，告诉,Flash,当事件发生时应该执行的动作。动作的设置是在动作脚本编辑面板中进行的。,5.6.1,Flash MX,程序设计基本知识,5.6.2,Actions,编程环境,5.6.3 设置按钮动作,5.6.4 设置帧动作,5.6.5 设置动画和电影剪辑动作,78,5.6.1,Flash MX,程序设计基本知识,与所有的其他编程语言一样，,Flash MX,的,Action Script,也是由变量、函数和表达式等一些基本元素构成的。下面将对这些元素做简要介绍。,1. 变量,变量是存储信息的容器。在首次定义一个变量时，最好赋给它一个初值。, 命名变量变量名必须是一个标识符，不能是一个关键字或逻辑常量，在它的作用范围内必须是惟一的。 变量的类型在,Flash,中，无需显式定义一个变量的类型，在给变量赋值时自动确定变量的数据类型。,79,变量的作用范围,变量的作用范围是指能够识别和引用该变量的区域。在,Action Script,中，变量可以是全局的或局部的。全局变量可以在所有时间线中共享；局部变量仅在它所在的代码块中有效。,声明变量,使用,setVariables,动作或赋值操作符可以声明全局变量，而在函数体内使用,var,语句可以声明局部变量。,在脚本中使用变量,在表达式中使用变量前，必须声明这个变量。否则将产生错误。,2.,常量,我们可以将常量理解为一种特殊的变量，它的值在表达式中永远保持不变。按照数值的类型我们可以,80,将常量分为,3,种类型，它们分别是数值型、字符型和逻辑型。,3.,运算符和表达式,在,Flash,中，可使用的表达式有,3,种：算术表达式、字符串表达式或逻辑表达式。不同的表达式，参与运算的参数、运算符、运算法则和运算结果不相同。,算术表达式,算术表达式由数值、以数值为结果的函数、算术运算符组成，运算结果是数值或逻辑值。,字符串表达式,字符串表达式是由字符串如“,BlueFox,”、,以字符串为结果的函数以及字符运算符组成的，,其运算结果为字符串或逻辑值。,逻辑表达式,81,逻辑表达式由逻辑值、以逻辑值为结果的函数、以逻辑值为结果的字符串表达式、算术表达式和逻辑运算符组成，其运算结果为逻辑值。,4.,函数,由一个变量按照一定的法则决定另一个变量的值，这种对应关系被称为函数。在,Flash MX,中也使用了函数，如通用类型函数、数值类函数、字符串类函数、属性类函数和多字节字符串函数等。,5.6.2,Actions,编程环境,在互联网上，操作者在很多时候都需要和浏览的动画进行交互，而,Flash MX,正好是完成这种功能的巨匠。在,Flash MX,中，交互功能是通过,Action Script,来实现的。用户可以使用键盘或鼠标来控制动画播放、停止、移动等众多交互功能。,82,Action Script,列表,动作编辑器是我们用来编写,Action Script,的主要工具。,Flash MX,为动作编辑器扩展了许多功能，可用的,Action Script,命令已经接近了,1000,条。任何一个人希望全部记住这些,Action Script,命令都是比较困难的。好在动作编辑器为我们提供了,Action Script,列表，图,5-51,所示为动作编辑器，操作时我们只需双击,Action Script,列表中的命令即可将其添加到右侧的编辑框中。,普通模式,单击动作编辑器右上角的按钮，可以弹出一个菜单，我们可以通过菜单将动作编辑器设定为普通模式或专家模式。,83,动作编辑器的普通模式适合于没有任何编程背景的初学者，它允许用户使用对话的方式编写,Action Script,命令。图,5-51,所示为动作编辑器的普通模式。,84,图,5-51,动作编辑器（普通模式）,85,专家模式,专家模式是为那些有一定编程基础，或是已经熟练掌握,Action Script,的用户提供的编辑模式。专家模式略去了,Action Script,命令参数的对话机制，我们只能通过手工编写的方式设定,Action Script,命令的参数。图,5-52,所示为动作编辑器的专家模式。,86,图,5-52,动作编辑器（专家模式）,87,5.6.3 设置按钮动作,按钮在分配动作后，就会影响鼠标的单击或触摸事件，执行相应的动作。在,Flash,MX,中，按钮动作的分配是在动作脚本编辑面板中进行设置的。,下面通过一个实例来说明给按钮分配动作的方法，其操作步骤如下：,（,1,）选择“文件,新建”菜单选项，新建一个影片。,（,2,）选择“窗口,共享库,Buttons,”,菜单选项，打开共享按钮元件库，选择,Push Buttons,目录中的,Push Button-Blue,按钮，并在场景中创建它的实例。,（,3,）选择“插入,图层”菜单选项，在“图层,1,”之上新建 “图层,2,”。选择工具箱中的椭圆工具，设置描绘颜色为黑色，填充颜色为无，在“图层,2,”第,1,帧对应的舞台上绘制椭圆，如图,5-53,所示。,88,（,4,）用鼠标右键单击“图层,2,”的第,20,帧，从弹出的快捷菜单中选择“插入白色关键帧”选项。选取工具箱中的矩形工具，设置描绘颜色为黑色，填充颜色为无，在舞台上绘制一个矩形。用鼠标右键单击“图层,1,”的第,20,帧，从弹出的快捷菜单中选择“插入帧”选项，扩展该图层。,89,（5）单击“图层2”的第1帧，在“属性”面板的“中间”下拉列表框中选择“形状”选项，创建从第1帧到第20帧之间的形状变形动画，如图5-54 所示。,90,（6）用鼠标右键单击舞台上的按钮元件实例，从弹出的快捷菜单中选择“动作”选项，打开动作脚本编辑面板。,（7）在左侧窗格中依次展开,Actions,、,Movie Control,类，然后双击,stop,语句，将它添加到右侧窗格中，如图5-55所示。,91,92,（,8,）选择“控制,测试影片”菜单选项，测试影片。当单击图,5-56,所示按钮时，测试停止，如图,5-56,所示。,93,5.6.4 设置帧动作,在,Flash MX,中，也可以为图形元件、影片和影片剪辑实例分配动作，只有通过帧动作脚本编辑面板为关键帧分配动作，才能控制事件的发生。下面对上节中的影片进行以下修改，为第1帧添加,Stop,动作，其操作步骤如下：（1）在时间轴窗口的第1帧（任意图层）上单击鼠标右键，从弹出的快捷菜单中选择“动作”选项，打开帧动作脚本编辑面板。（2）在左侧“语句”列表框中依次展开,Actions,、,Movie Control,类，双击,stop,语句，并将其添加到右侧“动作语句”列表框中，如图5-57所示。,94,图,5-57,为关键帧添加动作语句,95,（,3,）设置完毕后，时间轴窗口中的第,1,个关键帧上将出现一个字母,，,表示该关键帧有动作发生，如图,5-58,所示。,96,（4）在场景中单击按钮实例，这时将由帧动作脚本编辑面板切换到该按钮实例的动作脚本编辑面板。,（5）在“动作语句”列表框中选中起初添加的,stop,语句，然后单击“动作语句”列表左上角的按钮，将其删除。,（,6,）再从左侧的“语句”列表框中选择,play,语句，双击该语句，将其添加到右侧的“动作语句“列表框中，如图5-59所示。,97,图,5-59,修改按钮实例的动作语句,98,（,7,）选择“控制,测试影片”菜单选项，测试影片。开始时，椭圆变矩形的动画效果不开始，单击,图5-56所示,按钮，开始运动。当一个循环完成后，又停了下来，,这是因为在第1帧处添加了动作，当影片每次播放到该帧时，就会触发,Stop,事件。,5.6.5 设置动画和电影剪辑动作,在动作脚本编辑面板中可以为对象或动画关键帧添加动作语句。在,Flash MX,中添加了多种动作语句，使用它们可以创建出各种交互式影片。下面对较常用的几种动作语句做一下简要介绍。,99,1.,play,（,播放）和,stop,（,停止播放）语句,使用,play（,播放）和,stop（,停止播放）语句可以使影片在指定时刻播放和停止播放。经常用来与按钮配合，控制影片剪辑的播放。,2.,toggleHighQuality（,切换高质量）语句,使用,toggleHighQuality,语句可以控制影片是否在消除锯齿模式下显示。如果不消除锯齿，则可以使影片播放得更快。,如果将,toggleHighQuality,语句分配给按钮，就可以允许观众调整播放质量。,3.,stopALLSounds（,停止所有声音）语句,使用,stopALLSounds,语句可以停止所有声音的播放而不打断影片播放。,100,如果将,stopALLSounds,语句分配给按钮，那么观众在播放影片时可以选择是否播放声音。,4.,goto,（,跳转到）语句,使用,goto,语句可以使影片跳转到一个指定的场景或指定帧，当影片跳转到指定的新帧时，可以选择是停止在该帧还是从该帧开始播放。,5.,getURL（,获得,URL）,语句,使用,getURL,语句可将某个,URL,中的文档载入到指定的窗口，或者将变量传递给其他已经定义,URL,的应用程序。,6.,ifFrameLoaded（,是否载入帧）语句,使用,ifFrameLoaded,语句可以检查某一帧的内容是否已经被载入完毕。常用来在影片的余下部分被下载,101,到本地计算机时开始播放一个简单动画。,7.,LoadMovie（,载入影片）和,unloadMovie（,卸载影片）语句,使用,LoadMovie（,载入影片）语句可以载入其他影视文件或影片剪辑至当前的影片文件中，而,unloadMovie（,卸载影片）语句是从当前影片文件中卸载已经载入的影视文件或影片剪辑。,8.,WITH,或,tellTarget,语句,使用,with,或,tellTarget,语句可以控制不同的影片剪辑或其他使用,loadMovie,语句装载的影片。,给按钮分配,with,或,tellTarget,语句可以停止或开始影片剪辑在舞台上的播放，也可以使影片剪辑转到特殊的帧。,102,9.,duplicateMovieClip（,复制影片剪辑）和,removeMovieClip（,删除影片剪辑）语句,使用,duplicateMovieClip,语句可以在影片播放时动态创建影片剪辑的实例。无论源影片剪辑处于哪一帧，新创建的的实例都从第1帧开始播放。使用,removeMovieClip,语句可以删除,duplicateMovieClip,语句创建的影片剪辑实例。,10.,starDrag,（,拖动影片剪辑）语句,使用,starDrag,语句可以使影片剪辑在影片播放时移动。该语句可以被设置为开始或终止拖动操作。影片剪辑在被设置为可拖动之后，如果没有明确的,stopDrag,语句来终止，将一直保持可拖动状态。在一个时刻，仅有一个影片剪辑可以被拖动。,103,11.,setProperty（,设置属性）语句,使用,setProperty,语句，可以在播放影片时改变影片剪辑的位置、缩放比例、透明度、可见性、旋转角度等属性。,104,5.7.1 什么是,Flash MX,的组件,5.7.2 使用组件,5.7.3 编辑组件,5.7 使用组件,105,5.7.1 什么是,Flash MX,的组件,组件（,Componet,）,是一些复杂的并带有可定义参数的影片剪辑元件，在影片创作的过程中，可以直接定义或通过,ActionsScript,的方法定义组件的参数。,Flash MX,自带了7个组件，它们是,CheckBox、ComboBox、ListBox、PushButton、RadioButton、ScrollBar,和,Scrollpane。,可以使用这些组件创建一些简单的与用户交互的影片，也可以使用它们创建复杂的,Web,工程。,106,5.7.2 使用组件,在,Flash MX,中，组件是可以重复利用的图像、动画、按钮以及某些特定的功能。,而实例是组件在工作中的具体表现。组件创建完成后，用户可以在影片的任意地方创建该组件的实例，也可以在其他元件或组件内创建组件的实例。,一般情况下，组件是通过库面板来管理和使用的。,Flash MX,的库面板用来存放元件和导入的文件，导入的文件包括声音、视频、位图以及矢量图等。通过库面板还可以管理和预览这些内容。,107,5.7.3 编辑组件,从技术上来讲，如果把组件理解成是影片剪辑元件在功能上的扩充，那么可以说组件的创建是非常简单的。如果希望创建一个功能强健的组件，那么既要有良好的,ActionScript,语言基础，又应该充分地理解面向对象的技术。下面介绍创建组件的基本方法，其操作步骤如下：,（,1,）单击“文件”菜单中的“新建”命令，创建一个新文件。,（,2,）单击“插入”菜单中的“创建新元件”命令，在弹出的“创建新元件”对话框中设定名字为,Component1,，,设定作用为“影片剪辑”，如图,5-60,所示。完成后单击“确定”按钮，,Flash,将进入元件编辑模式。,108,图,5-60,创建名为,Component1,的影片剪辑元件,（,3,）在影片剪辑元件的中心位置使用文本工具输入一段文字“,First Component,”，,完成后如图,5-61,所示。,109,图5-61 在影片剪辑元件的中心输入文字,（,3,）在影片剪辑元件的中心位置使用文本工具输入一段文字“,First Component,”，,完成后如图,5-61,所示。,110,（4）重复步骤（2）和步骤（3）的过程，再次创建一个名为,Component2,的影片剪辑元件，并将元件中心位置的文字改为“,Second Component”。,（5）,单击“窗口”菜单中的“库”命令，打开库面板，然后在元件,Component1,名称上右击，在弹出的快捷菜单中选择“定义组件”命令，如图5-62所示。然后会弹出一个“组件定义”对话框。,111,（6）,在“组件定义”对话框中，选中“显示在组件面板”复选框，并在“工具提示文字”文本框中输入,First Component，,完成后如图5-63所示。然后单击“确定”按钮。,（7）重复步骤（5）和步骤（6）对影片剪辑元件,Component2,也同做出同样的设置，但是要将“工具提示文字”文本框中输入的,First Component,修改为,Second Component。,到这里仔细观察库面板中的两个影片剪辑元件，你会发现，影片剪辑元件的种