ActionScript: Vullen een vorm met een kleurverloop

Share

|

Gebruik de beginGradientFill () en endFill () methodes te leiden en sluiten een vorm getrokken tijdens runtime.

In een kleurverloop, is er een verandering in de beoordeling van kleuren. Flash ondersteunt lineaire hellingen, waarbij een kleur vervaagt in de volgende van links naar rechts. Flash ondersteunt ook radiale gradiënten, waarin de kleuren die uitstralen vanuit een middelpunt. Je kunt beginnen met een gradiënt-gevulde vorm met behulp van beginGradientFill () op dezelfde manier leiden een solide gevulde vorm met beginFill (). Het verschil is dat de oproep tot beginGradientFill () vereist een meer complexe reeks parameters:

gradientType
Ofwel "lineair" voor een lineaire gradiënt, of "radiaal" voor een radiaal verloop.

kleuren
Een array van RGB-waarden voor de kleuren te gebruiken in het verloop. Ze worden weergegeven in de helling van links naar rechts in een lineaire gradiënt, of vanuit het centrum naar buiten in een radiale gradiënt.

Alphas
Een array van alfa-waarden die overeenkomen met de kleuren in de kleuren parameter array.

ratio
Een array waarvan de elementen zijn die overeenkomen met de kleuren en alpha elementen. De waarden in de array ratio's geven de punt binnen de helling waarop elke kleur is zuiver. Het bereik van waarden voor de ratio's dienen te worden van 0 (meest linkse punt in een lineaire vullen, of diepste punt in een radiale vullen) tot 255 (meest rechtse of perifere).

matrix
Een object met de volgende eigenschappen:

matrixType
Deze waarde moet altijd "box".

x
De x-coördinaat van de linkerbenedenhoek van het verloop.

y
De y-coördinaat van de linkerbenedenhoek van het verloop.

breedte
De breedte van het verloop in pixels.

hoogte
De hoogte van het verloop in pixels.

r
De rotatie van de gradiënt in radialen (niet graden).

Hier is een voorbeeld dat een lineaire gradiënt gebruikt om een rechthoek te vullen:

/ / Neem de tekening methoden, die nodig zijn voor de drawRectangle () methode. # Include "DrawingMethods.as"

/ / De breedte en hoogte van de rechthoek vast te worden getrokken en gevuld. RectWidth = 100; rectHeight = 200;

/ / Maak een lege clip waarin we gebruik zullen maken van de vorm. _root.createEmptyMovieClip ( "Shape_mc", 1); shape_mc.lineStyle (3, 0, 100);

/ / Maak een kleuren array met RGB-waarden voor blauw, groen en rood. Kleuren = [0x0000FF, 0x00FF00, 0xFF0000];

/ / Maak een alfa array waarin de kleuren zijn 100% ondoorzichtig. Alfa = [100, 100, 100];

/ / Maak een array waar verhoudingen zuiver blauw is aan de linker rand van de helling, zuiver / / groen is in het midden, en zuiver rood aan de rechterkant. Ratios = [0, 127.5, 255];

/ / Maak de matrix object. Stel de x-en y-coördinaten, zodat de bottom-links / / hoek van de gradiënt lijnen met de linkerbenedenhoek van de rechthoek. Stel / / de breedte en hoogte van het verloop overeenkomen met de rechthoek. Matrix = (matrixType: "box", x:-rectWidth / 2, y:-rectHeight / 2, w: rectWidth, h: rectHeight, r: 0) ;

/ / Call beginGradientFill (), zodat de rechthoek zal worden / / gevuld met een lineaire gradiënt. Shape_mc.beginGradientFill ( "lineair", kleuren, Alfa, ratios, matrix);

/ / Teken de rechthoek met afgeronde hoeken (vereist DrawingMethods.as). Shape_mc.drawRectangle (rectHeight, rectWidth, 10);

/ / End de vulling. Shape_mc.endFill ();

Merk op dat de endFill () methode wordt gebruikt om een tekening operatie begonnen met ofwel beginFill end () of beginGradientFill ().

Hier is een voorbeeld van een radiale, kleurverloop gebruikt voor het vullen een ellips:

/ / Neem de tekening methoden, die nodig zijn voor de drawEllipse () methode. # Include "DrawingMethods.as"

/ / De breedte en hoogte van de ellips vast te worden getrokken en gevuld. EllipseWidth = 100; ellipseHeight = 200;

_root.createEmptyMovieClip ( "shape_mc", 1); shape_mc.lineStyle (3, 0x000000, 100);

/ / Maak kleuren, alfa's en ratio's arrays voor wit en zwart, beide 100% ondoorzichtig. / / Zuiver wit begint in het centrum en rangen in pure zwarte rand aan de buitenkant. Kleuren = [0xFFFFFF, 0x000000]; alfa = [100 , 100]; ratios = [0, 255];

/ / Definieer de matrix-object. Matrix = (matrixType: "box", x:-ellipseWidth / 2, y:-ellipseHeight / 2, w: ellipseWidth, h: ellipseHeight, r: 0);

/ / Begin de radiale vullen. Shape_mc.beginGradientFill ( "radiale", kleuren, Alfa, ratios, matrix);

/ / Teken de ellips (vereist DrawingMethods.as). Shape_mc.drawEllipse (ellipseWidth / 2, ellipseHeight / 2);

/ / End de vulling. Shape_mc.endFill (); 

---