问题
I'm trying to render a circle with a radial gradient but I can't seem to figure it out.
var bkgdGrad:Shape = new Shape();
bkgdGrad.graphics.beginGradientFill(GradientType.RADIAL, [0x0000FF, 0x00FF00], [1, 1], [0, 255],null,"pad");
bkgdGrad.graphics.drawCircle(0,0,r+200);
bkgdGrad.graphics.endFill();
this.addChild(bkgdGrad);
The above code renders a solid green circle for me. If I change the array after the colors to [1,0] (the alpha array) I get a transparent fill. I can't seem to get flash to draw a radial gradient, the above works no problem for GradientType.LINEAR
回答1:
Try this, it may be this will help you:
package
{
import flash.display.Sprite;
import flash.display.GradientType;
import flash.geom.Matrix;
public class RadialGradient extends Sprite
{
private var gType:String;
private var matrix:Matrix;
private var bound:Sprite;
public function RadialGradient()
{
var gType:String = GradientType.RADIAL;
var matrix:Matrix = new Matrix();
matrix.createGradientBox(550,400,0,0,0);
var gColors:Array = [0x0000FF, 0x00FF00];
var gAlphas:Array = [1,1];
var gRatio:Array = [0,255];
var bound:Sprite = new Sprite();
bound.graphics.beginGradientFill(gType,gColors,gAlphas,gRatio,matrix);
bound.graphics.drawCircle(0,0,r+200);
bound.x = bound.y = 0;
addChild(bound);
}
}
}
回答2:
You need a Matrix
object as well as its createGradientBox()
method.
I've made a class called RadialGraident
that creates a Shape
object with a circle that has a radial gradient. All you need to do is parse the radius, colors, alphas and ratios upon creating the object like in the following example:
package
{
import flash.display.Sprite;
import flash.events.Event;
public class Main extends Sprite
{
public function Main():void
{
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}// end function
private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
var radialGradient:RadialGradient = new RadialGradient(200, [0x0000FF, 0x00FF00], [1, 1], [0, 255]);
addChild(radialGradient);
}// end function
}// end class
}// end package
import flash.display.GradientType;
import flash.display.Shape;
import flash.geom.Matrix;
internal class RadialGradient extends Shape
{
public function RadialGradient(radius:Number, colors:Array, alphas:Array, ratios:Array)
{
var matrix:Matrix = new Matrix();
matrix.createGradientBox(radius * 2, radius * 2);
graphics.beginGradientFill(GradientType.RADIAL, colors, alphas, ratios, matrix);
graphics.drawCircle(radius, radius, radius);
graphics.endFill();
}// end function
}// end class
回答3:
create a gradient box with a new Matrix object and assign the new matrix object to your beginGradientFill matrix
parameter:
flash.geom.Matrix.createGradientBox()
[EDIT]: here's a simple online tutorial that should help explain more:
Drawing Gradients Programatically in AS3
来源:https://stackoverflow.com/questions/6561225/as3-begingradientfill-doesnt-make-me-a-gradient