| Package | mx.graphics |
| Class | public class RadialGradient |
| Inheritance | RadialGradient GradientBase flash.events.EventDispatcher |
| Implements | IFill |
| Language Version : | ActionScript 3.0 |
| Product Version : | Flex 3 |
| Runtime Versions : | Flash Player 9, AIR 1.1 |
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 Syntax
Hide MXML SyntaxThe <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
| Property | Defined By | ||
|---|---|---|---|
![]() | angle : Number Deprecated: Please Use rotation
By default, the LinearGradientStroke defines a transition
from left to right across the control. | GradientBase | |
![]() | entries : 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 | ||
![]() | interpolationMethod : String
A value from the InterpolationMethod class
that specifies which interpolation method to use. | GradientBase | |
![]() | matrix : Matrix
An array of values used for matrix transformation. | GradientBase | |
![]() | rotation : 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 | ||
![]() | spreadMethod : String
A value from the SpreadMethod class
that specifies which spread method to use. | GradientBase | |
![]() | x : Number
The distance by which to translate each point along the x axis. | GradientBase | |
![]() | y : Number
The distance by which to translate each point along the y axis. | GradientBase | |
| Method | Defined By | ||
|---|---|---|---|
Constructor. | RadialGradient | ||
begin(target:Graphics, targetBounds:Rectangle, targetOrigin:Point):void
Starts the fill. | RadialGradient | ||
end(target:Graphics):void
Ends the fill. | RadialGradient | ||
| focalPointRatio | property |
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.
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.
public function get focalPointRatio():Number public function set focalPointRatio(value:Number):void| scaleX | property |
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.
public function get scaleX():Number public function set scaleX(value:Number):void| scaleY | property |
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.
public function get scaleY():Number public function set scaleY(value:Number):void| RadialGradient | () | Constructor |
public function RadialGradient()| Language Version : | ActionScript 3.0 |
| Product Version : | Flex 3 |
| Runtime Versions : | Flash Player 9, AIR 1.1 |
Constructor.
| 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.
|