Syntaxe XAML pour les tracés

Parcourir l’exemple

La syntaxe de balisage du chemin d’accès .NET Multiplateforme App UI (.NET MAUI) vous permet de spécifier compactement des géométries de chemin dans XAML.

La syntaxe de balisage de chemin d’accès est spécifiée en tant que valeur de chaîne pour la Path.Data propriété :

<Path Stroke="Black"
      Data="M13.908992,16.207977 L32.000049,16.207977 32.000049,31.999985 13.908992,30.109983Z" />

La syntaxe de balisage de chemin d’accès est composée d’une valeur facultative FillRule et d’une ou plusieurs descriptions de figure. Cette syntaxe peut être exprimée sous la forme suivante : <Path Data="[fillRule]figureDescription[figureDescription] * " ... />

Dans cette syntaxe :

• fillRule est facultatif FillRule qui spécifie si la géométrie doit utiliser la règle ou Nonzero la EvenOdd règle de remplissage. F0 est utilisé pour spécifier la EvenOdd règle de remplissage, tandis qu’elle F1 est utilisée pour spécifier la règle de Nonzero remplissage. Pour plus d’informations sur les règles de remplissage, consultez Règles de remplissage.
• figureDescription représente une figure composée d’une commande move, de commandes de dessin et d’une commande de fermeture facultative. Une commande move spécifie le point de départ de la figure. Les commandes Dessiner décrivent le contenu de la figure et la commande de fermeture facultative ferme la figure.

Dans l’exemple ci-dessus, la syntaxe de balisage de chemin spécifie un point de départ à l’aide de la commande move (M), une série de lignes droites à l’aide de la commande de ligne (L) et ferme le chemin avec la commande close (Z).

Dans la syntaxe de balisage de chemin d’accès, les espaces ne sont pas requis avant ou après les commandes. En outre, deux nombres ne doivent pas être séparés par une virgule ou un espace blanc, mais cela ne peut être obtenu que lorsque la chaîne est non ambiguë.

Conseil

La syntaxe de balisage de chemin d’accès est compatible avec les définitions de chemin d’accès d’image SVG (Scalable Vector Graphics), ce qui permet de porter des graphiques au format SVG.

Bien que la syntaxe de balisage de chemin d’accès soit destinée à être utilisée en XAML, elle peut être convertie en objet Geometry dans le code en appelant la ConvertFromInvariantString méthode dans la PathGeometryConverter classe :

Geometry pathData = (Geometry)new PathGeometryConverter().ConvertFromInvariantString("M13.908992,16.207977 L32.000049,16.207977 32.000049,31.999985 13.908992,30.109983Z");

Commande Move

La commande move spécifie le point de départ d’une nouvelle figure. La syntaxe de cette commande est : MstartPoint ou mstartPoint.

Dans cette syntaxe, startPoint est une Point structure qui spécifie le point de départ d’une nouvelle figure. Si vous répertoriez plusieurs points après la commande de déplacement, une ligne est dessinée à ces points.

M 10,10 est un exemple de commande de déplacement valide.

Commandes De dessin

Une commande draw peut se composer de plusieurs commandes shape. Les commandes de dessin suivantes sont disponibles :

• Ligne (L ou l).
• Ligne horizontale (H ou h).
• Ligne verticale (V ou v).
• Arc elliptique (A ou a).
• Courbe bezier cubique (C ou c).
• Courbe de Bezier quadratique (Q ou q).
• Courbe bezier lisse (S ou s).
• Courbe de Bezier quadratique lisse (T ou t).

Chaque commande de dessin est spécifiée avec une lettre non sensible à la casse. Lorsque vous entrez séquentiellement plusieurs commandes du même type, vous pouvez omettre l’entrée de commande en double. Par exemple L 100,200 300,400 , équivaut à L 100,200 L 300,400.

Commande de ligne

La commande de ligne crée une ligne droite entre le point actuel et le point de terminaison spécifié. La syntaxe de cette commande est : LendPoint ou lendPoint.

Dans cette syntaxe, endPoint est un Point point de terminaison qui représente le point de terminaison de la ligne.

L 20,30 et L 20 30 sont des exemples de commandes de ligne valides.

Pour plus d’informations sur la création d’une ligne droite en tant qu’objet PathGeometry , consultez Créer un LineSegment.

Commande de ligne horizontale

La commande de ligne horizontale crée une ligne horizontale entre le point actuel et la coordonnée x spécifiée. La syntaxe de cette commande est : Hx ou hx.

Dans cette syntaxe, x est un double qui représente la coordonnée x du point de terminaison de la ligne.

H 90 est un exemple de commande horizontal line valide.

Commande de ligne verticale

La commande de ligne verticale crée une ligne verticale entre le point actuel et la coordonnée y spécifiée. La syntaxe de cette commande est la suivante : Vy ou vy.

Dans cette syntaxe, y est un double qui représente la coordonnée y du point de terminaison de la ligne.

V 90 est un exemple de commande vertical line valide.

Commande arc Elliptical

