Packagemx.graphics
Classpublic class RadialGradient
InheritanceRadialGradient Inheritance GradientBase Inheritance flash.events.EventDispatcher
Implements IFill

Language Version : ActionScript 3.0
Product Version : Flex 3
Runtime Versions : Flash Player 9, AIR 1.1

The RadialGradient class lets you specify a gradual color transition in the fill color. A radial gradient defines a fill pattern that radiates out from the center of a graphical element. You add a series of GradientEntry objects to the RadialGradient object's entries Array to define the colors that make up the gradient fill.

In MXML, you define a RadialGradient by adding a series of GradientEntry objects, as the following example shows:

  <mx:fill>
      <mx:RadialGradient>
          <mx:entries>
              <mx:GradientEntry color="0xC5C551" ratio="0.00" alpha="0.5"/>
              <mx:GradientEntry color="0xFEFE24" ratio="0.33" alpha="0.5"/>
              <mx:GradientEntry color="0xECEC21" ratio="0.66" alpha="0.5"/>
          </mx:entries>
      </mx:RadialGradient>
  </mx:fill>
  

You can also define a RadialGradient as a fill for any graphic element in ActionScript, as the following example shows:

  
  <?xml version="1.0"?>
  <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init()">
      <mx:Script>
      import flash.display.Graphics;
      import flash.geom.Rectangle;
      import mx.graphics.GradientEntry;
      import mx.graphics.RadialGradient;
  
      private function init():void
      {
          var w:Number = 200;
          var h:Number = 200;
  
          var s:Sprite = new Sprite();
          // Add the new Sprite to the display list.
          rawChildren.addChild(s);    
  
          var g:Graphics = s.graphics;
          g.lineStyle(1, 0x33CCFF, 1.0);
  
          var fill:RadialGradient = new RadialGradient();
          
          var g1:GradientEntry = new GradientEntry(0xFFCC66, 0.00, 0.5);
          var g2:GradientEntry = new GradientEntry(0x000000, 0.33, 0.5);
          var g3:GradientEntry = new GradientEntry(0x99FF33, 0.66, 0.5);
          
          fill.entries = [ g1, g2, g3 ];
  
          // Set focal point to upper left corner.
          fill.angle = 45;
          fill.focalPointRatio = -0.8;
  
          // Draw a box and fill it with the RadialGradient.
          g.moveTo(0, 0);
          fill.begin(g,new Rectangle(0, 0, w, h));
          g.lineTo(w, 0);
          g.lineTo(w, h);
          g.lineTo(0, h);
          g.lineTo(0, 0);      
          fill.end(g);
      }
      </mx:Script>
  </mx:Application>
  

MXML SyntaxexpandedHide MXML Syntax

The <mx:RadialGradient> tag inherits all the tag attributes of its superclass, and adds the following tag attributes:

  <mx:RadialGradient
    Properties
    angle="0"
    focalPointRatio="0"
  />
  

Default MXML Propertyentries

See also

mx.graphics.GradientEntry
mx.graphics.LinearGradient
mx.graphics.IFill


Public Properties
 PropertyDefined By
 Inheritedangle : Number
Deprecated: Please Use rotation
By default, the LinearGradientStroke defines a transition from left to right across the control.
GradientBase
 Inheritedentries : Array
An Array of GradientEntry objects defining the fill patterns for the gradient fill.
GradientBase
  focalPointRatio : Number
Sets the location of the start of the radial fill.
RadialGradient
 InheritedinterpolationMethod : String
A value from the InterpolationMethod class that specifies which interpolation method to use.
GradientBase
 Inheritedmatrix : Matrix
An array of values used for matrix transformation.
GradientBase
 Inheritedrotation : Number
By default, the LinearGradientStroke defines a transition from left to right across the control.
GradientBase
  scaleX : Number
The horizontal scale of the gradient transform, which defines the width of the (unrotated) gradient
RadialGradient
  scaleY : Number
