BitmapData effects

23 12 2008

Recently there was an actionscript competition at The Flash Blog – 25 lines that would impress Einstein. You need to create something innovative using only 25 lines of code. The absolutely fantastic  results were declared on Dec 18. It’s amazing to see what people can do with only 25 lines of code in Flash. Check out the top entries here…

http://theflashblog.com/?p=503

I noticed one common thing being used to create some of these effects is the BitmapData class for manipulating bitmap objects. Here, I will share a very basic example to show what can be done using this object.

1. Create a new file (actionscript 3.0) in Flash CS3 IDE.

2. Change the stage dimensions as 400 x 200 and frame rate as 24 fps.

3. Select frame 1. Copy the following code in code editor:

//import bitmap classes
import flash.display.Bitmap;
import flash.display.BitmapData;

//create a BitmapData object
var myBitmapDataObject:BitmapData = new BitmapData(400, 200, false, 0x00FF0000);

//create a random number which will be used for setting the seed for adding noise to the bitmadata object
var seed:Number = Math.floor(Math.random() * 100);
//set up a channel with a mix of  three main colors - red, blue, green
var channels:uint = BitmapDataChannel.GREEN | BitmapDataChannel.BLUE | BitmapDataChannel.RED
//create a new bitmap with the bitmapdata object
var myBitmap:Bitmap = new Bitmap(myBitmapDataObject);
addChild(myBitmap);
//use enterframe event for animating the bitmap effect
addEventListener(Event.ENTER_FRAME, updateImage);

var velo:int = 10;
function updateImage(e:Event):void
{
	if (velo >= 200)
	{
		velo = -Math.abs(velo);
	}
	//add noise with baseX and baseY properties set to var velo which is constantly changing
	myBitmapDataObject.perlinNoise(velo++, velo++, 6, seed, false, true, channels, false, null);
}

4. Publish the file.

There  you go. You will see a colorful animated cloud being zoomed in and zoomed out.

ColoredCloudEffect.swf

Bitmap Cloud Effect

Bitmap Cloud Effect

Advertisements

Actions

Information

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s




%d bloggers like this: