Sign in to follow this  
  • entries
  • comments
  • views

Double Buffering in Actionscript 3

Sign in to follow this  


I have just figured out how to implement Double Buffering in Actionscript 3. Here is the code for a recent experiment:

package {
import flash.display.*;
import flash.geom.*;
import flash.filters.BlurFilter;
/* metadata for using mxmlc commaond-line compiler */
public class PlasmaGhost extends Sprite {
private var _graphics:Array = new Array();
private var _bitmap:BitmapData;
private var _buffer:BitmapData;
private var _image:Bitmap;
private var _blurFilter:BlurFilter;
private var centerX:Number;
private var centerY:Number;
private var c:Number = 4;
private var d:Number = 3;
private var radius:Number = 50; // radius of circle
private var theta:Number = 0; // how far we are around the circle
private var steps:Number = 540; // iterations to complete a revolution
private var stepSize:Number = Math.PI*2/steps; // actual movement in each iteration
private var particles:Number = 500; // number of particles in display list
private var placement:Number = Math.PI*2/particles; // relative placement of each particle
private var copyRect:Rectangle;
private var copyPoint:Point;
public function PlasmaGhost() {
for(var i:Number=0;i<particles;i++) {
_graphics = new Shape();*(i%64),100);,0,1);;
_blurFilter = new BlurFilter();
public function registerStage(event:Event):void {
if(stage) {
copyPoint = new Point(0, 0);
centerX = stage.stageWidth/2;
centerY = stage.stageHeight/2;
radius = Math.min(stage.stageWidth,stage.stageHeight)*.8/2;
for(var i:Number=0;i<particles;i++) {
_graphics.x = Math.random()*stage.stageWidth;
_graphics.y = Math.random()*stage.stageHeight;
_bitmap = new BitmapData(stage.stageWidth,stage.stageHeight,true,0xff000000);
_buffer = new BitmapData(stage.stageWidth,stage.stageHeight,true,0xff000000);
_image = new Bitmap(_bitmap);
private function onEnterFrame(event:Event):void {
for(var i:Number=0;i<particles;i++) {
_graphics.x = centerX + radius * (Math.cos(c/d*(theta * placement*i)) * Math.cos(theta + placement*i));
_graphics.y = centerY + radius * (Math.cos(c/d*(theta + placement*i)) * Math.sin(theta * placement*i));
_buffer.applyFilter(_buffer,_buffer.rect,new Point(),_blurFilter);
theta +=stepSize;

There are three important parts to this: _buffer, _bitmap, and _image.

When the program loads, _bitmap is set to be the data source for _image. _image is the actual visible object on the screen. _buffer is used to hold the graphics in the array called _graphics as they are moved and re-drawn. At every iteration, each element in _graphics is updated according to the formula for the pattern, and then drawn to _buffer. Once _graphics has been iterated through, _buffer is copied onto _bitmap. Since _bitmap is the data source for _image, whatever is in _bitmap appears on the screen.

Some additional notes about this piece of code:

1. at the beginning there is a line of meta-data which is used to set the Stage width, height, background color, and frame rate. I use this line because I am using the MXMLC.exe command-line compiler - included with the free Flex SDK - to compile my code, so I can't set these parameters manually in the Flash CS3 IDE. If you are using the Flash CS3 IDE, you can remove this line.

2. In the constructor function there I call an event which, in effect, checks to see if the stage (base container for all displayed objects) has instantiated yet. I had to do this because I am finding that, at higher frame rates, the code executes and tries to begin drawing before the stage has instantiated. It is a minor bug fix, and useful to know in case the situation arises.

3. The formula I use to create the pattern is a variation on the Rose.

For more information about using the command-line compiler, see Senocular's tutorial.
Sign in to follow this  


Recommended Comments

There are no comments to display.

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now