The vertical scale of the gradient transform, which defines the height of the (unrotated) gradient
RadialGradient
 InheritedspreadMethod : String
A value from the SpreadMethod class that specifies which spread method to use.
GradientBase
 Inheritedx : Number
The distance by which to translate each point along the x axis.
GradientBase
 Inheritedy : Number
The distance by which to translate each point along the y axis.
GradientBase
Protected Properties
 PropertyDefined By
 InheritedcompoundTransform : CompoundTransform
Holds the matrix and the convenience transform properties (x, y, and rotation).
GradientBase
Public Methods
 MethodDefined By
  
Constructor.
RadialGradient
  
begin(target:Graphics, targetBounds:Rectangle, targetOrigin:Point):void
Starts the fill.
RadialGradient
  
end(target:Graphics):void
Ends the fill.
RadialGradient
Public Constants
 ConstantDefined By
 InheritedGRADIENT_DIMENSION : Number = 1638.4
[static] Value of the width and height of the untransformed gradient
GradientBase
Property Detail
focalPointRatioproperty
focalPointRatio:Number

Language Version : ActionScript 3.0
Product Version : Flex 3
Runtime Versions : Flash Player 9, AIR 1.1

Sets the location of the start of the radial fill.

Valid values are from -1.0 to 1.0. A value of -1.0 sets the focal point (or, start of the gradient fill) on the left of the bounding Rectangle. A value of 1.0 sets the focal point on the right of the bounding Rectangle.

If you use this property in conjunction with the angle property, this value specifies the degree of distance from the center that the focal point occurs. For example, with an angle of 45 and focalPointRatio of 0.25, the focal point is slightly lower and to the right of center. If you set focalPointRatio to 0, the focal point is in the middle of the bounding Rectangle.

If you set focalPointRatio to 1, the focal point is all the way to the bottom right corner of the bounding Rectangle.

The default value is 0.0.

This property can be used as the source for data binding.


Implementation
    public function get focalPointRatio():Number
    public function set focalPointRatio(value:Number):void
scaleXproperty 
scaleX:Number

Language Version : ActionScript 3.0
Product Version : Flex 3
Runtime Versions : Flash Player 9, AIR 1.1

The horizontal scale of the gradient transform, which defines the width of the (unrotated) gradient

This property can be used as the source for data binding.


Implementation
    public function get scaleX():Number
    public function set scaleX(value:Number):void
scaleYproperty 
scaleY:Number

Language Version : ActionScript 3.0
Product Version : Flex 3
Runtime Versions : Flash Player 9, AIR 1.1

The vertical scale of the gradient transform, which defines the height of the (unrotated) gradient

This property can be used as the source for data binding.


Implementation
    public function get scaleY():Number
    public function set scaleY(value:Number):void
Constructor Detail
RadialGradient()Constructor
public function RadialGradient()

Language Version : ActionScript 3.0
Product Version : Flex 3
Runtime Versions : Flash Player 9, AIR 1.1

Constructor.

Method Detail
begin()method
public function begin(target:Graphics, targetBounds:Rectangle, targetOrigin:Point):void

Language Version : ActionScript 3.0
Product Version : Flex 3
Runtime Versions : Flash Player 9, AIR 1.1

Starts the fill.

Parameters

target:Graphics — The target Graphics object that is being filled.
 
targetBounds:Rectangle — The Rectangle object that defines the size of the fill inside the target. If the dimensions of the Rectangle are larger than the dimensions of the target, the fill is clipped. If the dimensions of the Rectangle are smaller than the dimensions of the target, the fill expands to fill the entire target.
 
targetOrigin:Point — The Point that defines the origin (0,0) of the shape in the coordinate system of target.

end()method 
public function end(target:Graphics):void

Language Version : ActionScript 3.0
Product Version : Flex 3
Runtime Versions : Flash Player 9, AIR 1.1

Ends the fill.

Parameters

target:Graphics — The Graphics object that is being filled.