PDA

View Full Version : getCustomFill & gradients


johnnystorm
06-07-2006, 07:13 PM
I've been trying to write a script that will fill a shape with a gradient fill, which works, however I want to change the gradient's direction from left to right to up and down. I can't seem to make this happen. I assume its the matrix object that controls this, however any changes I make to the matrix object has no affect on the fill.

Thanks

-js

var doc = fl.getDocumentDOM();
var fill = doc.getCustomFill();
fill.style = "linearGradient";
fill.colorArray = [ 0x000000, 0xffffff ];
fill.posArray = [0, 255];
var mat = fill.matrix;
mat.a = 0;
mat.b = 1;
mat.c = -1;
mat.d = 0;
fill.matrix = mat;
doc.setCustomFill(fill);

krazl
07-28-2006, 03:52 AM
I've been trying to write a script that will fill a shape with a gradient fill, which works, however I want to change the gradient's direction from left to right to up and down. I can't seem to make this happen. I assume its the matrix object that controls this, however any changes I make to the matrix object has no affect on the fill.

Thanks

-js

var doc = fl.getDocumentDOM();
var fill = doc.getCustomFill();
fill.style = "linearGradient";
fill.colorArray = [ 0x000000, 0xffffff ];
fill.posArray = [0, 255];
var mat = fill.matrix;
mat.a = 0;
mat.b = 1;
mat.c = -1;
mat.d = 0;
fill.matrix = mat;
doc.setCustomFill(fill);



_root.createEmptyMovieClip( "grad", 1 );
with ( _root.grad )

{

colors = [ 0xFF0000, 0x0000FF ];
alphas = [ 100, 100 ];
ratios = [ 0, 0xFF ];
matrix = { matrixType:"box", x:100, y:100, w:200, h:200, r:(45/180)*Math.PI };
beginGradientFill( "linear", colors, alphas, ratios, matrix );
moveto(100,100);
lineto(100,300);
lineto(300,300);
lineto(300,100);
lineto(100,100);
endFill();
}

r:(45/180)*Math.PI >>> change 45 to your degree...hope this will help

animatorgeek
02-20-2009, 03:48 PM
After some experimentation I've discovered that when calling setCustomFill, the transform matrix will remain unchanged in the selected shapes. In the toolbar custom fill, though, the matrix is properly updated. You can see this effect by running the sample code below. Then, with "lock fill" engaged, draw something new. You'll see the fill as it's supposed to look. You can see that it's updating properly by simply changing one of the matrix values in the code to change the transform, which will cause subsequent draws to look different.

Here's the code, lifted (almost) directly from the Fill.matrix documentation. I modified it a bit because it didn't seem to actually affect the custom fill color at all, since it never assigned the matrix settings it chose to the fill matrix. Anyway, here it is:



var fill = fl.getDocumentDOM().getCustomFill();
fill.style = 'radialGradient';
fill.colorArray = ['#00ff00','#ff00ff'];
fill.posArray = [0, 255];
fill.focalPoint = 100;
fill.linearRGB = false;
fill.overflow = 'repeat';
var mat = fl.getDocumentDOM().selection[0].matrix;
mat.a = 0.0167083740234375;
mat.b = -0.0096435546875;
mat.c = 0.0312957763671875;
mat.d = 0.05419921875;
mat.tx = 388.65;
mat.ty = 193.05;
for (i in mat) {
fl.trace(i+' : '+mat[i]);
}
fill.matrix = mat; // I added this line. Silly non working example :/
fl.getDocumentDOM().setCustomFill(fill);