BIT-101 [2003-2017]

Glow Filter


Ran across a cool use of the glow filter recently. Thought it would be fun to share. Basically, if you make a glow filter with a relatively small amount of blur, set to inner and knockout, it will just draw an outline of whatever it is applied to. Here it is used in interactive drawing. Cool effect that would be pretty close to impossible without filters. Click and draw. Press a key to clear.

[kml_flashembed movie=“https://www.bit-101.com/misc/outlinedraw.swf” height=“400″ width=“550″ /]

I actually just did this on the timeline in Flash CS3, so here’s the code. Play with the parameters to get other effects.

[as]import flash.filters.GlowFilter;
import flash.events.MouseEvent;
var xpos:Number;
var ypos:Number;

graphics.lineStyle(20, 0);
filters = [new GlowFilter(0, 1, 4, 2, 2, 1, true, true)];
stage.addEventListener(MouseEvent.MOUSE_DOWN, onMouseDown);
stage.addEventListener(KeyboardEvent.KEY_UP, onKeyUp);

function onKeyUp(event:KeyboardEvent):void
{
graphics.clear();
graphics.lineStyle(20, 0);
}

function onMouseDown(event:MouseEvent):void
{
xpos = mouseX;
ypos = mouseY;
graphics.moveTo(mouseX, mouseY);
stage.addEventListener(MouseEvent.MOUSE_MOVE, onMouseMove);
stage.addEventListener(MouseEvent.MOUSE_UP, onMouseUp);
}

function onMouseMove(event:MouseEvent):void
{
var dx:Number = xpos – mouseX;
var dy:Number = ypos – mouseY;
if(Math.sqrt(dx * dx + dy * dy) > 10)
{
graphics.lineTo(mouseX, mouseY);
}
}

function onMouseUp(event:MouseEvent):void
{
stage.removeEventListener(MouseEvent.MOUSE_MOVE, onMouseMove);
stage.removeEventListener(MouseEvent.MOUSE_UP, onMouseUp);
}[/as]

« Previous Post
Next Post »