as3代码练习-----用类来实现线条移动

      Flash课件设计 2010-8-1 16:12:00

    外部类对很多初学者来说有些过于神密,实际上,如果不纠结于内部类与外部类的关系,那么外部类仅仅是格式上变化了一下而已。

    为了增加一点难度,在项目文件的目录中新建一层目录,名为 dzxz   ,在该目录中新建下面的类文件。

package dzxz{
 import flash.events.Event;
 import flash.display.Sprite; 
 
 public class MovingBall extends Sprite {
  public var vx;
  public var vy;
  public function MovingBall() {   
   this.x = 100;
   this.y = 100;
   this.vx = Math.random() * 10 + 5;
   this.vy = Math.random() * 10 + 5;
   //ball.alpha = 0;
   this.addEventListener(Event.ENTER_FRAME,onMove );
  }
  function onMove( evt:Event ) {
   var obj = evt.target;
   if (obj.x <= 0 || obj.x >= stage.stageWidth) {
    obj.vx =  -  obj.vx;
   }
   if (obj.y <= 0 || obj.y >= stage.stageHeight) {
    obj.vy =  -  obj.vy;
   }
   obj.x += obj.vx;
   obj.y+=obj.vy;
  }
 }
}

    库里面建一个元件,链接名为 dzxz.MovingBall,当元件中设置的类名与外部类同名,并且能被Flash找到的话,该元件将具备类文件中所设计的功能,在程序运行的时候,Flash会自动撮合这部分内容。由此来看,库中的元件仿佛是骨和肉,而外部的类代码就有些像灵和魂,二者的结合就是一个生动的形像。(喜欢纯代码写元件的朋友估计就缺少这种感受了)

    画线部分的代码装入到类文件中以后,是如下的内容:

package dzxz{
 import flash.events.Event;
 import flash.display.Sprite;
 import flash.display.Graphics;
 import dzxz.MovingBall;// 看起来有点专业的感觉了

 public class RunningLine extends Sprite {

  public var ballArr:Array;
  public var pen:Graphics;

  public function RunningLine(segment:uint = 4) {//线段的默认端点数为4
   pen = this.graphics;
   ballArr = new Array();

   for (var i:uint =0; i<segment; i++) {
    var obj =  new MovingBall();
    obj.alpha = 0;
    ballArr.push(obj);
    addChild( obj );
   }
   addEventListener(Event.ENTER_FRAME,onDrawLine);
  }
  private function onDrawLine(evt:Event) {
   pen.clear();
   pen.lineStyle(2,0xff0000);
   pen.moveTo( ballArr[0].x,ballArr[0].y);
   for (var i=1; i< ballArr.length; i++) {
    pen.lineTo( ballArr[i].x,ballArr[i].y);
   }
   pen.lineTo( ballArr[0].x,ballArr[0].y);
  }
 }
}

    主场景中用下面的代码就可以添加相应的线条了:

var myLine = new RunningLine();

addChild( myLine );

    到此已经可以将线条包装成类文件了,但是功能上还有欠缺,那就是还缺少变色的能力。变色是对画线功能的扩充,因此,可以考虑对 RunningLine 进行继承,直接得到 RunningLine 类的绝大部分功能,再将该类中的  onDrawLine 函数进行重写就可以了。

完成的代码如下:

package dzxz{
 import flash.events.Event;
 import flash.display.Sprite;
 import flash.display.Graphics;
 import dzxz.MovingBall;
 import dzxz.RunningLine;

 public class ColorRunningLine extends RunningLine {

  private var lineColor:int;
  public var timeInterval:int;
  private var timeCount:int;

  public function ColorRunningLine(segment:int = 4) {
   super( segment );
   lineColor = 0xffffff * Math.random();
   timeInterval = 0 + 90 *Math.random();//3秒内变色一次
   timeCount = 0;

   addEventListener(Event.ENTER_FRAME,onDrawLine);
  }
  private function onDrawLine(evt:Event) {
   if( timeCount++ >= timeInterval ){//算是个手动版的计时器
    getNewColor();
    timeCount = 0;
   }
   
   pen.clear();
   pen.lineStyle(2,lineColor);
   pen.moveTo(ballArr[0].x,ballArr[0].y);
   for (var i = 1; i < ballArr.length; i++) {
    pen.lineTo(ballArr[i].x,ballArr[i].y);
   }
   pen.lineTo(ballArr[0].x,ballArr[0].y);
  }
  function getNewColor() {//刷新颜色
   var r = lineColor & 0xff0000 >> 32;//先将现有颜色分解成3个独立的数字
   var g = lineColor & 0xffff >> 16;
   var b = lineColor & 0xff;

   r += Math.floor(Math.random() * 5);//对每一种颜色的成份进行累加
   g+=Math.floor(Math.random()*10);
   b+=Math.floor(Math.random()*20);

   lineColor+=r<<32+g<<16+b;//将新的颜色成份合成到一起
   lineColor&=0xffffff;//对颜色值进行修正,确保颜色值在一定的范围内。
  }
 }
}

主场景中添加 ColorRunningLine 的实例,并且可以指定线段的数量,就可以得到相应的结果了。

标签集:TAGS:as3 线条效果
回复Comments() 点击Count()
喜欢就顶一下

回复Comments

{commentauthor}
{commentauthor}
{commenttime}
{commentnum}
{commentcontent}
作者:
{commentrecontent}