FLASH制作实.ppt

单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,*,网页设计与制作教程,中国水利水電出版社,网页设计与制作教材,配套電子教案,.6,1,11.1 Flash 8概述,11.2 常用面板简介,11.3 在网页中添加特效文字,11.4 运用Flash 8制作常用的图案,11.5 元件和实例,11.6 逐帧動画,11.7 创立形状补间動画,11.8 遮罩動画,11.9创立動画补间動画,第11章 网页動画的制作,2,11.1 Flash 8概述,Flash是Macromedia企业推出的壹种优秀的矢量動画编辑软件，Flash 8是其最新的版本。运用该软件制作的動画尺寸要比位图動画文献如GLF動画尺寸小诸多，顾客不仅可以在動画中加入声音、视频和位图图像，還可以制作交互式的影片或者具有完备功能的网站。,Flash是壹种创作工具，设计人员和開发人员可使用它来创立演示文稿、应用程序和其他容許顾客交互的内容。Flash可以包括简朴的動画、视频内容、复杂演示文稿和应用程序以及介于它們之间的任何内容。,Flash 尤其合用于创立通過Internet提供的内容，由于它的文献非常小。Flash是通過广泛使用矢量图形做到這壹點的。与位图图形相比，矢量图形需要的内存和存储空间小诸多，由于它們是以数學公式而不是大型数据集来表达的。位图图形之因此更大，是由于图像中的每個像素都需要壹组單独的数据来表达。,3,11.1 Flash 8概述,Flash文档的文献扩展名為.fla(FLA)。Flash文档有四個重要部分：,（1）舞台是在回放過程中显示图形、视频、按钮等内容的位置。在背面的章节中将對舞台做详细简介。,（2）時间轴用来告知Flash显示图形和其他项目元素的時间，也可以使用時间轴指定舞台上各图形的分层次序。位于较高图层中的图形显示在较低图层中的图形的上方。,（3）库面板是Flash显示Flash文档中的媒体元素列表的位置。,（4）ActionScript 代码可用来向文档中的媒体元素添加交互式内容。例如，可以添加代码以便顾客在單击某按钮時显示壹幅新图像，還可以使用 ActionScript向应用程序添加逻辑。逻辑使应用程序可以根据顾客的操作和其他状况采用不壹样的工作方式。Flash包括两個版本的 ActionScript，可满足创作者的不壹样需要。,4,11.1 Flash 8概述,完毕Flash文档的创作後，可以使用“文献”“公布”命令公布它。這會创立文献的壹种压缩版本，其扩展名為.swf（SWF）。然後，就可以使用Flash Player 在Web浏览器中播放SWF文献，或者将其作為独立的应用程序進行播放。,5,11.1 Flash 8概述,11.1.1 Flash 8的開始界面,运行Flash 8，首先映入讀者眼帘的是操作的“開始”页面，左边是打開近来用過的项目，中间是创作多种类型的新项目，右边是從模板创立多种動画文献，如图11-1所示。,6,11.1 Flash 8概述,11.1.2 Flash 8的工作界面,启動Flash 8，并在“開始”页中选择壹项進行，就可進入Flash的工作环境，如图11-2所示的工作界面，重要有舞台、主工具栏、工具箱、時间轴、属性面板和多种控制面板等部分。,图11-2 Flash 8的工作界面,7,11.1 Flash 8概述,11.1.3 時间轴,時间轴用于组织和控制文档内容在壹定期间内播放的图层数和帧数。与胶片同样，Flash 文档也将時長分為帧。图层就像堆叠在壹起的多张幻灯胶片同样，每個图层都包括壹种显示在舞台中的不壹样图像。時间轴的重要组件是图层、帧和播放頭，如图11-3所示。,图11-3 時间轴,8,11.1 Flash 8概述,11.1.4 工具箱,工具箱是Flash 8中最常用的面板，用鼠標單击能选中多种工具，如图11-4所示。顾客可以自定义工具编排，执行“编辑”“自定义工具面板”命令，打開“自定义工具栏”對话框，可根据需要重新安排和组合工具的位置，如图11-5所示，在“可用工具”列表中选择工具，單击“增長”按钮，就可以将选择的工具添加到“目前选择”列表中。單击“恢复默认值”按钮就可以恢复系统默认的工具设置。,9,11.1 Flash 8概述,图11-4 工具箱 图11-5 “自定义工具栏”對话框,10,11.2 常用面板简介,Flash 8中有诸多面板，默认状态下，在“舞台”的正下方有四個比较常用的浮動面板，分别是“動作”面板，“属性”面板，“滤镜”面板，“参数”面板。單击面板的標題栏，可以依次展開它們，如图11-6所示。,图11-6 展開的常用面板,11,11.2 常用面板简介,1、“滤镜”面板,“滤镜”面板提供了七种滤镜效果，可以對文字、影片剪辑和按钮進行美化和修饰，使其更有趣味，假如与补间動画結合起来，還可以制作出多种丰富的動画效果。,2“動作”面板,“動作”面板是是動作脚本的编辑器。,3“属性”面板,“属性”面板（如图11-8所示）可以很轻易地访問舞台或時间轴上目前选定的最常用的属性，也可以在面板中更改對象或文档的属性，我們将在背面章节中详细简介属性面板的应用。,12,11.3 在网页中添加特效文字,在网页制作過程中，文字是最常用的對象，我們可以制作某些特效文字作為网页標題，如空心字、立体字、五彩字等，来增長网页的美观性，吸引浏览者。,1五彩字,五彩字的制作措施，是先将输入的文本转换為图像對象，然後對它填充渐变色，最终再對渐变色稍加调整即可，五彩字的制作效果如图11-9所示。,图11-9 五彩字效果图,13,11.3 在网页中添加特效文字,2空心字,空心字的制作措施是：先将输入的文字转换為图形對象，然後對它進行描边，最终将文字的实心部分删去，得到空心字，效果如图11-15所示。,图11-15 空心字效果图,14,11.3 在网页中添加特效文字,3阴影字,阴影字是网页中较為常用的壹种特效文字，制作阴影字的措施是：先输入文字，然後将文字复制，并将复制後的文字与原文字錯開某些，产生出阴影字的效果。為了增長阴影字的美观，完毕後应當對文字進行描边，效果如图11-20所示。,图11-20 制作阴影效果,15,11.3 在网页中添加特效文字,4立体字,立体字的制作措施是：先输入文字，然後将文字复制，分别對它們填充不壹样的颜色，并描边；然後将复制後的文字和原文字重叠摆放，并錯開壹定的距离，擦除重叠部分多出的线条，再用直线连接它們的顶點，产生出立体的透视效果，立体效果如图11-23所示。,图11-23 “立体字”效果图,16,11.4 运用Flash 8制作常用的图案,11.4.1 绘制四角星、五角星,在制作网页時，常常會碰到需要添加某些星形图案，如五角星、夜空中的星星（用這些图形還可以制作国旗、国徽和群星闪耀等）等。掌握星形图案的绘制措施，可以绘制出其他类似的几何图形，如正多边形等。下面以五角星、四角星為例，来简介它們的绘制措施，效果如图11-30所示。,图11-30 五角星和四角星的效果图,17,11.4 运用Flash 8制作常用的图案,11.4.2 绘制太极八卦图与二進制数,太极八卦图是中国古老的文化科學遗产，是我国劳感人民智慧文明的結晶。德国数學家莱布尼兹受此图的启发，完善、撰写了二進制数与算术壹書，成為現代電子计算机二進制数的创始人。太极图就是壹种圆，裏面画著两条黑白相间、首尾相顾的魚；八卦图是壹种正八边形，每条边上均有壹种特殊的符号，每個符号由三個或断或连的线段构成，效果图如图11-37所示。,图11-37 “太极八卦与二進制数”效果图,18,11.4 运用Flash 8制作常用的图案,11.4.3 绘制香港尤其行政区区旗,中华人民共和国香港尤其行政区区旗是壹面中间配有五颗星的動态紫荆花图案的紅旗。紅旗代表祖国，紫荆花代表香港，紫荆花紅旗象征香港是祖国不可分割的壹部分，在祖国的怀抱中兴旺发达。花蕊上的五颗星象征著香港同胞心中热愛祖国。花呈白色表达有别于代表祖国其他部分的紅色，即象征“壹国两制”。下面运用“钢笔工具”来绘制香港尤其行政区区旗，效果图如图11-48所示。,图11-48 香港尤其行政区区旗,19,11.5 元件和实例,11.5.1 元件的简介,元件（又称為图符或组建）是Flash创作中的资源單位，包括可反复使用的图形、動画或按钮。它的出現极大地以便了Flash的创作，使输入的影片文献体积大大缩小。學過OOP（面向對象编程）的讀者都应當懂得對象与实例。元件也是以多种形式存在的。在元件编辑环境中先把原则范例编辑好。作為對象存入元件库中，然後在場景中调用元件库中的元件，此時在場景中的元件就是该對象的壹种实例。并可在場景环境中對实例的各個属性如颜色、坐標、声音、效果等進行编辑。没有學過OOP的讀者可以把對象理解為底片，而实例就是相片，即实例是對象的壹种详细实現。修改实例的属性相称于對底片放大或缩小成為相片。,20,11.5 元件和实例,1元件分类,在Flash 8中有三种元件，分别是图形元件、影片剪辑元件和按钮元件。,（1）图形元件。图形元件壹般是静止的图形，如图11-61所示。它可以由多种层构成，但只有壹帧，图形元件不能捕捉鼠標信息，也不能完毕Action動作和声音控制。,（2）影片剪辑元件。影片剪辑元件是Flash 创作的基本资源之壹。顾名思义，影片剪辑就是壹种影片片断。它的制作過程与制作動画没用什么差异，只不過最终集成為壹种元件。,（3）按钮元件。按钮元件是用于响应鼠標事件的元件，它可以按摄影应显示的不壹样图像状态。在按钮中可以放置图像元件或影片剪辑，不過不能在壹种按钮中放入此外壹种按钮元件。,21,11.5 元件和实例,按钮元件由四個关键帧构成，因而有四种不壹样的状态，如图11-63所示。,图11-63 按钮编辑模式下的時间轴,1）弹起帧：代表鼠標指针不在按钮上時的状态。假如不定义點击帧，该状态下的對象就會被作為鼠標响应区域。,2）指针通過帧：代表鼠標指针在按钮上時的状态。,3）按下帧：代表鼠標單击按钮時的状态。,4）點击帧：定义鼠標對应的区域，该帧的状态在影片中是看不見的。假如不需要定义响应帧就可以不定义该帧。,22,11.5 元件和实例,2元件的创立,创立元件的措施有如下三种：,第壹种：對象转换為元件，在舞台上选用對象来创立元件，被选用的對象仍然在舞台上，但已經变成了元件的实例。被选择的對象還會复制壹种新的元件放在库窗口中。,第二种：创立新元件,第三种：從共享库中选用。Flash自带的例子以及常用元件都能從通用的元件库中找到。选择“窗口”“其他面板”“公用库”命令，然後在子菜單中寻找可用的实例即可。還可以将找到的元件放進目前場景的“库”面板中以以便使用。,23,11.5 元件和实例,11.5.2 实例,元件创立後，它就自動存入该文献的“库”面板中。将元件從“库”面板中拖動到舞台上，就生成了元件的壹种实例。实例是元件的实际运用，在舞台上對实例進行多种操作，如缩放、修改实例的颜色效果、变形等操作都不會影响“库”面板中的元件，對根据同壹元件创立的不壹样实例可以進行不壹样的设置和修改。,1创立实例,创立实例的措施比较简朴，只需要在“库”面板中，选择需要的元件，按住鼠標左键拖動舞台上释放即可。,2编辑实例,将元件從“库”面板中拖到舞台上，创立与之對应的实例，可以根据实际制作需要来调整实例的大小和旋转角度。,24,11.5 元件和实例,11.5.3 几种特殊的元件和实例的简介,（1）位图被导入“舞台”後，在“库”中直接為其创立壹种“元件”對象，而它在“舞台”上的图片也就被称為“某元件的实例”，但這种“实例”的能力有限，它实际上是壹种“成组的元素”，除了可以做“動作变形”及变化位置、大小和方向，其他什么也干不了，要想将位图图形转换為萬能的元件，必须选中它，然後按住键盘上的F8键，把它重新定义為壹种新的元件。,（2）声音被导入“舞台”後，在“舞台”上什么也看不到，在“库”面板中，声音自動被定义為“元件”，它在“舞台”上的“实例”应用，可以在帧的“属性”面板中设置，對于声音在“舞台”上的每個“实例”，可以“斩頭去尾”并進行其他的特效处理，而不影响声音“元件”在“库”元件中的本来特性。运用這壹特點，可以仅用壹种声音文献就能在動画中得到不壹样的声音效果，由于声音文献壹般比较大，從而节省了大量的资源。,25,11.5 元件和实例,（3）视频被导入“舞台”後，同样在“库”中為其定义了個格“元件”，它在“舞台”上的实例仅能变化位置、大小，它实际上是壹种“封装”了的“動画系列”。,（4）矢量图被导入“舞台”後，仅出目前“舞台”中，“库”中没有其對应“元件”，舞台中矢量图形保留了本来创作過程中的所有“途径”构造，這是動画制作過程中最為得心应手的動画元素。,（5）當在“場景”中输入壹段文字後，它以壹种特殊的“组合”方式出現，在你未能把“组合”解散前，仍然可以编辑它，包括文字内容、字体、字号和颜色等属性。更為重要的是，還可以赋予文本對象以特定“角色”（“静态文本”、“動态文本”和“输入文本”等，缺省的是“静态文本”）。而壹經解散“组合”，它就与壹般的图形“素材”同样。,26,11.5 元件和实例,11.5.4 元件库,（1）使用“元件项目列表”。Flash 8“库”中的“元件项目列表”采用“可折叠文献夹”树状构造，壹种较大的動画作品，往往拥有几百個元件，运用“库”中的“项目列表”這壹特性可為動画中所有元件作有序归类。,（2）元件的排序。當向“库”内添加新元件時，它不時出目前列表的上面，它在列表中的位置似乎是随机安排的，由于默认時，“库”的“元件项目列表”是按“元件名称”排列的，英文名与中文名混杂時，英文在前，中文按照其對应的字符码排列，显然這种排列方式不利于查找元件。,（3）用“图形”识别元件类型。Flash 8的“元件列表”中，除了“类型”這壹列“名称”外，還提供了更详细的元件“类型图標”。,27,11.5 元件和实例,3元件库的使用,（1）清理多出项目。伴随動画制作的進展，“库”项目将变得越来越杂乱。這样将挥霍诸多宝贵的源文献空间，從“库”菜單中單击“选择未用项目”命令，Flash 會把這些未用的元件所有选中，這時可以單击菜單中的“删除”命令，也可以直接單击按钮，将它們删除。,（2）公用元件库。在“窗口”“公用元件库”菜單列表中，可以看到Flash 8為顾客提供“學习交互”、“按钮”和“类”三個类别的常用“元件”，选择其中之壹，在“舞台”上就會出現某些對应的“公用元件库”。,28,11.5 元件和实例,11.5.5 按钮元件,按钮元件是Flash 中较為特殊的元件之壹，通過编辑按钮的4個关键帧，可以产生丰富多彩的特殊效果，從而為動画或网页增添光彩，按钮在動画中可以实現場景的跳转，動画的播放与停止和输入确实认，按钮的组合還可以构成菜單。按钮的应用非常广泛。下面将通過几种实例来简介按钮的制作、按钮動作的使用措施、按钮控制動画等基本使用方法。,1水晶按钮,水晶按钮是Flash 中应用最為普遍的按钮元件。有弹起、指针通過、按下和點击四种状态。本例重要阐明按钮在不壹样状态下的不壹样效果，如图11-74所示。,图11-74 水晶按钮,29,11.5 元件和实例,2链接按钮,链接按钮重要是网页中添加交互效果的壹种基本工具，按钮的“弹起”状态是按钮的壹般状态，“指针通過”状态是指针通過按钮的效果，“按下”状态是鼠標按下時的效果，“點击”则是鼠標對按钮的反应区。,3動态按钮,本例在制作按钮的過程中，在“指针通過”状态下加入壹种影片剪辑。當指针通過時會自動播放影片剪辑，這是多种元件互相嵌套的成果。在動画制作中會有更多的元件加入到按钮中，如声音、程序等。,4播放按钮,對于Flash来說，应用最广泛的部分就是動画的交互性，下面简介使用按钮来控制動画的播放。,30,11.6 逐帧動画,逐帧動画是壹种常見的動画形式，它的原理是在“持续的关键帧”中分解動画動作，也就是在每壹帧中设置不壹样的画面，持续播放而形成的動画。,11.6.1 逐帧動画的概念及体現形式,在時间帧上逐帧绘制帧内容称為逐帧動画，由于是壹帧壹帧地画，因此逐帧動画具有很大的灵活性，几乎可以体現任何想体現的内容。逐帧動画在時间轴上体現為持续出現的关键帧，如图11-115所示。,图11-115 逐帧動画在時间轴上的体現,31,11.6 逐帧動画,11.6.2 逐帧動画的制作措施,创立逐帧動画的常見措施有如下几种：,（1）用导入的静态图片建立逐帧動画。用jpg、png等各式的静态图片持续导入到Flash中，就會建立壹段逐帧動画。,（2）绘制矢量逐帧動画。用鼠標或压感笔在場景中壹帧壹帧地画出每帧的内容。,（3）文字逐帧動画。用文字作為帧中的内容，实現文字跳跃、旋转等效果。,（4）指令逐帧動画。在時间帧面板上，逐帧写入動作脚本語句来完毕元件的变化。,（5）导入序列图像。可以导入gif序列图像、swf動画文献或者运用第三方软件（Swish、Swift、3D等）产生動画系列。,32,11.6 逐帧動画,11.6.3 倒数数字逐帧動画实例,操作环节：,（1）执行“文献”“新建”命令，弹出“新建文档”對话框，新建壹种“Flash文档”，單击“确定”按钮。,（2）單击時间轴上的图层1的第1帧，使用文字输入工具在绘图区域输入数字9，如图11-116所示，将数字颜色设置為紅色，大小设置為200，如图11-117所示。,图11-116 输入数字9,33,11.6 逐帧動画,图11-117 设置文本,（3）這時可以看到，在時间轴上的第1帧变成壹种黑色的小圆點，這阐明已經有對象加入第1帧。在第2帧的位置右击，选择“插入关键帧”命令，在第2帧的位置插入关键帧，這時可以看到，第2帧也变成了壹种黑色的小圆點，這阐明：在插入关键帧的同步将第1帧的對象也复制到了第2帧上。继续添加其他的关键帧，如图11-118所示。,图11-118 添加第2帧到第9帧,34,11.6 逐帧動画,（4）使用“文本工具”，选择第2帧，双击鼠標左键，选中文字，将9改為8，并将颜色设置為粉紅色，如图11-119所示。,图11-119 修改文本,（5）以同样的方式依次将其他各关键帧的内容修改為11、6、5、4、3、2、1、0。颜色依次為藍色、绿色、黄色、橙色、黑色、紫色、淡藍色、黑绿色。,（6）單击Enter键，播放動画，可以看到数字的倒数功能出現了，這時执行“控制”“测试影片”命令，查看動画的执行状况。执行“文献”“导出”“导出影片”命令，在弹出的“导出影片”對话框中将動画保留為“倒数文字.fla”。,35,11.7 创立形状补间動画,1形状补间動画的概念,在壹种关键帧中绘制壹种形状，然後在另壹种关键帧中变化形状或绘制另壹种形状，Flash根据两者之间的形状来创立的動画被称為“形状补间動画”。,2构成形状补间動画的元素,形状补间動画可以实現两個图形之间颜色、形状、大小和位置的互相变化，其变形的灵活性介于逐帧動画和動画补间動画两者之间，使用的元素多為用鼠標或压感笔绘制出的形状，假如使用图形元件、按钮或文字，则必须先“分离”，才能创立变形動画。,36,11.7 创立形状补间動画,3.形状补间動画在時间轴面板上的体現,形状补间動画建好後，時间帧面板上的背景色变為淡绿色，在起始帧和結束帧之间有壹种箭頭，如图11-120所示。,图11-120 形状补间動画在時间轴面板上的表达標识,4创立形状补间動画的措施,在動画開始播放的地方创立或选择壹种关键帧，并设置要開始变化的形状，壹般壹帧中以壹种對象為好，在動画結束处创立或选择壹种关键帧并设置要变成的形状，再單击開始帧，在“属性”面板上單击“补间”旁边的下拉按钮，在弹出的菜單中选择“形状”，此時，時间轴上的变化如图11-120所示，壹种形状补间動画就创立好了。,37,11.7 创立形状补间動画,5形状补间動画的属性面板,Flash的“属性”面板随鼠標选定的對象不壹样而发生對应的变化，當建立了壹种形状补间動画後，單击帧，属性面板如图11-121所示。,图11-121 形状补间動画的属性面板,38,11.7 创立形状补间動画,6形状提醒的使用,（1）形状提醒的作用。在“起始形状”和“結束形状”中添加對应的“参照點”，使Flash在计算变形過渡時依壹定的规则進行，從而较有效地控制变形過程。,（2）添加形状提醒的措施。單击形状补间動画的開始帧，执行“修改”“形状”“添加形状提醒”命令，该帧在形状上就會增長壹种带字母的紅色圆圈。對应地，在結束帧形状中也會出現壹种“提醒圆圈”。用鼠標左键單击并分别按住两個“提醒圆圈”，放置在合适的位置，拖放成功後開始帧上的“提醒圆圈”变成黄色，結束帧上的“提醒圆圈”变為绿色，拖放不成功或不在壹条曲线上的時候，“提醒圆圈”颜色不变，如图11-122所示。,图11-122 添加形状提醒後各帧的变化效果,39,11.7 创立形状补间動画,7形状渐变動画实例变矩形為五角星,（1）制作無提醒點動画。,1）新建壹种Flash文档，在時间轴上插入壹种新的图层将两個图层分别命名為“文字”和“無提醒點”，然後在“文字”层用文本工具输入有关的文字，在“無提醒點”层用矩形工具绘制出壹种無边框的矩形，如图11-123所示。,图11-123 初始化制作,40,11.7 创立形状补间動画,2）选择“無提醒點”层的第1帧，打開“属性”面板，在“补间”下拉列表中选择“形状”选项，如图11-124所示。,图11-124 选择“形状”选项,3）在“無提醒點”层的第50帧按F6功能键插入关键帧，在“文字”层的第50帧按F5功能键插入帧，此時時间轴如图11-125所示。,图11-125 時间轴窗口,41,11.7 创立形状补间動画,4）将“文字”层锁定，然後选择“無提醒點”层的第50帧，在舞台上绘制壹种無边框的五角星，并将矩形删掉，如图11-126所示。,5）此時按回車键或者拖動播放指针测试動画，可以看到矩形以Flash默认的方式，逐渐变成壹种五角星，如图11-127所示。,第1帧 第25帧 第50帧,图11-126 绘制壹种五角星图11-127 测试動画,42,11.7 创立形状补间動画,（2）制作有提醒點的動画,1）在時间轴上新建壹种图层，命名為“有提醒點”。用同样的措施制作由矩形渐变到五角星的形状渐变動画，時间轴窗口如图11-128所示。,图11-128 時间轴窗口,2）将“文字”层和“無提醒點”层锁定，选择“有提醒點”层的第1帧，然後选择菜單栏的“修改”“形状”“添加形状提醒”命令，或者用Ctrl+Shift+H组合键，為形状添加提醒點，此時舞台中的矩形中增長了壹种紅色的字母a，如图11-129所示。,3）用鼠標單击字母a，并拖曳至矩形的壹种角上，如图11-130所示。,43,11.7 创立形状补间動画,图11-129 添加提醒點图11-130 拖動提醒點至边缘,4）选择時间轴的第50帧，可以看到五角星的中央也多了壹种字母a，用鼠標單击并拖曳至五角星的拐角处，會发現字母a有本来的紅色变成了绿色，如图所示。再回到第1帧，发現矩形边界上的字母a有本来的紅色变成了黄色，如图11-131所示。,a拖動至拐角处 b對应的变色 c设置其他提醒點,图11-131 給矩形和五角星添加提醒點,44,11.7 创立形状补间動画,5）用同样的措施设置此外3個提醒點。,6）此時按回車键测试動画便发現本来形状渐变動画发生了变化，如图11-132所示。,设置4個提醒點在渐变前後壹壹對应，不再像“無提醒點”那样由Flash自動生成了。,第1帧 第25帧 第50帧,图11-132测试動画的效果,45,11.7 创立形状补间動画,7）保留并测试動画，得到如图11-133所示的效果。,图11-133测试最终的效果,46,11.8 遮罩動画,11.8.1 遮罩動画的概念,1遮罩图层的概念,遮罩图层動画是Flash中的壹种很重要的動画类型，诸多效果丰富的動画都是通過遮罩動画来完毕的，在Flash的图层中有壹种遮罩图层类型，為了得到特殊的显示效果，可以在遮罩图层上创立壹种人字形状的视窗，遮罩层下方的對象就可以通過该“视窗”显示出来，而视窗之外的對象就将不會显示。,2遮罩图层的作用,在Flash動画中，“遮罩”重要有两种用途，壹种作用是用在整個場景或壹种特定的区域，使場景外的對象或特定区域外的對象不可見；另壹种作用是用来遮罩某壹元件的壹部分，從而实現某些特殊的效果。,47,11.8 遮罩動画,11.8.2 遮罩動画的创立措施,1创立遮罩,在Flash中设有壹种专门的按钮来创立遮罩层，遮罩层其实就是由壹般图层转化而来的。只要在某個图层上右击，在弹出菜單中选择“遮罩层”，该图层就會生成遮罩层，“层图標”就會從壹般层图標变成遮罩层图標，系统就會把遮罩层下面的壹层关联為“被遮罩层”，在缩進的同步图標变為，假如想关联更多层被遮罩，只要把這些图层拖到被遮罩层就可以了，如图11-133所示。,图11-133 壹种遮罩层下面有多种被遮罩层,48,11.8 遮罩動画,2构造遮罩层和被遮罩层的元素,遮罩层的图形對象播放時是看不到的，遮罩层中的内容可以是按钮、影片剪辑、图形、位图、文字等，但不能使用线条。假如壹定要用线条，可以将线条转化為“填充”。,被遮罩层中的對象只能透過遮罩层中的對象被看到。在被遮罩层，可以使用按钮、影片剪辑、图形、位图、文字、线条。,3遮罩中可以使用的動画形式,可以在遮罩层和被遮罩层中分别同步使用形状渐变動画、動画补间動画引导线動画等動画手段，從而使遮罩動画变成壹种可以施展無限想象力的创作空间。,49,11.8 遮罩動画,11.8.3 应用遮罩時的技巧,（1）遮罩层的基本原理是：可以透過该图层中的對象看到“被遮罩层”中的對象及其属性（包括它們的变形效果），不過遮罩层對象中的許多属性如渐变色、透明度、颜色和线条样式等却是被忽视的。例如說不能通過遮罩层的渐变色来实現被遮罩层的渐变色变化。,（2）要在場景中显示遮罩效果，可以锁定遮罩层和被遮罩层。,（3）不能用壹种遮罩层试图遮罩另壹种遮罩层。,（4）遮罩可以应用在GIF動画上。,（5）在制作過程中，遮罩层常常挡住下层的元件，影响视线，無法编辑。這時可以按下遮罩层“時间轴”面板上的显示图层轮廓按钮，使之变成使遮罩层显示边框形状，在這种状况下，還可以拖動边框调整遮罩图形的外形和位置。,（6）在被遮罩层中不能放置動态文本。,50,11.8 遮罩動画,11.8.4 实践技能训练探照灯效果,（1）新建壹种Flash文档，设定大小為500200px，设定背景颜色為黑色。,（2）按Ctrl+F8组合键插入壹种图形元件，命名為mask。單击工具箱中的椭圆工具，按住Shift键，在其中绘制壹种正圆，并且以元件的中心拾字為中心點放置。,（3）單击按钮，添加图层2，右键图层2，在快捷菜單中选择“遮罩层”命令，将其定义為遮罩层，同步图层1成為被遮罩层。,（4）單击按钮，取消图层锁定，按Ctrl+L组合键，打開库，选用图层2的第1帧，将库中的元件mask拖到場景图层1的第1帧中。,（5）选用图层1的第1帧，用文本工具在場景中输入“探照灯效果”，设置字体為黑体，字号為58号，颜色為#FFFF00，置于中央位置。,51,11.8 遮罩動画,（6）在图层2的第1帧中，调整其中元件mask的大小和位置，使其位于文字的左侧，如图11-134所示。,图11-134 第1帧的状态图,52,11.8 遮罩動画,（7）單击图层1的第40帧，按“F5”键插入壹般帧，使文字保持40帧。,（8）分别單击图层2的第20帧和第40帧，按F6插入关键帧。,（9）單击图层2的第20帧，选择其中的元件mask，将其移動至文字的右侧。,（10）在图层2的第1帧和第20帧，在属性菜單中设置补间為“動画”，创立動画，如图11-136所示。,图11-136 创立動画的時间轴效果,（11）保留文档并测试影片。,53,11.9 创立動画补间動画,11.9.1 動画补间動画的概念,（1）動画补间動画的概念。在壹种关键帧上放置壹种元件，然後在另壹种关键帧变化這個元件的大小、颜色、位置、透明度等，Flash根据两者之间的帧创立的動画被称為動画补间動画。,（2）构成動画补间動画的元素。构成動画补间動画的元素是元件，包括影片剪辑、图形元件、按钮、文字、位图和组合等，但不能是形状，只有把形状“组合”转换成“元件”後才能作動画补间動画的素材。,54,11.9创立動画补间動画,（3）動画补间動画在時间帧面板上的体現。動画补间動画建立後，時间轴面板的背景色变為淡紫色，在起始帧和結束帧之间有壹种箭頭，如图11-137所示。,图11-137 動画补间動画在時间轴上的体現,（4）创立動画补间動画的措施。在動画開始播放的地方创立或选择壹种关键帧并设置壹种元件，壹帧中只能播放壹种项目，在動画要結束的地方创立或选择壹种关键帧并设置该元件的属性。再單击開始帧，在“属性”面板上單击“补间”旁边的下拉按钮，在弹出的菜單中选择“動画”，或用鼠標右键單击帧，在弹出的菜單中选择“创立补间動画”，就建立了“動画补间動画”。,55,11.9 创立動画补间動画,11.9.2 動画补间動画的属性面板,在時间线“動画补间動画”的起始帧上單击，帧属性面板如图11-138所示。,图11-138 動画补间動画的“属性”面板,（1）單击“缓動”右边的按钮，弹出拉動滑杆，拖動上面的滑块或直接输入数值，可设置参数值，设置完後，動画补间動画的效果會按照下面的设置作出對应的变化：,1）在-1-100之间的负值，動画运動的速度從慢到快，朝运動結束的方向加速补间。,2）在1100之间的正值，動画运動的速度從快到慢，朝运動結束的方向減慢补间。,56,11.9 创立動画补间動画,默认的状况下，补间帧之间的变化速率是不变的。,（2）單击“编辑”按钮，可以打開“自定义缓入/缓出”對话框，设置更丰富的变化。,（3）在“旋转”下拉列表框中有四個选项，选择“無”（默认设置）可静止元件旋转；选择“自動”可使元件在需要最小動作的方向上旋转壹次；选择“顺時针”（CW）或“逆時针”（CCW），并在背面输入数字，可使元件在运動時顺時针或逆時针旋转對应的圈数。,（4）选择“调整到途径”复选框，将补间元素的基线调整到运動途径。此项功能重要用于引导线运動。,（5）选择“同步”复选框，将使图形元件实例的動画和主時间轴同步。,（6）选择“對齐”复选框後，根据其注册點将补间元素附加到运動途径，此功能也用于引导线运動。,57,11.9 创立動画补间動画,11.9.3 实践技能训练蜜蜂采蜜,该实例的最终效果如图11-139所示。蜜蜂從舞台的右侧飞入，弯弯曲曲落到花丛中。,图11-139 蜜蜂飞舞,58,