Tracés de dessin

La section sur le dessin de lignes et de courbes (voir Dessin de lignes et de courbes) a présenté les commandes permettant de tracer une ligne (Graphics.lineTo()) ou courbe (Graphics.curveTo()) unique, puis de la déplacer vers un autre point (Graphics.moveTo()) pour obtenir une forme. Certaines nouvelles fonctions de l’API de dessin d’ActionScript, telles Graphics.drawPath() et Graphics.drawTriangles(), utilisent les commandes de dessin existantes en tant que paramètres. Vous pouvez ainsi définir une série de commandes Graphics.lineTo(), Graphics.curveTo() ou Graphics.moveTo() traitées par le moteur d’exécution Flash en une seule instruction.

Deux des nouvelles fonctions de l’API de dessin permettent à Graphics.drawPath() et à Graphics.drawTriangles() de consolider les commandes existantes :

• Classe d’énumérationGraphicsPathCommand : cette classe associe plusieurs commandes de dessin à des valeurs constantes. Vous utilisez une série de ces valeurs comme paramètres de la méthode Graphics.drawPath(). Vous pouvez ensuite rendre une forme entière ou plusieurs formes à l’aide d’une seule commande. Vous pouvez aussi modifier dynamiquement les valeurs transmises à ces méthodes pour modifier une forme existante.

• Tableaux de vecteurs : les tableaux de vecteurs contiennent une série de valeurs d’un type de données spécifique. Vous stockez une série de constantes GraphicsPathCommand dans un objet Vector et une série de coordonnées dans un autre objet Vector. Graphics.drawPath() ou Graphics.drawTriangles() attribue ces valeurs ensemble pour générer un tracé de dessin ou une forme.

Il n’est plus nécessaire d’utiliser des commandes distinctes pour chaque segment d’une forme. Par exemple, la méthode Graphics.drawPath() conjugue Graphics.moveTo(), Graphics.lineTo() et Graphics.curveTo(). Au lieu d’être appelées séparément, ces méthodes sont converties en identifiants numériques tels que définis dans la classe GraphicsPathCommand. Une opération moveTo() est représentée par un 1, une opération lineTo() par un 2. Stockez un tableau de ces valeurs dans un objet Vector.<int> à utiliser dans le paramètre commands. Créez ensuite un autre tableau contenant des coordonnées dans un objet Vector.<Number> à utiliser dans le paramètre data. Chaque valeur GraphicsPathCommand correspond aux valeurs de coordonnée stockées dans le paramètre data, deux nombres consécutifs définissant un emplacement dans l’espace de coordonnées cible.

La méthode Graphics.drawPath() fait correspondre chaque commande à ses valeurs de point respectives (une série de deux ou quatre nombres) pour générer un tracé dans l’objet Graphics :

package{ 
import flash.display.*; 
 
public class DrawPathExample extends Sprite { 
    public function DrawPathExample(){ 
 
    var square_commands:Vector.<int> = new Vector.<int>(5,true); 
    square_commands[0] = 1;//moveTo 
    square_commands[1] = 2;//lineTo 
    square_commands[2] = 2; 
    square_commands[3] = 2; 
    square_commands[4] = 2; 
 
    var square_coord:Vector.<Number> = new Vector.<Number>(10,true); 
    square_coord[0] = 20; //x 
    square_coord[1] = 10; //y 
    square_coord[2] = 50; 
    square_coord[3] = 10; 
    square_coord[4] = 50; 
    square_coord[5] = 40; 
    square_coord[6] = 20; 
    square_coord[7] = 40; 
    square_coord[8] = 20; 
    square_coord[9] = 10; 
 
    graphics.beginFill(0x442266);//set the color 
    graphics.drawPath(square_commands, square_coord); 
    } 
} 
}

Dans l’exemple précédent, chaque paire commande/coordonnées est affectée individuellement afin d’indiquer sa position dans le tableau. Les paires peuvent toutefois être affectées en une seule instruction. L’exemple suivant dessine la même étoile en affectant les valeurs pour chaque tableau en une seule instruction push().

package{ 
import flash.display.*; 
 
public class DrawPathExample extends Sprite { 
    public function DrawPathExample(){ 
 
    var square_commands:Vector.<int> = new Vector.<int>(); 
    square_commands.push(1, 2, 2, 2, 2); 
    var square_coord:Vector.<Number> = new Vector.<Number>(); 
    square_coord.push(20,10, 50,10, 50,40, 20,40, 20,10); 
 
    graphics.beginFill(0x442266); 
    graphics.drawPath(square_commands, square_coord); 
    } 
} 
}