topical media & game development
sample-flex-burn-create.ax
sample-flex-burn-create.ax
[swf]
[flash]
flex
package {
import aether.utils.ImageUtil;
import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.display.BitmapDataChannel;
import flash.display.Sprite;
import flash.events.Event;
import flash.filters.BlurFilter;
import flash.filters.DisplacementMapFilter;
import flash.filters.DisplacementMapFilterMode;
import flash.filters.GradientGlowFilter;
import flash.geom.ColorTransform;
import flash.geom.Point;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
import flash.text.TextFormat;
[SWF(width=600, height=200, backgroundColor=0x000000)]
//[SWF(backgroundColor=0x000000)]
Demonstrates how flames may be dynamically generated from any object. This uses dynamic text
that is then recolored and distorted, constantly over time, creating the flame illusion.
sprite
public class @ax-sample-flex-burn-create extends Sprite {
// the rate at which the flames should move
private static const FLICKER_RATE:Number = 10;
private var _blackField:TextField;
private var _flame:BitmapData;
private var _perlinNoise:BitmapData;
private var _perlinOffsets:Array;
private var _perlinSeed:int;
contructor
Constructor. This creates textfields and sets up the flame and noise properties
that will be used in the flame animation. Finally, the handler for the animation is set up.
public function @ax-sample-flex-burn-create() {
makeFlame();
makeFields();
makeNoise();
addEventListener(Event.ENTER_FRAME, onSpriteEnterFrame);
}
make flame(s)
Creates the bitmap data that will be used to draw the flames.
private function makeFlame():void {
// flame image is same size as stage, fully transparent
_flame = new BitmapData(
stage.stageWidth,
stage.stageHeight,
true,
0x00000000
);
addChild(new Bitmap(_flame));
}
Creates two textfields, one with a gradient glow for flame, and the other black.
private function makeFields():void {
var field:TextField = createField();
field.filters = [
new GradientGlowFilter(
0,
45,
[0xFF0000, 0xFFFF00],
[1, 1],
[50, 255],
15,
15
)
];
_blackField = createField();
}
text field
Creates a textfield that will be used as basis of flames.
returns: The textfield created.
private function createField():TextField {
var field:TextField = new TextField();
field.autoSize = TextFieldAutoSize.LEFT;
field.selectable = false;
// make sure you ahve Impact installed
//field.defaultTextFormat = new TextFormat("Impact", 80);
field.defaultTextFormat = new TextFormat("Impact", 60);
field.text = "creative technology";
field.x = (stage.stageWidth - field.width)/2;
field.y = stage.stageHeight - field.height;
addChild(field);
return field;
}
perlin noise
Initializes Perlin noise properties that will be used in flame animation.
private function makeNoise():void {
// noise bitmap data is same size as flame bitmap data
_perlinNoise = _flame.clone();
_perlinSeed = int(new Date());
// two octaves requires two points
_perlinOffsets = [new Point(), new Point()];
}
apply noise
Applies the Perlin noise to the bitmap data, offsetting the octave displacement
by the FLICKER_RATE each time this method is called.
private function applyNoise():void {
_perlinNoise.perlinNoise(
50,
30,
2,
_perlinSeed,
false,
true,
BitmapDataChannel.RED,
true,
_perlinOffsets
);
// altering offset contributes to upward animation of flames
(_perlinOffsets[0] as Point).y += FLICKER_RATE;
(_perlinOffsets[1] as Point).y += FLICKER_RATE/2;
}
draw flame(s)
Updates the flame bitmap data each frame, creating the animation.
private function drawFlame():void {
// draw the current stage image into flame at a reduced brightness and alpha
_flame.draw(
stage,
null,
new ColorTransform(.9, .9, .9, .7)
);
// blur drawn image slightly, more on y axis
ImageUtil.applyFilter(
_flame,
new BlurFilter(3, 5)
);
// move the flame image up slightly, creating upward movement of flames
_flame.scroll(0, -4);
// apply new Perlin noise with altered offset
applyNoise();
// displacement flame image with updates Perlin noise
ImageUtil.applyFilter(
_flame,
new DisplacementMapFilter(
_perlinNoise,
new Point(),
BitmapDataChannel.RED,
BitmapDataChannel.RED,
1,
10,
DisplacementMapFilterMode.CLAMP
)
);
}
animation(s) / enter frame(s)
Handler for ENTER_FRAME event. Redraws flame.
parameter: event Event dispatched by this sprite.
private function onSpriteEnterFrame(event:Event):void {
// black field is made invisible before stage contents are
// drawn into bitmap data so that only flame is drawn
_blackField.visible = false;
drawFlame();
_blackField.visible = true;
}
}
}
(C) Æliens
04/09/2009
You may not copy or print any of this material without explicit permission of the author or the publisher.
In case of other copyright issues, contact the author.
