Creating Gradient, not the usual kind

[jns.johansson]

Is the gradient effect even possible to make in Flash/AS3?

If you think it is, just hint me how cause I can't figure it out.

[Dazzer]

if you're talking about doing it programmatically, then this would be the place to look

Graphic.beginGradientFill()

Other than that... I don't see why you can't do it in Flash CS3

[spasticfantastic]

This from the AS3 documentation:



import flash.geom.*
import flash.display.*
var fillType:String = GradientType.LINEAR;
var colors:Array = [0xFF0000, 0x0000FF];
var alphas:Array = [100, 100];
var ratios:Array = [0x00, 0xFF];
var matr:Matrix = new Matrix();
matr.createGradientBox(20, 20, 0, 0, 0);
var spreadMethod:String = SpreadMethod.PAD;
this.graphics.beginGradientFill(fillType, colors, alphas, ratios, matr, spreadMethod);
this.graphics.drawRect(0,0,100,100);

[jns.johansson]

i know how to create a linear gradient, in the picture i showed there isnt a linear gradient.

it's rotated. the gradient fill goes 360 degrees.

is there someway to bend rectangles etc to create this kind of manner?

[spasticfantastic]

Ah I see. If you're interested in ninja-skills gradients this might help: http://www.boostworthy.com/blog/?p=200

Good luck and let us know how you did it.

[jns.johansson]

in photoshop its just called polar gradient. i'll look into the article.. :)

[hobbbz]

Can't be done through code. I tried to fake it even, lining up 2 linear or radial gradients, it wouldn't work.

I suggest trying to create it in illustrator and import it, or export a BMP from Photoshop and use that.

[jns.johansson]

Allright, would been so cool animating it through AS though. Yeah, guess I'm left to the import-option. Ty for the input.

[jns.johansson]

so, there you have it. It isn't possible for us mortals, we already estabilshed that, luckily some are gods.

http://www.boostworthy.com/blog/?p=226

[spasticfantastic]

Hot stuff.

[jns.johansson]

function createPolarGradient(radius:Number)
{
var shape:Shape = new Shape();
var count:uint = 1080;
var degreesToRadians:Number = Math.PI / 180;
var b:uint;
var g:uint;
var r:uint;
var color:uint;
var angle:Number;
var i:uint = 0;

var intervalID = setInterval(createLine, 10);

function createLine() {

b = (i / count) * 0xFF;
g = b << 8;
r = b << 16;
color = r | g | b;
angle = i / (count / 360) * degreesToRadians;

shape.graphics.lineStyle(1, color, 1, false, LineScaleMode.NONE, CapsStyle.NONE);
shape.graphics.moveTo(0, 0);
shape.graphics.lineTo(Math.cos(angle) * radius, Math.sin(angle) * radius);

i++;
if(i == count) {
clearInterval(intervalID);
}
}

shape.x = 400;
shape.y = 400;
this.addChild(shape);

}

createPolarGradient(100);

Now I'm no genious at this, but I got it to animate the whole process and I'm wondering why it slows down? Is there something recursive or some bottleeffect somewhere I can't find?