论坛交流
首页办公自动化| 网页制作| 平面设计| 动画制作| 数据库开发| 程序设计| 全部视频教程
应用视频: Windows | Word2007 | Excel2007 | PowerPoint2007 | Dreamweaver 8 | Fireworks 8 | Flash 8 | Photoshop cs | CorelDraw 12
编程视频: C语言视频教程 | HTML | Div+Css布局 | Javascript | Access数据库 | Asp | Sql Server数据库Asp.net  | Flash AS
当前位置 > 文字教程 > Flash AS编程教程
Tag:2.0,3.0菜鸟,游戏,,cs,技巧,源码,,文本,文字,函数,音乐,随机,拖拽,asp,access,xml,mc,视频教程

Flash8运动模糊

文章类别:Flash AS编程 | 发表日期:2008-10-6 18:07:01


演示文件:



制作思路:创建我们必须的一个影片剪辑, 对其进行不断的复制, 控制它的移动,最后加入模糊效果.

操作方法:
1.新建一个Flash文档,将其命名为motionblur.fla.保存.文件的大小为500*300.
2.在主场影中绘制一个二维图像,它所添充的颜色有你自已来定,以及的他的形状,如果你喜欢,你可以制作成任意的形状.在本例中,我们绘制的是一个添了色的同心园.如下图所示:

注意一点,当前的图像是放大后的效果,在主场景中绘制完成后,将它的长宽大小设为25最好,不要过大.因我们在代码中还要对其进行缩放操作.
3.选中场景中的园环,按下F8,将其转换为影片剪辑,注意一点在转换为影片剪辑时要将的它的注意点置于中心位置,如下图所示:


4.删掉主场景中已创建的园环,我们一旦创建了影片剪辑,这个影片剪辑就会存在于库中,在后面的代码中我们将使用attachMovie方法从库中粘贴影片剪辑到场景中.ok.按下ctrl+l打开库面板,选中我们刚创建的影片剪辑,然后右击选择链接属性如下图所示:

完成后会弹出一个窗口,在链接窗口中,我们输入链接名称,这本例中输入ball.并钩选”为actionscript导出”确定,如下图所示:
 

