2.2 画面特效(1)

    

画面特效是指那些通过程序自动生成的画面，或者在简单的画面制作之后通过程序来进行控制，从而完成那些用手工制作非常费时费力甚至是无法完成的特效，因而极大地加强了Flash动画的效果。

2.2.1  电视信号效果

在Flash MX特效中，有一种经常可以用到的效果就是电视线特效。它主要用在黑色背景中，通过一些无序点与线的闪动达到这种动态的效果。程序代码如下：

Movieclip.prototype.makeScratch = function(name, n, color, alpha, x, y, radius, ratio) {

    with (this.createEmptyMovieClip(name, n)) {

             //画一条透明度为alpha的线

             lineStyle(radius, color, alpha);

             moveTo(x, y);

             lineTo(x, y+(100/ratio));

    }

};

this.onEnterFrame = function() {

    //产生20条这样的灰色半透明的线

    for (var r = 0; r<20; r++) {

             makeScratch("b_"+r, 100+r, 0x999999, random(60), random(Stage.width), random(Stage.height), random(10), random(200));

    }

};

这段程序好像非常短小，其实却包括“动画片断函数原型的定义”这一重要知识点。在很多地方，动画经常要用到某个函数，而这个函数又属于动画片断之中，这样就可以采用Movieclip.prototype.原型名=function（…）的方式来自定义原型。当然了，这里的原型函数名可以自己随便写，完成定义后，在任何一个动画片断中就可任意使用这个自定义的函数了。

虽然自定义函数原型非常方便，但是大量地定义它会带来不良后果，因为每一个自定义的函数原型要占用一定的资源，如果大量定义的话，系统资源的消耗将增大，将会影响到其他程序的快速执行。

当然了，这个效果如果不用面向对象的编程来写，而采用普通的函数来写也是可行的。onEnterFrame部分不变，函数原型定义部分程序改写成函数定义，代码如下：

function makeScratch (name, n, color, alpha, x, y, radius, ratio) {

    with (this.createEmptyMovieClip(name, n)) {

             //画一条透明度为alpha的线

             lineStyle(radius, color, alpha);

             moveTo(x, y);

             lineTo(x, y+(100/ratio));

    }

};

其实也没有什么变化，只是函数的定义方式发生了一点小小的改变而已，执行的结果与上面一样。为了让大家看清楚，背景色特意没有设成黑色，而是采用了深灰色，如图2-6与图2-7所示。

    

图2-6                                           图2-7

2.2.2  往返光条效果

在动画中有时为了增加动态的效果，可以在画面中加几个来回移动的透明光条，这些光条都具有下面的几个特征：

宽度可以来回变化，比如先从窄变宽，然后又可以再变回窄。

在某个固定范围内来回移动。

很多个这样的光条各自独立互不干扰。

一般情况下，要制作这种效果，很多设计师都是采用一条条地逐个制作的方式来实现，制作起来工作量大，而且适应性差。有时在这个BANNER动画中制作好了，在另一个BANNER动画中因它们的宽度或者高度发生改变，要用时又得修改它，费时又费力。现在有一种办法，通过程序来生成这个效果，一次制作，无限次使用，一切将变得非常轻松。

首先我们制作一个最基本的无边框白色矩形的动画片断（MovieClip），如图2-8所示。

图2-8

矩形的高度与宽度分别是160与20，当然了，这两个值，可以根据自己的需要来定义，然后把它加到场景中。选中它，在Actions面板中加入下面代码：

onClipEvent (load) {

    //设置小条的透明度为15

    this._alpha = 15;

    //设置它的x起始位置是场景中的任意位置

    this._x = random(Stage.width);

    //设置它的y位置是场景中的中心位置

    this._y = Stage.height/2;

    this._xscale = random(50)+20;

    //设定小条在来回移动时最左边与最右边的位置

    low = random(Stage.width*0.25);

    high = Stage.width*0.75+random(Stage.width*0.20);

    //设置一次移动的距离

    move = 2*(3-random(6));

    //小条移动距离不能为0

    if (move == 0) {

             move = 3;

    }

    //设置小条的宽度变形

    scale_move = 2*(3-random(6));

    if (scale_move == 0) {

             scale_move = 3;

    }

}

onClipEvent (enterFrame) {

    this._x += move;

    this._xscale += scale_move;

    //小条的宽度比例不能太小，也不能太大

    if (_xscale>200 or _xscale<20) {

             //宽度变化反向

             scale_move = -scale_move;

    }

    //小条只能在它自己的左右范围内来回移动

    if ((this._x>high and move>0) or (this._x<low and move<0)) {

             //移动反向

             move = -move;

    }

}

这样，一个可以自由往返的光条就制作完成了。

整个程序代码的核心就是通过正负move与scale_move的值来控制光条方向与宽度的变化。因为程序代码已与基本方块完全封装在了一起，所以在实际使用过程中光条的个数可以轻松控制，只需复制数个便可，运行的效果如图2-9及图2-10所示。

这种特效在很多广告BANNER中都可以用到。如果色彩感较好，还可以修改基本色块的颜色，甚至让每一块的颜色都不相同，产生出一种眩目的效果。

图2-9

图2-10