La commande arc elliptique crée un arc elliptique entre le point actuel et le point de terminaison spécifié. La syntaxe de cette commande est : AsizerotationAngleisLargeArcFlagsweepDirectionFlagendPoint ou asizerotationAngleisLargeArcFlagsweepDirectionFlagendPoint.

Dans cette syntaxe :

• size est un Size qui représente le rayon x et y de l’arc.
• rotationAngle est un double qui représente la rotation de l’ellipse, en degrés.
• isLargeArcFlag doit être défini sur 1 si l’angle de l’arc doit être de 180 degrés ou supérieur, sinon le définir sur 0.
• sweepDirectionFlag doit être défini sur 1 si l’arc est dessiné dans une direction à angle positif, sinon définissez-le sur 0.
• endPoint est une Point à laquelle l’arc est dessiné.

A 150,150 0 1,0 150,-150 est un exemple de commande arc elliptique valide.

Pour plus d’informations sur la création d’un PathGeometry arc elliptique en tant qu’objet, consultez Créer un arcSegment.

Commande courbe bezier cubique

La commande de courbe bezier cube crée une courbe bezier cubique entre le point actuel et le point de terminaison spécifié à l’aide des deux points de contrôle spécifiés. La syntaxe de cette commande est : CcontrolPoint1controlPoint2endPoint ou ccontrolPoint1 controlPoint2endPoint.

Dans cette syntaxe :

• controlPoint1 est un Point qui représente le premier point de contrôle de la courbe, qui détermine la tangente de départ de la courbe.
• controlPoint2 est un Point qui représente le deuxième point de contrôle de la courbe, qui détermine la tangente de fin de la courbe.
• endPoint est un Point point qui représente le point vers lequel la courbe est dessinée.

C 100,200 200,400 300,200 est un exemple de commande de courbe de Bezier cubique valide.

Pour plus d’informations sur la création d’une courbe bezier cubique en tant qu’objet PathGeometry , consultez Créer un BezierSegment.

Commande de courbe de Bezier quadratique

La commande de courbe de Bezier quadratique crée une courbe de Bezier quadratique entre le point actuel et le point de terminaison spécifié à l’aide du point de contrôle spécifié. La syntaxe de cette commande est : QcontrolPoint endPoint ou qcontrolPoint endPoint.

Dans cette syntaxe :

• controlPoint est un Point qui représente le point de contrôle de la courbe, qui détermine les tangentes de début et de fin de la courbe.
• endPoint est un Point point qui représente le point vers lequel la courbe est dessinée.

Q 100,200 300,200 est un exemple de commande quadratic Bezier curve valide.

Pour plus d’informations sur la création d’une courbe de Bezier quadratique en tant qu’objet PathGeometry , consultez Créer un QuadraticBezierSegment.

Commande de courbe de bezier lisse

La commande de courbe bezier cubique lisse crée une courbe bezier cubique entre le point actuel et le point de terminaison spécifié à l’aide du point de contrôle spécifié. La syntaxe de cette commande est : ScontrolPoint2endPoint ou scontrolPoint2 endPoint.

Dans cette syntaxe :

• controlPoint2 est un Point qui représente le deuxième point de contrôle de la courbe, qui détermine la tangente de fin de la courbe.
• endPoint est un Point point qui représente le point vers lequel la courbe est dessinée.

Le premier point de contrôle est supposé être la réflexion du deuxième point de contrôle de la commande précédente, par rapport au point actuel. S’il n’y a pas de commande précédente ou si la commande précédente n’était pas une commande de courbe bezier cube ou une commande de courbe bezier lisse, le premier point de contrôle est supposé coïncider avec le point actuel.

S 100,200 200,300 est un exemple de commande de courbe de bezier lisse valide.

Commande courbe de Bezier quadratique lisse

La commande de courbe de Bezier quadratique lisse crée une courbe de Bezier quadratique entre le point actuel et le point de terminaison spécifié à l’aide d’un point de contrôle. La syntaxe de cette commande est : TendPoint ou tendPoint.

Dans cette syntaxe, endPoint est un Point point qui représente le point vers lequel la courbe est dessinée.

Le point de contrôle est supposé être la réflexion du point de contrôle de la commande précédente par rapport au point actuel. S’il n’existe aucune commande précédente ou si la commande précédente n’était pas une courbe de Bezier quadratique ou une commande lisse de courbe de Bezier quadratique, le point de contrôle est supposé coïncider avec le point actuel.

T 100,30 est un exemple de commande de courbe de bezier quadratique quadratique valide.

Commande Fermer

La commande close termine la figure actuelle et crée une ligne qui connecte le point actuel au point de départ de la figure. Par conséquent, cette commande crée une jointure de ligne entre le dernier segment et le premier segment de la figure.

La syntaxe de la commande close est : Z ou z.

Valeurs supplémentaires

Au lieu d’une valeur numérique standard, vous pouvez également utiliser les valeurs spéciales respectant la casse suivantes :

• Infinity représente double.PositiveInfinity.
• -Infinity représente double.NegativeInfinity.
• NaN représente double.NaN.

En outre, vous pouvez également utiliser la notation scientifique ne respectant pas la casse. Par conséquent, +1.e17 est une valeur valide.