Flash Enabled Blog

Hello m8’s,

Sams wrote an excellent tutorial regarding Particle System on AS3. You can read part of the tutorial here.

Quote

With a gleam in their eye developers have embraced the newest version of Flash. Why? Because of this lovely little gal named Actionscript 3 (totally hot), and boy does she move fast. The bad thing is she likes the exact opposite kind of man that Actionscript 1 and 2 did: developers (who are real men anyway). Not to worry, as long as you say the right things I’m sure you’ll hit it off just fine.

And it’s true, Actionscript 3 is what a lot of developers had hoped for with version 2 and so much more. Movieclips and Actionscript can finally work in true harmony and there’s no better way to show this relationship is by making a simple particle system.

Our system will consist of three things: the environment, a generic particle, and a specific particle. The environment will be the flash file itself where we make the rules on how the particles behave: where they’re created and how they’re created. The generic particle will contain the basic framework for our specific particle: a trajectory and position that’s updated by variables supplied via the environment. The specific particle will actually be what we’re generating and because it has unique aspects is best as a subclass of our generic particle.

Lets start out by creating the base of our system: the generic particle. Without this the rest of our system couldn’t be created. Starting out by first thinking what the generic particle needs. In Actionscipt 3 you have to import most things so it’s best to think ahead. Lets see, we need a way to update the particle, preferably time based, and it needs to be able to be displayed as well, it also needs to store x,y coordinate data. Thankfully there are classes just for that: Timer, TimerEvent, Point, and MovieClip.

package{

    import flash.utils.Timer;
    import flash.events.TimerEvent;

    import flash.geom.Point;

    import flash.display.MovieClip;

Simple enough, now for the tough part. What input from the environment does our particle need? For our purposes we are going to be thinking simple physics. That means four things: a trajectory, a stored position, a constant for gravity, and friction. We also need to store these values specific to the particle.

public class Particle extends MovieClip{

        protected var position:Point;
        protected var vector:Point;

        private var gravity:int;
        private var friction:Number;

        public function Particle($position:Point, $vector:Point, $gravity:int, $friction:Number){

            position = $position;
            vector = $vector;

            gravity = $gravity;
            friction = $friction;
//Environment Variables

protected var update_i:Timer;


update_i = new Timer(25); //25ms for smooth movement

            update_i.addEventListener(TimerEvent.TIMER, update, false, 0, true);
            update_i.start();
        }


public function update($evt:TimerEvent):void{

            //Apply The Vector To The Position
            position.x += vector.x;
            position.y += vector.y;

            //Apply gravity
            vector.y += gravity;

            //Apply Friction!
            vector.x *= friction;
        }


}
}


package{

    import flash.events.TimerEvent;

    import flash.geom.Point;

    public class Ball extends Particle{

        public function Ball($position:Point, $vector:Point, $gravity:int, $friction:Number){
            super($position, $vector, $gravity, $friction); //Pass the torch 


//Set Initial Position
            x = position.x;
            y = position.y;


update_i.addEventListener(TimerEvent.TIMER, setPosition, false, 0, true);
        }[as]

 public function setPosition($evt:TimerEvent):void{

            x = position.x;
            y = position.y;
        }
    }
}


var ballTimer:Timer = new Timer(25);

ballTimer.addEventListener(TimerEvent.TIMER, throwBall, false, 0, true);
ballTimer.start();


var gravity:int = 1.5;
var friction:Number = .85;


function throwBall($evt:TimerEvent):void{

var tBall:Ball = new Ball(new Point(mouseX, mouseY), new Point(
(Math.random()-Math.random())*5, -Math.random()*8), gravity, friction);

    addChild(tBall);
}

 
 

You can read complete tutorial here.

Brgds,
CP