Korzystanie z klas danych graficznych

Flash Player 10 i nowsze wersje, Adobe AIR 1.5 i nowsze wersje

Udoskonalony rysunkowy interfejs API zawiera w pakiecie flash.display nowy zbiór klas IGraphicsData (interfejs implementowany przez każdą z tych klas). Klasy implementujące interfejs IGraphicsData pełnią rolę kontenerów danych dla metod rysunkowego interfejsu API.

Klasy te umożliwiają przechowywanie całych rysunków w postaci tablic wektorowych typu IGraphicsData (Vector.<IGraphicsData>) i wielokrotne używanie ich jako źródła danych dla instancji kształtu. Ponadto tablic tych można używać do przechowywania informacji rysunkowych do wykorzystania w dalszych częściach kodu.

Należy zwrócić uwagę, że dla każdego stylu wypełnienia istnieje wiele klas wypełnienia, ale klasa obrysu jest tylko jedna. W języku ActionScript istnieje tylko jedna klasa obrysu z interfejsem IGraphicsData, ponieważ do definiowania stylu obrysu używane są klasy wypełnienia. A zatem każdy obrys jest w istocie klasą obrysu i klasą wypełnienia. Pomijając tę różnicę interfejs API tych klas graficznych wiernie odzwierciedla odpowiednie metody klasy flash.display.Graphics:

Metoda graficzna

Klasa danych

beginBitmapFill()

GraphicsBitmapFill

beginFill()

GraphicsSolidFill

beginGradientFill()

GraphicsGradientFill

beginShaderFill()

GraphicsShaderFill

lineBitmapStyle()

GraphicsStroke + GraphicsBitmapFill

lineGradientStyle()

GraphicsStroke + GraphicsGradientFill

lineShaderStyle()

GraphicsStroke + GraphicsShaderFill

lineStyle()

GraphicsStroke + GraphicsSolidFill

moveTo()

lineTo()

curveTo()

drawPath()

GraphicsPath

drawTriangles()

GraphicsTrianglePath

Ponadto klasa GraphicsPath ma własne metody pomocnicze GraphicsPath.moveTo(), GraphicsPath.lineTo(), GraphicsPath.curveTo(), GraphicsPath.wideLineTo() i GraphicsPath.wideMoveTo(), umożliwiające łatwe zdefiniowanie odpowiednich poleceń dla instancji GraphicsPath. Metody pomocnicze ułatwiają bezpośrednie definiowanie i aktualizowanie poleceń i wartości danych.

Po przygotowaniu zbioru instancji IGraphicsData można użyć metody Graphics.drawGraphicsData() do zrenderowania grafiki. Metoda Graphics.drawGraphicsData() sekwencyjnie przekazuje dane z instancji IGraphicsData do rysunkowego interfejsu API:

// stroke object 
var stroke:GraphicsStroke = new GraphicsStroke(3); 
stroke.joints = JointStyle.MITER; 
stroke.fill = new GraphicsSolidFill(0x102020);// solid stroke 
 
// fill object 
var fill:GraphicsGradientFill = new GraphicsGradientFill(); 
fill.colors = [0x0000FF, 0xEEFFEE]; 
fill.matrix = new Matrix(); 
fill.matrix.createGradientBox(70,70, Math.PI/2); 
// path object 
var path:GraphicsPath = new GraphicsPath(new Vector.<int>(), new Vector.<Number>()); 
path.commands.push(1,2,2); 
path.data.push(125,0, 50,100, 175,0); 
 
// combine objects for complete drawing 
var drawing:Vector.<IGraphicsData> = new Vector.<IGraphicsData>(); 
drawing.push(stroke, fill, path); 
 
// draw the drawing 
graphics.drawGraphicsData(drawing);

Modyfikując jedną wartość w ścieżce występującej w przykładowym rysunku, można wielokrotnie narysować kształt i stworzyć znacznie bardziej skomplikowany obraz:

// draw the drawing multiple times 
// change one value to modify each variation 
graphics.drawGraphicsData(drawing); 
path.data[2] += 200; 
graphics.drawGraphicsData(drawing); 
path.data[2] -= 150; 
graphics.drawGraphicsData(drawing); 
path.data[2] += 100; 
graphics.drawGraphicsData(drawing); 
path.data[2] -= 50;graphicsS.drawGraphicsData(drawing);

Mimo że obiekty IGraphicsData mogą definiować style wypełnień i obrysów, nie jest to wymagane. Innymi słowy, do ustawiania stylów można używać metod klasy Graphics, a do rysowania zapisanego zbioru ścieżek — obiektów IGraphicsData, albo odwrotnie.

Uwaga: Przed rozpoczęciem nowego rysunku należy wywołać metodę Graphics.clear() w celu wymazania poprzedniego, chyba że dodajemy do niego nowe elementy, tak jak w powyższym przykładzie. Po zmodyfikowaniu jednej części ścieżki lub zbioru obiektów IGraphicsData konieczne jest ponowne narysowanie całego rysunku, aby zmiany stały się widoczne.

W przypadku użycia klas danych graficznych wypełnienie jest renderowane za każdym razem, gdy rysowane są co najmniej trzy punkty, ponieważ oznacza to zamknięcie kształtu. Zamknięcie wypełnienia nie oznacza automatycznie zamknięcia kształtu; odróżnia to działanie omawianego mechanizmu od działania sekwencji osobno wywołanych poleceń Graphics.lineTo() lub Graphics.moveTo().