flashcs6教程9.ppt

单击此处编辑母版标题样式,单击此处编辑母版文本样式,第二级,第三级,第四级,第五级,*,第,9,章 经典实例：制作下雪中的风景图片,9.1,要点分析,9.2,ActionScript,语句应用概述,9.2.1,了解,ActionScript,的语法规则,9.2.2,在时间轴上输入代码,9.2.3,创建单独的,ActionScript,文件,9.3,处理对象,9.3.1,设置对象属性,9.3.2,指定对象的动作,9.3.3,事件,9.4,制作下雪效果动画,1,9.2,ActionScript,语句应用概述,ActionScript,最初是为,Flash,产品开发的一种简单的脚本语言，现在已是一种完全的面向对象的编程语言，功能强大，类库丰富，语法类似,JavaScript,，多用于,Flash,互动性、娱乐性、实用性开发等。,ActionScript,语句一般由语句、变量和函数组成。具体来说，是由变量、函数、表达式和运算符等组成，其属性和使用方法如下。,1,变量,在,ActionScript,语句中，变量用来存储数值、逻辑值、对象、字符串以及动画片段等信息，一个变量由变量和变量值组成，变量名用于区分不同的变量；变量值用于确定变量的类型和大小，它可以随特定的条件而改变。在,Flash,中为变量命名时必须遵循以下规则。,变量,名必须是一个标识符。标识符的第一个字符必须为字母、下划线或美元符号,($),。其后字符可以是数字、字母、下划线或美元符号。,在,一个动画中变量名必须是唯一的。,变量,名不能是关键字或,ActionScript,文本，如,true,、,false,、,null,等。,变量不能是,ActionScript,语言中的任何元素，例如类名称,。,9.2.1,了解,ActionScript,的语法规则,9.1,要点分析,2,变量,名区分大小写，当变量中出现一个新单词时，新单词的第一个字母要大写。,用户在,Flash,中声明变量后，该变量就包含一个默认值，该值取决于它的,数据类型,(,如表,9-1,所示,),，此时的变量处于“未初始化”状态，当首次设置变量值时，就是初始化,变量。,图表,9-1,变量的默认值,数据类型,默认值,Boolean,false,int,0,Number,NaN,Object,null,String,null,uint,0,未声明（与类型注释,*等效）,undefined,其他所有类（包括用户定义的类）,null,2,数据类型,数据类型描述一个数据片段以及可以对其执行的各种操作。在创建变量、对象实例和函数定义时，应使用数据类型来指定要使用的数据的类型。在,ActionScript,中内置的数据类型有,String,、,Numeric,、,Boolean,、,Null,以及,void,等。除此之外，程序员还可以定义一些数据类型，如,MovieClip,、,TextField,、,Date,等。,3,String,：表示文本值，例如一本书的章节名称或者标题。,Numeric,：表示数值，在,ActionScript,中包含,3,种特定的数据类型，分别是,Number(,包括含有或者不含有小数的值在内的任何数值,),、,int(,不含有小数的整数,),和,uint(,无符号的整数，即非负整数,),。,Boolean,：一个,true,或,false,值，例如两个值是否相等。,Null,：只包含一个,null,值。该值是,String,数据类型以及定义复合数据类型的所有类的默认值。,void,：只包含一个特殊值,undefined用户只能将,undefined,值赋值给未定义数据类型的变量。,MovieClip,：影片剪辑元件。,TextField,：动态文本字段或输入文本字段。,Date,：表示单个值，如时间中的某个片刻,。而该,日期值实际上,表示年,、月、时、分、秒等几个值，它们都是单独的数字动态文本字段或输入文本,字段。,3,ActionScript,的基本,语法,在了解,ActionScript,语句的组成后，还需要熟悉,ActionScript,语句的基本语法，才能利用,ActionScript,语句编辑出具有交互功能的脚本。,ActionScript,的基本语法如下。,点,语法：在,ActionScript,语句中，点,(.),用于指定访问对象的属性和方法，并标识指向的动画片段或变量的目标路径。它包括,_root,和,_parent,两个特殊的别名。其中，,_root,用于创建一个绝对路径，表示动画中的主时间轴，而,_parent,则用于对嵌套在当前动画中的动画片段进行引用。,4,圆括号,(),：用于放置使用动作时的参数，定义一个函数，以及对函数进行调用,等，也可以用来改变,ActionScript,的优先级。,大括号,：用于将代码分成不同的块，以作为区分程序段落的标记。,分号：在,ActionScript,语句的结束处，用来表示语句的结束。,关键字：是指具有特殊含义且供,ActionScript,进行调用的特定单词。在,ActionScript,中，较为重要的关键字主要有,Break,、,Continue,、,Delete,、,Else,、,For,、,Function,、,IF,、,In,、,New,、,Return,、,This,、,Typeof,、,Var,、,Void,、,While,和,With,等。,字母的大小写：在,ActionScript,中，除了关键字区分大小写之外，其余,ActionScript,的大小写字母可以混用，但是遵守规则的书写约定可以使脚本代码更容易被区分，便于阅读。,注释：在编辑语句时，为了便于语句的阅读和理解，可以在语句后面添加注释。添加注释的方法是直接在语句后面输入“,/”,，然后输入注释的内容即可。注释内容以灰色显示，它的长度不受限制，也不会执行。,在,Flash CS6,中，可以对时间轴上的任何帧添加代码，该代码将在影片播放期间播放头进入该帧时执行。方法是在,Flash,窗口中选择“窗口”,|,“动作”命令，或按,F9,键打开,“动作”面板，如图,9-1,所示，在脚本编辑窗格中可以输入编辑代码。,9.2.2,在时间轴上输入代码,5,图,9-1,“动作”面板,1,动作工具箱,面板的左上方为动作工具箱，分别列出了,Flash,中能用到的所有动作脚本。只要将该列表框中的脚本命令插入到脚本编辑窗格即可进行相关的操作。,动作工具箱中的动作脚本命令很多，用户可以借助键盘上的一些按键更加快捷地进行操作。,Home,键：选择动作工具箱中的第一项。,End,键：选择动作工具箱中的最后一项。,键：选择动作工具箱中的前一项,。,键：选择动作工具箱中的下一项,。,6,图,9-2,查看全部脚本命令的索引,键：展开动作工具箱中的父命令，再按该键可以将鼠标移动至相应的子命令。,键：由子命令返回到父命令。,Enter,键或空格键：展开或折叠文件夹。,在动作工具箱的最下面给出了全部脚本命令的索引，按照命令的首字符进行排序，如图,9-2,所示。,2,动作说明区域,在动作工具箱中将鼠标移动至某个动作命令上，将会出现该命令的相应提示；如果选中该动作命令，在动作说明区域将会出现对该命令的描述，如图,9-3,所示。,图,9-3,查看动作命令的提示说明信息,3,脚本导航器,“动作”面板的左下方窗格为脚本导航器，可以查看动画中已经添加脚本的对象的具体信息,(,如所在图层、帧和场景等信息,),。通过该列表框，可以在,Flash,文档中的各个脚本间快速切换。,7,4,脚本编辑窗格,在脚本编辑窗格中可以直接为选择的对象输入脚本命令。如果用户单击脚本导航器中的某一项目，与该项目关联的脚本也将会显示在脚本编辑窗格中，并且播放头将移到时间轴上的相应位置。双击脚本导航器中的某一项目可固定脚本，将其锁定在当前位置。,在脚本编辑窗格上方有一些辅助功能图标，其含义如下。将新项目添加到脚本中”,图标：,单击该图标，在弹出的菜单中列出了可用于创建脚本类型的动作命令，如图,9-4,所示,图,9-4,单击“将新项目添加到脚本中”图标,“删除所选动作”图标：在脚本编辑窗格选择某动作脚本，然后单击该图标可以将其删除。,“查找”图标：单击该图标，将会弹出“查找和替换”对话框，使用该对话框可以查找并替换脚本中的文本，如图,9-5,所示。,8,图,9-5,“查找和替换”对话框,“插入目标路径”图标：单击该图标，将会弹出“插入目标路径”对话框，在此可以为脚本中的某个动作设置绝对或相对目标路径，如图,9-6,所示。,图,9-6,“插入目标路径”对话框,“向上移动所选动作”图标：单击该图标，在脚本编辑窗格中向上移动选中的动作。,“向下移动所选动作”图标：单击该图标，在脚本编辑窗格中向下移动选中的动作。,“显示,/,隐藏工具箱”图标：单击该图标，可以隐藏左侧的动作工具箱，如图,9-7,所示。再次单击该图标，可以显示出被隐藏的动作工具箱。,“代码片断”图标：单击该图标，将会弹出“代码片断”面板，如图,9-8,所示。在此选择某动作，然后单击动作选项右侧的“显示说明”图标，可以在弹出对话框中查看动作说明信息，如图,9-9,所示；若单击“显示代码”图标，可以在对话框查看该动作的代码，如图,9-10,所示；若单击“添加到当前帧”图标，可以对当前选中的影片剪辑元件应用该动作；若单击“复制到剪贴板”图标，可以复制选中的动作。,9,图,9-7,动作工具箱被隐藏后的“动作”面板,图,9-8,“代码片断”面板,“通过从动作工具箱选项项目来编写脚本”图标：单击该图标，可以在脚本编辑窗格中编辑添加的动作脚本，同时会隐藏动作说明区域，如图,9-11,所示。,“帮助”图标：显示脚本窗格中所选,ActionScript,元素的参考信息。例如，如果单击,import,语句，再单击该图标，“帮助”面板中将显示,import,的参考信息。,图,9-9,查看动作说明信息,图,9-10,查看动作代码,10,图,9-11,在脚本编辑窗格中编写脚本,5,菜单项,如果用户单击“动作”面板右上角的“菜单项”图标，则可以打开,“动作”面板的选项菜单，如图,9-12,所示。,图,9-12,“动作”面板的选项菜单,11,图,9-13,“转到行”对话框,图,9-14,警告对话框,“语法检查”：检查当前脚本。,“显示代码提示”：选中该命令，在输入脚本时，可以检测到正在输入的动作并显示代码提示。,“导入脚本”：导入外部,AS,文件。,“导出脚本”：从“动作”面板中导出脚本。,该菜单中的命令的含义分别如下。,“,重新加载代码提示”：在不重新启动软件的情况下重新加载代码提示。,“固定脚本”,：选择该命令，可以使脚本出现在“动作”面板中脚本编辑窗格左下角的选项卡内。,“关闭脚本”,：取消固定脚本。,“关闭所有脚本”,：取消所有固定脚本。,“转到行”,：在脚本中搜索文本，可利用该命令转到脚本中的特定行。选择该命令后，将打开“转到行”，如图,9-13,所示。用户只需要在“行号”文本框中输入数值，并单击“确定”按钮即可快速地转到相应的行。,“查找和替换”,：查找和替换脚本中的文本。,“再次查找”,：用于再次查找所需要的文本。,“自动套用格式”,：按自动套用格式设置代码格式。如果脚本中有语法错误，执行该命令会弹出如图,9-14,所示的警告,对话框。,12,图,9-15,“打印”对话框,图,9-16,“首选参数”对话框,“打印”：选择该命令，将打开“打印”对话框，如图,9-15,所示。用户可以设置相应的打印参数，再单击“确定”按钮打印脚本。,“脚本助手”：选中该命令，将使用“脚本助手”模式。如果脚本中有错误，将弹出警告框。,“,Esc,快捷键”：选择该命令，可查看快捷键列表。,“隐藏字符”：选择该命令后，隐藏,ActionScript,语句中的空格、制表符和换行符等字符。,“行号”：选中该命令，会在该命令前出现“”标记，此时在脚本窗格中会显示行编号。,“自动换行”：启用或禁用自动换行。,“首选参数”：选择该命令，将打开“首选参数”对话框，如图,9-16,所示。,13,6,添加,ActionScript,语句,在熟悉了“动作”面板后，下面学习如何在时间轴上添加,ActionScript,语句，具体操作步骤如下。,步骤,1,在“时间轴”面板中选择要添加,ActionScript,语句的关键帧，如图,9-17,所,示，然后在菜单栏中选择“窗口”,|“,动作”命令，打开“动作”面板。,步骤,2,在“动作”面板右侧单击“通过从动作工具箱选择项目来编写脚本”图标，接着在脚本编辑窗格中输入如图,9-18,所示的语句,(,注意大小写,),。,图,9-17,选择要添加,ActionScript,语句的帧的位置,步骤,3,语句输入完毕后，关闭“动作”面板，此时即可在“时间轴”面板中看到选择的关键帧中出现一个“,”符号，表示该帧已经被添加了,ActionScript,语句，如图,9-19,所示。,图,918,输入,ActionScript,语句,14,由于在时间轴上输入代码容易导致无法跟踪哪些帧包含哪些脚本，随着时间的推,移，应用程序会越来越难以维护，因此，如果用户要构建较大的应用程序或包含重要的,ActionScript,代码时，建议在单独的,ActionScript,源文件,(,扩展名为,.as,的文本文件,),中编辑代,码。,在,Flash CS6,中，创建,ActionScript,源文件的方法如下。,步骤,1,在,Flash,窗口中选择“文件”,|,“新建”命令，打开“新建文档”对话框。,步骤,2,在“常规”选项卡下的“类型”列表框中单击“,ActionScript 3.0,类”选 项，在“类名称”文本框中输入类名称，再单击“确定”按钮，定义一个,ActionScript,类，如图,9-20,所示。,步骤,3,接着即可像对任何内置的,ActionScript,类一样，在脚本编辑窗口中通过创建 该类的实例并使用它的属性、方法和事件来访问该类中的,ActionScript,代码，如图,9-21,所示。,9.2.3,创建单独的,ActionScript,文件,图,9-19,查看添加语句后的帧,15,图,9-21,脚本编辑窗口,图,9-20,定义一个,ActionScript,类,属性是对象的基本特征，如影片剪辑元件的位置、大小和透明度等，它表示某个对象中绑定在一起的若干数据块中的一个。下面制作一个可以输入数值控制影片剪辑属性的动画，在该动画中应用透明度属性控制，具体操作步骤如下。,步骤,1,在,Flash,窗口中新建一个空白文档，然后将需要的素材导入到库中，如图,9-22,所示。,9.3.1,设置对象属性,程序是电脑执行的一系列步骤或指令。从概念上理解，可以认为程序是一个很长的指令列表。但是在面向对象的编辑中，程序指令被划分到不同的对象中，构成代码功能,块。而,ActionScript,就是一种面向对象的编程语言，目前最高版本是,3.0,版。下面就来介绍如何使用,ActionScript,语句处理对象。,9.3,处理对象,16,图,9-23,创建影片剪辑元件,图9-22,导入需要的素材,步骤,2,按,Ctrl+F8,组合键打开“创建新元件”对话框，输入元件名称，并设置元件类型为“影片剪辑”，再单击“确定”按钮，如图,9-23,所示。,步骤,3,从“库”面板中拖动“海豚,.png,”文件到元件编辑窗口中，如图,9-24,所示，再返回场景编辑窗口。,步骤,4,从“库”面板中将“,13.bmp,”文件拖至舞台中，并调整图形的大小和位置，使其和舞台重合，接着新建图层,2,，如图,9-25,所示。,步骤,5,锁定图层,1,，然后从“库”面板中依次将“海豚剪辑”元件拖至舞台中，接着在“属性”面板中将其名称改为“,ht,”，如图,9-26,所示。,步骤,6,新建图层,3,，然后使用绘图工具在舞台中绘制粉红色的心型图形，接着在该图上方添加“透明”文本，如图,9-27,所示。,17,图,9-24,编辑元件,图,9-26,修改实例名称,图,9-25,设置动画背景,图,9-27,绘制心型图形,18,步骤,7,使用矩形工具在舞台中绘制一个笔触颜色为“玫红色”、填充颜色为“白,色”的矩形，接着在工具箱中单击“文本工具”图标，在“属性”面板中的“文本类型”下拉列表框中选择“输入文本”选项，如图,9-28,所示。,步骤,8,在矩形上方绘制一个略小于矩形的黑色文本框，并将其置于矩形中间位置，接着在“属性”面板中设置其名称为“,c,”，如图,9-29,所示。,图,9-28,设置文本类型,图,9-29,绘制文本框,步骤,9,在菜单栏中选择“窗口”,|,“公用库”,|,“,Buttons,”命令，打开“公用库”面,板，如图,9-30,所示。,步骤,10,选择要使用的按钮元件，将其拖至舞台中，如图,9-31,所示。,步骤,11,单击按钮元件实例，然后在“属性”面板中调整实例大小，使其与矩形同,高，再设置该实例名称为“,qr,”，如图,9-32,所示。,步骤,12,在图层,3,中选择第,1,帧，然后按,F9,键打开“动作”面板，接着在面板中输入如图,9-33,所示的代码。,19,图,9-30,打开“公用库”面板,图,9-31,选择按钮元件,图,9-32,设置按钮元件名称,图,9-33,“动作”面板,20,从以上,4,条语句可以发现指定对象要进行某动作时的结构语法如下：,对象名称,(,变量名,).,动作名,();,由此可见，指定对象操作和设置对象属性非常相似，小括号中指定对象要执行的动作的值，这些值称为动作的参数。如果动作本身的意义非常明确，可以不需要额外指定动作参数，但是书写时仍然需要小括号。如前面,4,句中的,play(),动作和,stop(),动作，因自身的意义非常明确，可以不指定具体参数；而,gotoAndStop(),动作和,gotoAndPlay(),动作就需要指定特定的帧。,这里要介绍的事件是指所发生的、,ActionScript,能够识别并可响应的事情。许多事件与用户设置的交互动作有关，如用户单击按钮或按键盘上的键等。无论编写什么样的事件处理代码，都必须包括事件源、事件和响应,3,个元素，它们的含义分别如下。,事件,源：又称“事件目标”，指发生事件的对象，例如单击,replay,按钮，则,replay,按钮就是事件源。,事件,：指将要发生的事情。对事件的识别非常重要，因为一个对象有时会触发多个事件。,响应,：指事件发生时执行的,操作。,编写事件代码时，要遵循以下基本,结构,：,function,eventResponse(eventObject:EventType):void,/,响应事件而执行的动作,9.3.3,事件,21,eventSource.addEventListener(EventType.EVENT_NAME,eventResponse);,在上述结构中，加粗显示的是占位符，用户可以根据实际情况进行改变。在结构中首先定义了一个函数，,eventResponse,就是函数的名称，,eventObject,是函数的参数，,EventType,是该参数的类型，这与声明变量类似。在大括号中是事件发生时执行的指令。其次调用源对象的,addEventListener(),动作，表示当事件发生时执行该函数。,本节将通过制作下雪效果动画来帮助读者进一步加深对本章知识的掌握，具体操作步骤如下。,步骤,1,在,Flash,窗口中新建“下雪,.fla,”文件,(,文件大小为,4000,像素,750,像素,),，并在,“时间轴”面板中重命名图层,1,为“背景”，如图,9-36,所示。,步骤,2,在菜单栏中选择“文件”,|,“导入”,|,“导入到库”命令，弹出“导入到库”对话框，选择要使用的图片，再单击“打开”按钮，如图,9-37,所示。,9.4,制作下雪效果动画,图,9-36,新建“下雪,.fla,”文件,图,9-37,“导入到库”对话框,22,图,9-39,对图层,1,应用“,1.png,”图片,图,9-38,对背景图层应用“背景”图片,步骤,5,使用类似方法，在“时间轴”面板中依次新建图层,2,7,，并从“库”面板中将图片,2,7,分别插入到各图层中，再调整各图片的大小和位置，最终效果如图,9-40,所示。,图,9-40,编辑其他图片,步骤,3,从“库”面板中拖动“背景”图片到舞台中，然后锁定“背景”图层，如 图,9-38,所示。,步骤,4,在“时间轴”面板中新建图层,1,，然后将“库”面板中的“,1.png,”文件拖动到舞台中，并调整图片的位置，如图,9-39,所示。,23,图,9-34,打开动画预览窗口,步骤,13,关闭“动作”面板，按,Ctrl+Enter,组合键打开动画预览窗口，在文本框中输,入“,20,”，再单击,Enter,按钮，如图,9-34,所示。,步骤,14,这时即可看到海豚实例的透明度改变了，如图,9-35,所示。,图,9-35,查看设置透明度后的效果,在,Flash,中，如果用户使用时间轴上的几个关键帧和基本动画制作了一个影片剪辑元件，可以对该对象进行播放、停止或者指定它将播放头移到特定的帧等动作。,myFilm.play();/,指示名为,myFilm,的影片剪辑元件开始播放,myFilm.stop();/,指示名为,myFilm,的影片剪辑元件停止播放,myFilm.gotoAndStop(10);,/,指示名为,myFilm,的影片剪辑元件将其播放头移到第,10,帧，然后停止播放,myFilm.goyoAndPlay(5);/,指示名为,myFilm,的影片剪辑元件跳到第,5,帧开始播放,9.3.2,指定对象的动作,24,步骤,6,在“时间轴”面板中新建图层,8,，然后在“库”面板中选择要使用的树图片，并将其拖动到舞台中，再使用任意变形工具和选择工具调整图片的大小和位置，效果如 图,9-41,所示。,步骤,7,按,Ctrl+A,组合键选择舞台中的所有图片并右击，在弹出的快捷菜单中选择,“转换为元件”命令，如图,9-42,所示。,图,9-41,对图层,8,应用树图片,图,9-42,选择“转换为元件”命令,步骤,8,弹出“转换为元件”对话框，在“名称”文本框中输入元件名称，并设置元件类型为“图形”，再单击“确定”按钮，如图,9-43,所示。,步骤,9,在“时间轴”面板中将图层,8,以外的图层删除，并重命名图层,8,为“背景”。然后在“库”面板中单击“新建文件夹”图标，新建“,pic,”文件夹，接着将导入的图片移动到该文件夹中，如图,9-44,所示。,步骤,10,在“属性”面板中修改,Flash,文件的大小，将高度值调整为,850,，如图,9-45,所,示。,25,步骤,11,使用类似方法，在舞台中添加其他树木，效果如图,9-46,所示。,图,9-43,“转换为元件”对话框,图,9-44,使用文件夹管理导入到库中的图片,步骤,12,新建图层,3,，然后将“雪花,.png,”文件拖至舞台中，接着在“变形”面板中调整图形大小，如图,9-47,所示步骤,13,右击“雪花,.png,”文件，在弹出的快捷菜单中选择“转换为元件”命令，接着在弹出的对话框中设置元件参数，再单击“确定”按钮，将图片转换为图形元件，如图,9-48,所示。,图,9-45,调整文件高度,图,9-46,添加其他树木,26,步骤,14,按,Ctrl+F8,组合键打开“创建新元件”对话框，在此创建“,snow,”影片剪辑元件，如图,9-49,所示。,图,9-47,“变形”面板,图,9-48,“转换为元件”对话框,步骤,15,进入“雪花”影片剪辑元件编辑窗格，将“雪”元件拖至舞台中，接着在,“变形”面板中按,40%,的比例缩放元件，如图,9-50,所示。,步骤,16,在第15,帧和第,30,帧位置处分别插入关键帧，接着右击图层,1,，在弹出的快捷菜单中选择“添加传统运动引导层”命令，如图,9-51,所示。,图,9-49,“创建新元件”对话框,27,步骤,17,使用绘图工具在舞台中绘制一段小弧线作为引导轨迹，如图,9-52,所示。,步骤,18,在图层,1,中选择第,1,帧上的元件，按住中心点将其移动到引导线的起点上，如图,9-53,所示。,图,9-50,调整实例大小,图,9-51,选择“添加传统运动引导层”命令,图,9-52,绘制弧线,图,9-53,将元件实例移动到引导线起点上,28,步骤,19,在图层,1,中选择第,15,帧上的元件，按住中心点将其移动到引导线的终点上，如图,9-54,所示。,步骤,20,在图层,1,中选择第,30,帧上的元件，按住中心点将其移动到引导线的起点上，接着在第,1,、,15,、,30,帧之间创建补间动画，如图,9-55,所示。,步骤,21,返回场景，将舞台中设计的雪景转换为“雪景”影片剪辑元件，接着删除,“背景”图层以外的图层，接着在“背景”图层中删除第,1,帧上的关键帧，在第,5,帧处插入关键帧，并将“雪景”影片剪辑元件拖至舞台中，布局雪景背景，如图,9-56,所示。,步骤,22,调整,Flash,文件大小为,800,像素,600,像素，按文件高度调整“雪景”影片剪辑元件实例大小。,步骤,23,新建“雪”图层，然后右击第,5,帧，在弹出的快捷菜单中选择“转换为关键,帧”命令，如图,9-57,所示。,图,9-54,将元件实例移动到引导线终点上,图,9-55,创建补间动画,29,步骤,24,将,snow,影片剪辑元件拖至舞台的适合位置，并在“属性”面板中设置实例名称为“,snowflake,”，如图,9-58,所示。,步骤,25,新建“进度”图层，然后将第,5,帧转换为关键帧，接着使用矩形工具绘制一个,2800,像素,500,像素的白色长条，如图,9-59,所示。,步骤,26,创建一个名为“滑块”的影片剪辑元件，并进入该元件编辑窗格，使用矩形工具绘制如图,9-60,所示的图形,(,填充颜色为,#263E6F)步骤,27,新建“滑块”图层，然后将第,5,帧转换为关键帧，接着将“滑块”影片剪辑元件拖至舞台中的长条上，位置如图,9-61,所示。再在“属性”面板中设置该实例名称为“,Scroller,”。,图,9-56,布局雪景背景,图,9-57,选择“转换为关键帧”命令,30,图,9-58,使用,snow,影片剪辑元件,图,9-59,绘制长条,图,9-60,编辑“滑块”影片剪辑元件,图,9-61,使用“滑块”影片剪辑元件,31,步骤,28,在“背景”图层中选中第,5,帧上的实例，按,F9,键打开“动作”面板，输入以下代码，如图,9-62,所示。,onClipEvent(enterFrame),scrollPos=(_root.Scroller._x-16)*1.10803;,if(scrollPos=800),homeX=-1140;,else,homeX=scrollPos/400*-570;,thisX=_x;,diffX=homeX-thisX;,图,9-62,在“背景”图层中添加代码,32,moveX=diffX/2;,_x=thisX+moveX;,步骤,29,在“雪”图层中选中第,5,帧上的实例，接着在“动作”面板中输入以下代码，如图,9-63,所示。,onClipEvent(load),if(this._name=snowflake),_parent.i=0;,/thisalpha=_parent.randRange(80,100);,this._width=_parent.randRange(3,10);,this._height=this._width;,this._x=_parent.randRange(-100,_parent.mw+100);,this._y=_parent.randRange(0,-20);,speed=_parent.randRange(2,10);,this.cacheAsBitmap=true,/+,onClipEvent(enterFrame),if(this._name=snowflake),return;,图,9-63,在“雪”图层中添加代码,33,if(this._y _parent.mh),_global.kar_adedi-;,this.removeMovieClip();,return;,import flash.display.BitmapData;,import flash.geom.Rectangle;,import flash.geom.Matrix;,import flash.geom.Point;,var currPoint:Point=new Point();,currPoint.x=this._x;,currPoint.y=this._y;,if(_root.outline_bmphitTest(_root.destPoint,0,currPoint),var karmatrix1:Matrix=new Matrix();,var karmatrix2:Matrix=new Matrix();,karmatrix1.scale(this._xscale/100,this._yscale/100);,var translateMatrix1:Matrix=new Matrix();,translateMatrix1.translate(this._x,this._y);,karmatrix1.concat(translateMatrix1);,_root.bitmap_1.draw(this,karmatrix1);,karmatrix2.scale(this._xscale/300,this._yscale/300);,var translateMatrix2:Matrix=new Matrix();,34,translateMatrix2.translate(this._x,this._y);,karmatrix2.concat(translateMatrix2);,_root.outline_bmp.draw(this,karmatrix2);,_global.kar_adedi-;,this.removeMovieClip();,return;,this._y+=speed;,this._x+=_parent.interval-3;,步骤,30,在“滑块”图层中选中第,5,帧上的实例，接着在“动作”面板中输入以下代,码，如图,9-64,所示。,on(press),this.startDrag(false,16,this._y,800,this._y);,on(release),this.stopDrag();,on(releaseOutside),this.stopDrag();,图,9-64,在“滑块”图层中添加代码,35,步骤,31,新建图层，然后将第,5,帧转换为关键帧，接着打开“动作”面板，输入以下代码。,var intID;,_global.basladi=true;,speed1=.9;,mw=800;,mh=800;,snowint=60;,_global.kar_adedi=0;,function randRange(min,max),var randomNum=Math.round(Math.random()*(max-min)+min;,return randomNum;,setInterval(CursorMovement,500);,function CursorMovement(),mc._x=speed1*(mc._x-_xmouse)+_xmouse;,interval=(mc._x/mw*6);function snow(),if(!_global.basladi),return;,if(i 500),i=0;,36,return;,if(_global.kar_adedi 500),return;,for(t=0;t 5;t+),i+;,duplicateMovieClip(snowflake,snowflake+i,i);,_global.kar_adedi+=5;,intID=setInterval(snow,snowint);,步骤,32,再新建一图层，然后选中第,1,帧，接着打开“动作”面板，输入以下代码。,totalBytes=this.getBytesTotal();loadedBytes=this.getBytesLoaded();,remainingBytes=totalBytes-loadedBytes;,percentDone=int(loadedBytes/totalBytes*100);,bar.gotoAndStop(percentDone);,if(_framesloaded=_totalframes),gotoAndPlay(3);,37,步骤,33,将第,5,帧转换为关键帧，接着在“动作”面板输入以下代码。,birdsclip.useHandCursor=false;,clickbar.useHandCursor=false;,foreground.lightroll.lightoverButton.useHandCursor=false;,main.tabChildren=false;,foreground.tabChildren=false;,clickbar.tabEnabled=false;,left.tabEnabled=false;,right.tabEnabled=false;,birdsclip.tabChildren=false;,MovieClip134.tabEnabled=false;,SoundButton.tabEnabled=false;,Scroller.tabEnabled=false;,movOpen=0;,loadClick=0;,whoClick=;,stop();,Color.prototype.setTint=function(r,g,b,amount),var _reg2=new Object();,_reg2.ra=_reg2.ga=_reg2.ba=100-amount;,var _reg3=amount/100;,_reg2.rb=r*_reg3;,38,_reg2.gb=g*_reg3;,_reg2.bb=b*_reg3;,this.setTransform(_reg2);,;,_root.musicStream.onSoundComplete=function(),musicStream.start();,;,步骤,34,至此，该作品制作完成，按,Ctrl+Enter,组合键预览动画效果，如图,9-65,所示。,步骤,35,使用鼠标拖动滑块，移动动画背景图形，如图,9-66,所示。,图,9-66,拖动滑块,图,9-65,预览动画效果,39,