AS3 :: BackgroundFill
Submitted by hasan on Tue, 02/03/2009 - 16:21.
This is the AS3 version of my AS2 :: BackgroundFill class. Just define your gradient (type, colors, etc) and the BackgroundFill class handles the rest including RESIZE events. Bitmaps and bitmap gradients are on the way...=)
package labs.otuome.ui.graphics
{
import flash.display.BitmapData;
import flash.display.MovieClip;
import flash.events.Event;
import flash.geom.Matrix;
/**
* Provides an easy reusable way to create seamless backgrounds for
* full-screen Flash movies whether it be gradients or bitmaps.
* Works with a BackgroundGradient object customized to your needs.
*/
public class BackgroundFill
{
//--------------------------------------------------------------
// PRIVATE PROPERTIES
//--------------------------------------------------------------
private var _target:MovieClip;
private var _gradient:BackgroundGradient;
private var _matrix:Matrix;
private var _width:Number;
private var _height:Number;
//--------------------------------------------------------------
// PUBLIC METHODS
//--------------------------------------------------------------
/**
* Constructor
*/
public function BackgroundFill( target:MovieClip, gradient:BackgroundGradient=null, fillNow:Boolean=false )
{
trace( '[ BackgroundFill :: constructor() ]' );
_target = target;
_target.stage.addEventListener( Event.RESIZE, _onResize, false, 0, true );
if (gradient) _gradient = gradient;
if (fillNow) _fillBackground();
}
//--------------------------------------------------------------
// PRIVATE METHODS
//--------------------------------------------------------------
/**
* Draws the gradient background fill.
*/
private function _fillBackground():void
{
_width = _target.stage.stageWidth;
_height = _target.stage.stageHeight;
trace( 'width = ' + _target.stage.stageWidth );
trace( 'height = ' + _target.stage.stageHeight );
_target.graphics.clear();
_target.graphics.lineStyle( 1, 0xffffff, 0 );
switch (_gradient.type)
{
case BackgroundGradient.LINEAR:
_matrix = new Matrix();
_matrix.createGradientBox( _width, _height, 90/180*Math.PI, 0, 0 );
break;
case BackgroundGradient.RADIAL:
_matrix = new Matrix();
_matrix.createGradientBox( _width, _height, 0, 0, 0 );
break;
}
// use the defaults for spreadMethod("pad"), interpolationMethod("RGB") and focalPointRatio(0)
_target.graphics.beginGradientFill( _gradient.type, _gradient.colors, _gradient.alphas, _gradient.ratios, _matrix );
with (_target.graphics)
{
lineTo( _width, 0 );
lineTo( _width, _height );
lineTo( 0, _height );
lineTo( 0, 0 );
endFill();
}
}
/**
* RESIZE event handler.
*/
private function _onResize( e:Event ):void
{
trace( '[ RMXBackgroundGradientFill :: _onResize() ]' );
_fillBackground();
}
}
}Here's a sample Document class that implements the BackgroundFill:
package
{
import flash.display.MovieClip;
import labs.otuome.ui.graphics.BackgroundFill;
import labs.otuome.ui.graphics.BackgroundGradient;
/**
* Document class for the background gradient fill SWF.
*/
public class BackgroundGradientFill extends MovieClip
{
private var _fill:BackgroundFill;
private var _gradient:BackgroundGradient;
/**
* Constructor
*/
public function BackgroundGradientFill()
{
trace( '[ BackgroundGradientFill :: constructor() ]' );
_init();
}
/**
* Initializes the background fill and adds the resize listener.
*/
private function _init():void
{
_gradient = new BackgroundGradient();
_gradient.type = BackgroundGradient.RADIAL;
_gradient.colors = [0x212121, 0x000000];
_gradient.alphas = [.5, .6];
_gradient.ratios = [1, 255];
_fill = new BackgroundFill( this, _gradient, true );
}
}
}Download source code here.


