AS: Main
Hello, I found out that a lot of people who are very good with API are having trouble with gradient fills, so I figured I will make a small tutorial about it... here are links to the first 2 api tutorials by liam:
AS: API by -liam-
AS: API curves expended by -liam-
This is the third installation, and it will explain gradiants... first let's see what gradients are... I will only teach 2 color gradiants although I will explain how to add more...
Gradients are moves between one color or another (they have a mathematical meaning I'm not getting into)
I will use the command beginGradientFill, the rest you know from liam's stuff.
Gradient fills are terminated with endFill the same way normal fills are...
They have several elements:
fillType Either the string "linear" or the string "radial".
colors An array of RGB hex color values to be used in the gradient (for example, red is 0xFF0000, blue is 0x0000FF, and so on).
alphas An array of alpha values for the corresponding colors in the colors array; valid values are 0–100. If the value is less than 0, Flash uses 0. If the value is greater than 100, Flash uses 100.
ratios An array of color distribution ratios; valid values are 0–255. This value defines the percentage of the width where the color is sampled at 100 percent.
and the hardest part to most people is:
matrix A transformation matrix that is an object with either of the following two sets of properties.
a lot of people fail to understand that the matrix is just a predefined 2d array that can be easially manipulated, I don't blame them, the docs I've seen so far weren't too swell...
the syntax of the command itself is:
my_mc.beginGradientFill(fillType:String, colors:Array, alphas:Array, ratios:Array, matrix:Object):Void;
I'll explain this piece after piece... fillType is fairly easy since it's either "radial" or "linear" which is pretty self explanitory.
Colors is an array of colors the gradiant will go through... an example of such an array is:
[0xFF0000, 0x0000FF] it can also be [0xFF0000, 0x0000FF,0x444444] or any other similar combo, the order of the array is the order the colors will appear.
Alphas is pretty similar to colors, it is the alphas matching to the colors in the gradiant... if you don't want to use alphas just set em all to 100 as such
[100,100]
so
colors=[0xFF0000, 0x0000FF];
alphas=[100,100];
Rations is pretty simple as well, it is an array that states the point where the width will be at 100%, this allows you to move the center points of the color, if you don't want to move it you can just do
rations=[0,256];
this is so far pretty simple to you scripters ain't it? not much more difficult then entering some constant parameters (if it is ask questions freely).
The matrix
let's explain the distribution matrix now, it is the HARDEST part in gradient fills though it's not that hard once you get the concept.
a, b, c, d, e, f, g, h, i, this is your matrix, 9 values which really look as such :
a b c
d e f
g h i
you can play with those, however I seriusly DO NOT RECOMMAND TO DO SO... I use them but it took me a long time (about an hour or 2) of toying with it to understand it... you can do matrix type instead !
matrix = {matrixType:"box", x:100, y:100, w:200, h:200, r:(45/180)*Math.PI};
this allows you to set the x y width and height of the gradiant, as well as it's rotation (in radians), the matrix type is
this is the easiest way (a lot easier then an actual transformation matrix)
I hope this tutorial has been useful
comments please.