5.返回到主场景中,选中层上的第一帧,按下F9打开Actionscript面板,我们准备输入代码.按照我们的思路,我们先来看复制并控制园环的移动.在其中加入如下代码:
//定义要复制的总数 
var num = 30; 
//使用for循环开始复制 
for (var i = 0; i<num; i++) { 
    //设定随机缩放 
    scale = random(300); 
    //设定随机的_alpha透明度 
    alpha = random(10000/scale)+40; 
    //使用attachMovie将库中的ball贴加到场景中,同时定义一个引用名为temp_mc. 
    var temp_mc = attachMovie("ball", "ball"+i, i); 
    //指定temp_mc的属性值. 
    with (temp_mc) { 
        _x = random(Stage.width); 
        _y = random(Stage.height); 
        _xscale = scale; 
        _yscale = scale; 
        _alpha = alpha; 
    } 
    //针对temp_mc使用onEneterFrame进行循环以使所有的园环沿着光标的反向移动 
    temp_mc.onEnterFrame = function() { 
        Yspeed = (Stage.height/2-_ymouse)/this._yscale*12; 
        Xspeed = (Stage.width/2-_xmouse)/this._xscale*12; 
         
        //x,y方向的移动和条件限制 
        this._y += Yspeed; 
        if (this._y>Stage.height) { 
            this._y = 0; 
        } 
        if (this._y<0) { 
            this._y = Stage.height; 
        } 
        this._x += Xspeed; 
        if (this._x>Stage.width) { 
            this._x = 0; 
        } 
        if (this._x<0) { 
            this._x = Stage.width; 
        } 
    }; 

6.此时你就可以测试你的影片,你就会发现现在我们的鼠标已经能够控制多个影片剪辑移动了,并且有一个特点,大的移动的慢,小的移动的快.

解释代码:

这段代码基本上分为两段,前面一段是我们是进行复制,复制出我们需要的30个影片剪辑,后半段是控制这30个影片剪辑的移动.
我们先看前半段:

var num = 30; 
//使用for循环开始复制 
for (var i = 0; i<num; i++) { 
    //设定随机缩放 
    scale = random(300); 
    //设定随机的_alpha透明度 
    alpha = random(10000/scale)+40; 
    //使用attachMovie将库中的ball贴加到场景中,同时定义一个引用名为temp_mc. 
    var temp_mc = attachMovie("ball", "ball"+i, i); 
    //指定temp_mc的属性值. 
    with (temp_mc) { 
        _x = random(Stage.width); 
_y = random(Stage.height); 
        _xscale = scale; 
        _yscale = scale; 
        _alpha = alpha; 
    } 

如果你单独将这段代码粘到flash中,你会发现我们已经成功的复制出30个的影片剪辑,并且在这30个影片剪辑的大小,透明度均是不同的.这也是前面这段代码的作用,这里我们使用了attachMovie的方法,将之前我们创建好的影片剪辑ball通过链接id将其不断的粘贴到场景中以达到不断复制的目的.有一点在这段代码中我们指定的一个引用名为var temp_mc = attachMovie("ball", "ball"+i, i);
如果你最后一个大括号之前trace(temp_mc),你会得到下面的结果: 

_level0.ball0 
_level0.ball1 
_level0.ball2 
_level0.ball3 
_level0.ball4 
…………. 
_level0.ball29 
通过循环,我们得到了我们需要的所有复制后的影片剪辑实例.通俗的说,temp_mc是所有我们复制出的影片剪辑的引用名称.这样我们在后面使用代码如:
with (temp_mc) { 
        _x = random(Stage.width); 
_y = random(Stage.height); 
        _xscale = scale; 
        _yscale = scale; 
        _alpha = alpha; 
    } 

你所指定给的temp_mc的属性并不单独代表某一个,而是全部的影片剪辑,而每个我们指定的属性都是随机值,所以你在测试时看到的结果便是大小不同,alpha不同的园环.
接下来我们看后半段:

temp_mc.onEnterFrame = function() { 
        Yspeed = (Stage.height/2-_ymouse)/this._yscale*12; 
        Xspeed = (Stage.width/2-_xmouse)/this._xscale*12; 
         
        //x,y方向的移动和条件限制 
        this._y += Yspeed; 
        if (this._y>Stage.height) { 
            this._y = 0; 
        } 
        if (this._y<0) { 
            this._y = Stage.height; 
        } 
        this._x += Xspeed; 
        if (this._x>Stage.width) { 
            this._x = 0; 
        } 
        if (this._x<0) { 
            this._x = Stage.width; 
        } 
    }; 
这半段的代码目的在于使用onEnterFrame帧循环通过_xmouse,_ymouse来控制园环的移动,我们在哪里体现的是光标移动的呢.如下:
Yspeed = (Stage.height/2-_ymouse)/this._yscale*12; 
Xspeed = (Stage.width/2-_xmouse)/this._xscale*12; 

在这两行代码中,分别定义为x,y方向上的速度, 以屏幕为中心开始,计算鼠标与中心的距离,当光标与中心的位置越远时, Stage.height/2-_ymouse计算的值就越大,反之则越小,这样Xspeed和Yspeed的值就会有一个大小的和方向的变化,因为_xmouse,和_ymouse是有正负之分的,同时我们还发现在缓动设定缓动系数时,我们使用this._xscale和this._yscale做被除数,因为这两个值是随机的,同样会反映出如出Xspeed和Yspeed的大小之分,这也意味着,如果园环被缩放的很小,那么它的移动速度也是很快的.反之移动速度就会较慢.ok.如果你理解了这两句,其它的代码,除了this._x+=Xspeed和this._y+=Yspeed是用来移动园环外,其它均为限制园环的边界的.

7.现在我们已经成功的复制和控制了园环的移动.接下来我们要加入flash8的模糊滤镜以达到运动模糊的效果.打开actionscript面板,在原有代码的基础上修改.
我们在最前端添加两行.
先导入flash8的滤镜类。

import flash.filters.* 

然后我们创建模糊滤镜的实例。

var blur:BlurFilter = new BlurFilter(blurX,blurY,1);

ok.创建完成后,我们注意到,在创建实例时并没有指定blurX,blurY的具体值的大小,因为它是变化,我们并不在这里指定.
接下来我们在Xspeed和Yspeed两行代码的后端加入三行代码:如下

//定义blur.blurX和blur.blurY的值,这个值是根据上面的Xspeed和Yspeed的变化而变化的. 
        blur.blurX = Math.abs(Xspeed); 
        blur.blurY = Math.abs(Yspeed); 
        //指定应用滤镜 
        this.filters = [blur]; 

前两行我们分别设定blur.blurX和blur.blurY的大小,第三行是针对temp_mc应用滤镜,其中的this便是指temp_mc.另外一点,因为Xspeed和Yspeed的是大小变化的,所以这也正是我们想要的,它也会使blur.blurX和blur.blurY随着速度的变化而变化,因为blurFilter的滤镜的blurX,blurY最小值不能小于1.而Xspeed和Yspeed是有正负之分的,所以我们要为它们增加Math.abs取他们的绝对值,以保证blurFilter的有效.
Ok. 下面是全部的代码:

//导入滤镜类 
import flash.filters.*; 
//创建BlurFilter类的实例 
var blur:BlurFilter = new BlurFilter(blurX, blurY, 1); 
//定义要复制的总数 
var num = 30; 
//使用for循环开始复制 
for (var i = 0; i<num; i++) { 
    //设定随机缩放 
    scale = random(300); 
    //设定随机的_alpha透明度 
    alpha = random(10000/scale)+40; 
    //使用attachMovie将库中的ball贴加到场景中,同时定义一个引用名为temp_mc. 
    var temp_mc = attachMovie("ball", "ball"+i, i); 
    //指定temp_mc的属性值. 
    with (temp_mc) { 
        _x = random(Stage.width); 
        _y = random(Stage.height); 
        _xscale = scale; 
        _yscale = scale; 
        _alpha = alpha; 
    } 
    //针对temp_mc使用onEneterFrame进行循环以使所有的园环沿着光标的反向移动 
     
    temp_mc.onEnterFrame = function() { 
        Yspeed = (Stage.height/2-_ymouse)/this._yscale*12; 
        Xspeed = (Stage.width/2-_xmouse)/this._xscale*12; 
        //定义blur.blurX和blur.blurY的值,这个值是根据上面的Xspeed和Yspeed的变化而变化的. 
        blur.blurX = Math.abs(Xspeed); 
        blur.blurY = Math.abs(Yspeed); 
        //指定应用滤镜 
        this.filters = [blur]; 
        //x,y方向的移动和条件限制 
        this._y += Yspeed; 
        if (this._y>Stage.height) { 
            this._y = 0; 
        } 
        if (this._y<0) { 
            this._y = Stage.height; 
        } 
        this._x += Xspeed; 
        if (this._x>Stage.width) { 
            this._x = 0; 
        } 
        if (this._x<0) { 
            this._x = Stage.width; 
        } 
    }; 
     
    //trace(temp_mc); 

8.现在就可以测试你的影片了.你就可看到你想要的效果了.motionblur.需要注意的是我们在创建blur:BlurFilter = new BlurFilter(blurX,blurY,1)时,其中最后的参数1,是blur的质量,这里的建议最佳值是1,当设为2或3时,运动会有不流畅的感觉.它会吃掉你大量的cpu.

ps by egoldy:我们学习使用attachMoive复制影片剪辑,以及如何使用鼠标控制影片剪辑的移动,以及将模糊滤镜应用到actionscript 运动的影片剪辑上.以实现你要的效果.通过以上的例子,你可以举一反三,只要掌握了应用滤镜和如何变化它们的参数,可以制作出各种各样的模糊效果.在应用其它滤镜时思路上也基本上是大同小异的。

视频教程列表
文章教程搜索
 
Flash AS推荐教程
Flash AS热门教程
看全部视频教程
购买方式/价格
购买视频教程: 咨询客服
tel:15972130058