正在阅读:Flash AS3实例教程:制作火苗动画Flash AS3实例教程:制作火苗动画

2009-05-05 09:56 出处:PConline 作者:闪吧 lvan 责任编辑:lizhiyan

  效果如下:

 

  本次程序使用了2个AS文件以及一个FLA文件,两个AS文件分别是mack_fire.as 火花粒子制作文件,fire.as 火花移动控制文件,以及fire.fla场景文件。本文最后提供fla文件和as文件的打包下载仅供学习交流。

  代码如下:

  mack_fire.as:

/*************请支持原创,请开源代码****************/

/**********请让更多的AS爱好者有资料学习*************/

/********本作品是我学习作品,并非完善作品***********/

package {

import flash.geom.Matrix;//颜色渐变类库倒入

import flash.display.Sprite;//Sprite 类是基本显示列表构造块

import flash.display.GradientType;//Graphics 类包含一组可用来创建矢量形状的方法

public class mack_fire extends Sprite { //本类为火花原形类

  private var fire:Sprite;

  var myMatrix:Matrix;

  public function mack_fire(){

   fire = new Sprite();//初始化一个影片剪辑

   myMatrix = new Matrix();//需要用到的FLASH自带类,在这里这个类的作用是制作火花粒子的颜色渐变效果

   var boxWidth:int = 16;//火花粒子颜色渐变宽高设置,下面是高度

   var boxHeight:int = 16;

   var boxRotation:uint = Math.PI/2;//颜色渐变使用的变量

   var tx:int = 0;//影片剪辑的初试坐标

   var ty:int = 0;

   myMatrix.createGradientBox(boxWidth, boxHeight, boxRotation, tx, ty);//下面开始是颜色付值部分,详细请查阅createGradientBox的具体用法

   var type:String = GradientType.RADIAL;

   var myColors:Array = [0xFFFF00, 0xFFFF00];//颜色渐变,白色到白色

   var myAlphaS:Array = [1, 0];//透明度从,透明到不透明

   var myRalphaS:Array = [0, 255];

   var spreadMethod:String = "pad";

   var interp:String = "rgb";

   var focalPtRatio:Number = 0;

   fire.graphics.beginGradientFill(type, myColors,myAlphaS,myRalphaS, myMatrix, spreadMethod, interp, focalPtRatio);//这里请参考手册中关于beginGradientFill来理解

   fire.graphics.drawCircle(8, 8, 8);//制作一个圆形,半径和中心点坐标,具体可以参考drawCircle

   addChild(fire);

  }

}

}

  fire.as:

/*************请支持原创,请开源代码****************/

/**********请让更多的AS爱好者有资料学习*************/

/********本作品是我学习作品,并非完善作品***********/

package {

import flash.display.MovieClip;

import flash.events.EventDispatcher;

import flash.events.Event;

import flash.display.BlendMode;

import flash.filters.GlowFilter;

import flash.geom.ColorTransform;

public class fire extends MovieClip {

  private var fires:mack_fire;

  private const maxBalls:int = 60;//火花数量

  private const Mc_x:int = stage.stageHeight/2;//起火开始X坐标

  private const Mc_y:int = stage.stageHeight/2;//+stage.stageHeight/4;//起火开始Y坐标

  private const Mc_more:int = 1;//顶点,移动和透明度的顶点,1为完全不透明或没有缩放比例,AS3中以1做为顶点,AS2中是100

  private const McY:int = 1;//向上移动速度

  private var i=1;//记数变量

 

  private var obj_scal:Array=new Array();//缩放变量保存数组

  private var obj_fast:Array=new Array();//移动速度变量保存数组

  private var obj_action:Array=new Array();//横向移动速度更改变量

  private var obj_n:Array=new Array();//横向移动方向控制变量

  private var obj_s:Array=new Array();//横向移动速度控制变量

  private var obj_gs:Array=new Array();

 

  private var obj_g:Array=new Array();//颜色控制变量

 

  public function fire() {

   addEventListener(Event.ENTER_FRAME,fire_mv);

  }

 

  public function fire_mv(event:Event):void{

   var k = Math.random();//制造随即数字,这个变量决定火花的移动距离,已经移动范围

   var scale:Number = k ? k : 1;//制造一个随即数字,这个数字要小于1,大于0

   fires = new mack_fire();//新元件创建

   fires.scaleX = fires.scaleY = fires.alpha = scale;//元件的缩放以及透明度设置,根据上面的随即数设置

   obj_g[i] = 100;

   obj_gs[i] = (1-scale+.2)*3;//定义一个新的数组元素,用处在更改元件颜色

   obj_fast[i] = Math.floor(scale*2);//纵向移动速度主变量

   obj_action[i]=(Math.random()>0.5)?1:-1;//纵向移动 方向主变量

   obj_scal[i] = 1 - obj_fast[i]/10;//对于进行中火花的缩放进行控制

   obj_n[i] = obj_s[i] = 1;

   fires.x= Mc_x;//定义火花产生的横坐标

   fires.y= Mc_y;//定义火花产生的纵坐标

   fires.blendMode = BlendMode.ADD;//这部分是纯代码火花的重点,颜色叠加。让火花和火花之间看起来更圆滑。没有这个部分,火的效果根本不成立

   fires.name = "fire"+i;//定义一个火花的名字,在下面通过getChildByName来使用。这是笨方法。记得以前有朋友不用定义也可以使用的。

   addChild(fires);

   for (var n:int = 1; n<maxBalls; ++n){

    var m=getChildByName("fire"+n);//使用上面定义的火花影片剪辑

    if(m){

     var colorInfo:ColorTransform = m.transform.colorTransform;//定义颜色控制器

     var xx=obj_gs[n]*2;

     obj_g[n] -= Math.ceil(xx);

     if(obj_g[n] < 10) obj_g[n]="00";//更改颜色,这部分就是为什么黄色的影片剪辑变成红色的理由

     var rgbs = "0xff"+obj_g[n]+"00";//转义为字符串,这部分我是用最傻的办法来做的 ,实在是不了解AS3。请高手多指导

     colorInfo.color = rgbs;

     m.transform.colorTransform = colorInfo;

     m.y -= 1-obj_s[n]+.4;//向上移动

     m.x += obj_fast[n]*obj_action[n]*obj_n[n]*obj_s[n];//进行横向移动

     m.scaleX += (obj_scal[n])/20 * obj_n[n] * obj_s[n];//进行横向缩放

     m.scaleY += (obj_scal[n])/20 * obj_n[n] * obj_s[n];//进行纵向缩放

     m.alpha += .1 *obj_n[n]*obj_s[n];//进行透明度设置

     if(m.scaleX >= Mc_more){;

      obj_n[n] = -1;//横向反方向移动

      obj_s[n] = .2;//横向移动速度减缓

     };

    

     if(m.alpha >= Mc_more){ m.alpha = Mc_more;}else if(m.alpha <= Math.random()*.1){ removeChildAt(m);}//如果透明度高于或者底于指定数值,进行操作

    }

   }

   if(i>=maxBalls){i=0;}

   ++i;

  }

}

}

  fire.fla文件为场景文件,只要导入fire.as文件就可以了。具体方法:在场景属性中,查找文档类,并输入fire就可以了。

  打包下载:本例源文件(含as文件和fla文件)

点击学习更多创意设计教程

相关文章

关注我们

最新资讯离线随时看 聊天吐槽赢奖品