实训14FlashAS2的简单运用.doc

实训14：Flash AS2的简单运用2012.5一、实训目的：1、了解ActionScript2.0的运用方法，学习对按钮或关键帧添加动作代码。2、掌握用鼠标点击按钮来控制影片播放流程的动作代码。3、了解输入文本与动态文本，结合实例学习AS2中简单的变量命名方法及与运算表达式的写法。4、学习常用的文字闪光效果的制作方法。5、了解用AS2代码复制影片剪辑（MC）的方法，感受AS2编程的魅力。6、了解AS2中对象响应键盘事件的方法。二、实训要求本实训任务比较困难。要求：1.需要制作2个场景。2.在场景1播放文字闪光效果，点击“暂停”按钮可以停止播放；点击“继续播放“按钮可以继续播放；点击“Replay”从第1帧起开始播放；点击“下一场景”则转到场景2的第1帧处开始播放。3.在场景1中还有简单的加法计算功能。4.在场景2中有用AS2代码实现的萤火虫效果，以及用键盘控制按钮移动的效果。具体过程请参照下面的实训流程。本作业是开放式作业，按钮的具体外观、文字以及动画效果等自己设计。三、实训流程（一）新建Flash文件(ActionScript 2.0)，保存为“实训14-姓名.fla”。在图层第帧上添加动作代码，以禁止缩放、禁止菜单和自动全屏显示动画。代码如下：fscommand (fullscreen, true);fscommand (allowscale, False);fscommand (showmenu, False);注意：必须运行导出的swf文件才能看到以上代码起效果。（二）新建一个“计算”按钮，拖到图层1第1帧中下区域，然后在第1帧上利用文本工具绘制2个输入文本框和动态文本框（均显示边框），设置变量名分别为boy、girl和baby。再输入相关文字，最后给“计算”按钮添加动作代码：on(release)baby=Number(boy)+Number(girl);如果测试时不能计算正确结果，请在“发布设置”里将Flash的发布版本设置为“Flash Player 7”。（三）制作一个文字闪光效果。（1）新建一图层，图层名称为“文字”，用文本工具在其中输入文字“Flash文字闪光效果”，文字大小为24，颜色为蓝色。将文字转换为图形元件，设置alpha为0%；（2）在第10帧插入关键帧，设置文字的alpha为100%，向右移动30px，创建补间动画效果。（3）在第50、60帧处插入关键帧，设置第60帧文字的alpha为0%，并向右移动30px;在第50至60帧之间创建补间动画。（4）新建一图层，名称为“矩形长条”。在第10帧插入空白关键帧，选择矩形工具，设置笔触颜色为无，填充颜色为线性渐变，颜色为白色，alpha分别为0%-100%-0%，绘制一比较宽的竖形长条，将竖形长条转换为图形元件。（5）利用任意变形工具，顺时针旋转竖形长条约30度，将其拖到舞台文字的左边。在第30、40、50帧分别插入关键帧，将长条分别拖到舞台文字的右端、左端、右端，给各关键帧之间添加补间动画。（6）插入新图层，名称为“文字遮罩”，复制“文字”层第10帧，在“文字遮罩”层第10帧处进行粘贴。（7）设置图层“文字遮罩”为遮罩层。为测试效果，在“文字”层第60帧添加停止播放的代码：Stop();制作完成。测试动画时，动画效果应该是：文字从左淡入显示，然后停顿并且出现多次来回的闪光效果，最后文字向右淡出。（四）添加控制播放流程的按钮，并添加动作代码。新建一图层，名称为“控制流程”。添加4个按钮，一个为“暂停”，一个为“继续播放”，一个为“Replay”，最后一个为“下一场景”。为节省时间，可直接输入文字，然后将文字转换为按钮元件。在第60帧插入帧。分别给每个按钮添加动作代码：暂停继续播放Replay下一场景on (release)stop();on (release)play();on (release)gotoAndPlay(1);on (release)gotoAndPlay(场景 2,1);注意代码的大小写。测试动画，点击各按钮，查看是否可以控制播放流程。（五）在场景2中制作萤火虫效果。（1）绘制萤火虫元件新建一场景，场景名称为默认的“场景 2”新建一MC，取名为“荧光”。 用椭圆工具，笔触无，填充色为绿色，居中画一个小圆，设置圆的宽与高均为2个像素。居中对齐。点击“修改”-“形状”-“柔化填充边缘“，距离10px，步骤5，方向扩展。在第10帧插入关键帧，将圆向下离一段距离。创建补间形状动画。（2）回到场景2，将库中的“灾光”元件拖到场景2图层1第1帧上任一位置，打开属性面板，将实例名称设为：mymc_mc。第1帧上的动作代码为：第一种情况：萤火虫随机出现。stop();mymc_mc._visible = false; /首先将舞台上的荧光元件隐藏。i=0; onEnterFrame = function() if(i50) / 萤火虫的数量duplicateMovieClip (mymc_mc,mymc+i,i);mymc_mc = eval(mymc+i);mymc_mc._x=random(450)+50; mymc_mc._y=50+random(300); mymc_mc._rotation = random(360); i+; else i=0; 第二种情况：萤火虫跟随鼠标。stop();mymc_mc._visible = false; /首先将舞台上的荧光元件隐藏。i=0; onEnterFrame = function() if(i50) duplicateMovieClip (mymc_mc,mymc+i,i);mymc_mc = eval(mymc+i);mymc_mc._x=random(20)+_xmouse; / 新复制的萤火虫元件出现在当前鼠标附近。mymc_mc._y=random(20)+_ymouse;mymc_mc._rotation = random(360); i+; else i=0; （六）按钮的键盘事件。（1）新建一图层，在图层2第1帧插入一个按钮，名称为“返回场景1”。在其上添加动作代码：on (release)gotoAndPlay(场景 1,1);通过上述代码，使该按钮点击后可以返回场景1。（2）用键盘控制按钮的位置。选中刚才添加的按钮，设置其实例名称为“button”，在该按钮上添加动作代码：on (keyPress w) _root.button._y-=20;on (keyPress s) _root.button._y+=20;on (keyPress a) _root.button._x-=20;on (keyPress d) _root.button._x+=20;通过上述代码，使该按钮可以响应键盘事件。运用swf文件，按键盘上的“aswd”，查看是否可以控制按钮的位置。（六）提交作业按Ctrl+Enter组合键测试动画是否达到我们想要的效果。确认无误后，保存所有文件。将生成的动画文件“实训14-姓名.swf”发至17269629完成本实训作业。注意：只需要swf文件，不需要其它文件。附：雪花效果的代码：（新建一Flash AS2文件，将以下代码加入到第1帧动作中即可。）var sceneWidth =550;/定义场景的宽var sceneHeight=400;/定义场景的高var sideDisWidth = Stage.width/2-sceneWidth/2;/定义变量,雪花的横向位移范围var sideDisHeight = Stage.height/2-sceneHeight/2;/定义变量,雪花的纵向位移范围var snowNum = 150;/定义雪花的数量var snowSpace:MovieClip = _root.createEmptyMovieClip(room, 1);/声明一个空影片剪辑snowSpace.function addMasker() /声明addMasker函数,执行两项工作.1是画外边框,2是画雪花景 _root.createEmptyMovieClip(masker, -2);/创建空影片剪辑masker，层深-2.任务是为舞台画外边框,并填充颜色 with (masker) /设置masker的属性。 lineStyle(1, 0xcccccc, 100);/设置线条颜色 beginFill(0x000000, 0);/绘制矩形闭合路径，并填充灰色,透明度为0 moveTo(sideDisWidth, sideDisHeight);/绘制起点 lineTo(sideDisWidth+sceneWidth, sideDisHeight);/绘制的右上角点的位置 lineTo(sideDisWidth+sceneWidth, sideDisHeight+sceneHeight);/绘制的右下角点的位置 lineTo(sideDisWidth, sideDisHeight+sceneHeight);/绘制的左下角点的位置 lineTo(sideDisWidth, sideDisHeight);/绘制的左上角点的位置 endFill();/结束绘制 createSnow();function createSnow() /定义一个匿名函数，完成声明一个雪花MC,雪花半径,循环画雪花 var n = 0;/局部变量n=0 while (nsnowNum) /在0到150数量范围循环画雪花 var snow:MovieClip = snowSpace.createEmptyMovieClip(s+n, n);/声明snowSpace剪辑由s+n个snow组成 var radius:Number = Math.random()*3;/定义雪花半径大小 drawSnow(snow, radius);/把snow, radius把参数传递给drawSnow函数 n+; function drawSnow(snow:MovieClip, radius:Number) /定义一个匿名函数，画一个雪花 var p = radius*.9;/局部变量P,用来定义雪花大小的坐标值 with (snow) /设置snow这个对象的动作.画雪花圆形白色填充 colors = 0xCCCCCC, 0xFFFFFF;/设置雪花的颜色 alphas = 100, 100;/设置透明度 ratios = 0, 255;/采样处的宽度的百分比 matrix = matrixType:box, x:-Math.random()*2*radius, y:-Math.random()*2*radius, w:2*radius, h:2*radius, r:(90/180)*Math.PI;/一个变形矩阵 beginGradientFill(radial, colors, alphas, ratios, matrix);/ 设置填充色. curveTo(p, -p, radius, 0);/定义点坐标,画雪花 curveTo(p, p, 0, radius); curveTo(-p, p, -radius, 0); curveTo(-p, -p, 0, -radius); endFill();/结束 snowProperty(snow, sceneWidth, sceneHeight);/把参数传递给snowPropertyfunction snowProperty(snow, w, h) /定义一个匿名函数，一个雪花如何下降 snow._x = sideDisWidth+Math.random()*w;/根据可编辑的宽及0和1中的任意一个数乘雪花宽计算雪花的X轴起始位置 snow._y = sideDisHeight+Math.random()*h;/根据可编辑的高及0和1中的任意一个数乘雪花高计算雪花的Y轴起始位置 snow._rotation = Math.random()*120+30;/设置旋转角度.有立体感.雪花的旋转程度为0和1中的任意一个数乘120+30 snow.stepX = Math.cos(snow._rotation*Math.PI)/180);/雪花横向位移.用计算余弦(旋转角度*常数3.14)/180) snow.stepY = Math.random()*2+1;/雪花纵向位移.为0和1中的任意一个数*2-1 setInterval(snowFall, 30, snow); /每隔0.5秒调用一次,由snowFall完成function snowFall(snow)