Utilisation des classes de données graphiques

Flash Player 10 et les versions ultérieures, Adobe AIR 1.5 et les versions ultérieures

L’API de dessin amélioré inclut un ensemble de classes dans le package flash.display qui met en œuvre l’interface IGraphicsData . Ces classes fonctionnent comme des objets de valeur (conteneurs de données) qui représentent les méthodes de l’API de dessin.

Les classes suivantes implémentent l’interface IGraphicsData :

Ces classes vous permettent de stocker un dessin complet dans un objet Vector de type IGraphicsData (Vector.<IGraphicsData>). Vous pouvez ensuite réutiliser les données graphiques comme source de données pour les autres instances de la forme ou pour stocker les informations de dessin pour une utilisation ultérieure.

Vous remarquerez qu’il existe plusieurs classes de remplissage (Fill) correspondant à chaque style de remplissage, mais une seule classe de trait (Stroke). ActionScript propose une seule classe de trait IGraphicsData car elle définit son style sur la base des classes de remplissage. Ainsi, chaque trait est en fait défini par une combinaison de la classe stroke et d’une classe fill. Pour le reste, l’API de ces classes de données graphiques est identique aux méthodes qu’elles représentent dans la classe flash.display.Graphics :

Méthode graphique

Classe correspondante

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

En outre, la classe GraphicsPath possède ses propres méthodes d’utilitaire ( GraphicsPath.moveTo() , GraphicsPath.lineTo() , GraphicsPath.curveTo() , GraphicsPath.wideLineTo() et GraphicsPath.wideMoveTo() ) pour simplifier la définition de ces commandes pour une occurrence de GraphicsPath. Ces méthodes facilitent la définition ou la mise à jour directe des commandes et des valeurs de données.

Réalisation d’un dessin avec les données graphiques vectorielles

Lorsque vous disposez d’une série d’instances de IGraphicsData, utilisez la méthode drawGraphicsData() de la classe Graphics pour effectuer le rendu des graphiques. La méthode drawGraphicsData() exécute un ensemble d’instructions de dessin à partir d’un vecteur d’instances de IGraphicsData en séquence : 

// 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(GraphicsPathCommand.MOVE_TO, GraphicsPathCommand.LINE_TO, GraphicsPathCommand.LINE_TO); 
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);

En modifiant une valeur du tracé utilisé par le dessin de l’exemple, il est possible de retracer la forme plusieurs fois pour obtenir une image plus complexe : 

// 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);

Bien que les objets IGraphicsData puissent définir des styles de remplissage et de trait, ceux-ci ne sont pas obligatoires. Autrement dit, il est possible de définir des styles à l’aide des méthodes de la classe Graphics ou d’utiliser des objets IGraphicsData pour tracer un ensemble enregistré de tracés, et inversement.

Remarque : la méthode Graphics.clear() permet d’effacer un dessin avant d’en commencer un nouveau, à moins que vous ne complétiez le dessin d’origine, comme l’illustre l’exemple ci-dessus. Lorsque vous modifiez une partie d’un tracé ou d’un ensemble d’objets IGraphicsData, retracez le dessin entier pour visualiser les changements.

Lorsque vous utilisez des classes de données graphiques, le remplissage est rendu chaque fois que trois points au moins sont tracés car la forme est nécessairement fermée à ce point. Bien que le remplissage ait un effet de fermeture, ce n’est pas le cas du trait. Ce comportement est différent de celui de commandes Graphics.lineTo() ou Graphics.moveTo() utilisées plusieurs fois.

Lecture de données graphiques vectorielles

Dans Flash Player 11.6, Adobe AIR 3.6 et versions ultérieures, vous pouvez utiliser la méthode readGraphicsData( ) de la classe Graphics non seulement pour tracer le contenu vectoriel d’un objet d’affichage, mais aussi pour obtenir une représentation en données du contenu graphique vectoriel de cet objet. Ceci peut être utilisé pour créer un instantané d’un graphique afin notamment d’enregistrer, de copier ou de créer une feuille Sprite lors de l’exécution.

L’appel de la méthode readGraphicsData() renvoie une occurrence de Vector contenant des objets IGraphicsData. Il s’agit des mêmes objets que ceux utilisés pour tracer des graphiques vectoriels à l’aide de la méthode drawGraphicsData() .

Plusieurs limitations s’appliquent à la lecture des graphiques vectoriels avec la méthode readGraphicsData() . Pour plus d’informations, voir l’entrée readGraphicsData() dans le Guide de référence ActionScript.