SWFC Manual


Basic usage of swfc   Fonts   Shapes   ActionScript   Buttons   Blend Modes   >Filters<  

7.Filters

An especially nice new feature of Flash 8 are filters.

The current version of swfc supports the following filters:


dropshadow
blur
gradientglow
bevel

7.1  The "dropshadow" filter 

dropsshadow can be used to add shadows below (or above) flash objects. Every shadow has a color, and a direction/distance parameter (angle,distance), which controls where the shadow will be placed. The shadow is calculated by blurring (radios blur the alpha layer of the corresponding object, strengthening it (multiplication with strength), filling it with color and then merging it with the background. If the optional knockout option is given, the original object is removed, only the shadow is visible. If the innershadow parameter is given, the shadow will be inside the object.

Code listing 7.1

.flash filename="shadow.swf" version=8 bbox=430x140 background=blue
    .font myfont "Times.ttf"
    .text mytext text="SHADOW" font=myfont size=140% color=yellow
    .dropshadow myshadow color=black blur=5 angle=45 distance=50 passes=2 strength=1
    .put mytext filter=myshadow y=75
.end

7.2  The "bevel" filter 

The bevel filter essentially applies two shadows at once, at opposite directions. It supports the same arguments as the dropshadow filter, and also the optional ontop argument, which, if given, moves the "shadows" above the image. (useful together with knockout).

The following example demonstrates another feature of the swfc filter implementation: filters can also be animated.

Code listing 7.2

.flash filename="bevel.swf" version=8 background=blue fps=12
    .font arial "Arial.ttf"
    .text abc text="FILTERS" font=arial size=130% color=red
    .text beveltxt text="BEVEL" font=arial size=130% color=red
    
    .bevel bevel0 highlight=white shadow=black blur=9 angle=45 distance=4 passes=2 strength=2 knockout
    .bevel bevel1 highlight=white shadow=black blur=14 angle=45 distance=6 passes=2 strength=2 knockout
    
    .bevel bevel2 highlight=white shadow=black blur=7 angle=0 distance=6 passes=2 strength=1 innershadow knockout
    .bevel bevel3 highlight=white shadow=black blur=7 angle=360 distance=6 passes=2 strength=1 innershadow knockout

    .put beveltxt filter=bevel0
    .put abc filter=bevel2 y=80
    .frame 50
    .change beveltxt filter=bevel1
    .frame 100
    .change beveltxt filter=bevel0
    .change abc filter=bevel3
.end

7.3  The "blur" filter 

The blur filter is probably the most simple filter- it only takes a blur radius and a number of passes. It then performs a blur effect by smoothening an area of blurx times blury pixels.

Code listing 7.3

.flash filename="blur.swf" version=8 fps=50 bbox=200x200
    .font arial "Arial.ttf"
    .blur myblur1 blur=100 passes=2 # blur=100 is an abbreviation for blurx=100 blury=100
    .blur myblur2 blurx=0 blury=0 passes=2
    .blur myblur3 blurx=0 blury=100 passes=2
    .textshape abc text="BLUR" font=arial size=100% 
    .filled fabc outline=abc line=2 color=blue fill=white
    .filled fabc2 outline=abc line=2 color=red fill=yellow
    .sprite mysprite
	.put fabc pin=center x=100 y=100
	.put fabc2 pin=center x=100 y=100
	.frame 200
	.change fabc pin=center rotate=360
	.change fabc2 pin=center rotate=-360
    .end
    .put mysprite filter=myblur1
    .frame 200
    .change mysprite filter=myblur2
    .frame 400
    .change mysprite filter=myblur3
.end

7.4  The "gradientglow" filter 

gradientglow is like the shadow filter, only that the resulting shadow color is calculated from a gradient instead of a single color.

Code listing 7.4

.flash filename="filters.swf" version=8
    .font times "Times.ttf"
    .text abc text="Gradientglow" font=times size=100% color=blue
    .gradient fire:
	0% black/00
	25% red/40
	50% orange/80
	75% yellow/c0
	100% white/ff
    .end
    .gradientglow fireglow1 gradient=fire blur=20 innershadow angle=1 distance=20
    .gradientglow fireglow2 gradient=fire blur=20 angle=0 distance=2 passes=1 knockout
    .gradientglow fireglow3 gradient=fire blur=20 angle=0 distance=2 passes=1 ontop

    .put abc1=abc filter=fireglow1
    .put abc2=abc y=50 filter=fireglow2
    .put abc3=abc y=100 filter=fireglow3
.end


Previous: Blend Modes SWFC Manual: Filters