Xamarin.Forms Shapes: Pfadmarkupsyntax

  • Artikel

Beispiel herunterladen Das Beispiel herunterladen

Xamarin.Forms Mit der Pfadmarkupsyntax können Sie Pfadgeometrien in XAML kompakt angeben. Die Syntax wird als Zeichenfolgenwert für die Path.Data -Eigenschaft angegeben:

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

Die Pfadmarkupsyntax besteht aus einem optionalen FillRule Wert und einer oder mehreren Abbildungsbeschreibungen. Diese Syntax kann als ausgedrückt werden: <Path Data="[fillRule]figureDescription[figureDescription] * " ... />

In dieser Syntax:

  • fillRule ist optional Xamarin.Forms.Shapes.FillRule , das angibt, ob die Geometrie oder EvenOddNonzeroFillRuleverwenden soll. F0 wird verwendet, um die EvenOdd Füllregel anzugeben, während F1 die Nonzero Füllregel angegeben wird. Weitere Informationen zu Füllregeln finden Sie unter Xamarin.Forms Shapes: Füllregeln.
  • figureDescription stellt eine Abbildung dar, die aus einem Move-Befehl, Zeichenbefehlen und einem optionalen Schließen-Befehl besteht. Ein Move-Befehl gibt den Startpunkt der Abbildung an. Zeichnen-Befehle beschreiben den Inhalt der Abbildung, und der optionale Befehl schließen schließt die Abbildung.

Im obigen Beispiel gibt die Pfadmarkupsyntax einen Startpunkt mit dem Befehl move (M), eine Reihe von geraden Zeilen mit dem Zeilenbefehl (L) an und schließt den Pfad mit dem Befehl close (Z).

In der Pfadmarkupsyntax sind Leerzeichen vor oder nach Befehlen nicht erforderlich. Darüber hinaus müssen zwei Zahlen nicht durch ein Komma oder Leerzeichen getrennt werden, aber dies kann nur erreicht werden, wenn die Zeichenfolge eindeutig ist.

Tipp

Pfadmarkupsyntax ist mit SVG-Bildpfaddefinitionen (Scalable Vector Graphics) kompatibel und kann daher für das Portieren von Grafiken aus dem SVG-Format nützlich sein.

Die Pfadmarkupsyntax ist zwar für die Verwendung in XAML vorgesehen, kann jedoch in ein Geometry Objekt im Code konvertiert werden, indem die ConvertFromInvariantString -Methode in der PathGeometryConverter -Klasse aufgerufen wird:

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

Verschieben-Befehl

Der Befehl move gibt den Startpunkt einer neuen Abbildung an. Die Syntax für diesen Befehl lautet: MstartPoint oder mstartPoint.

In dieser Syntax ist startPoint eine Point Struktur, die den Startpunkt einer neuen Abbildung angibt. Wenn Sie nach dem Befehl zum Verschieben mehrere Punkte auflisten, wird eine Linie zu diesen Punkten gezeichnet.

M 10,10 ist ein Beispiel für einen gültigen Verschiebungsbefehl.

Zeichnen-Befehle

Ein Draw-Befehl kann aus mehreren Shape-Befehlen bestehen. Die folgenden Zeichenbefehle sind verfügbar:

  • Zeile (L oder l).
  • Horizontale Linie (H oder h).
  • Vertikale Linie (V oder v).
  • Elliptischer Bogen (A oder a).
  • Kubische Bézierkurve (C oder c).
  • Quadratische Bézierkurve (Q oder q).
  • Glatte kubische Bézierkurve (S oder s).
  • Glatte quadratische Bézierkurve (T oder t).

Jeder Draw-Befehl wird mit einem Buchstaben ohne Beachtung der Groß-/Kleinschreibung angegeben. Wenn Sie nacheinander mehrere Befehle des gleichen Typs eingeben, müssen Sie die Befehle nicht doppelt eingeben. Beispielsweise L 100,200 300,400 ist gleichbedeutend mit L 100,200 L 300,400.

Linienbefehl

Der Zeilenbefehl erstellt eine gerade Linie zwischen dem aktuellen Punkt und dem angegebenen Endpunkt. Die Syntax für diesen Befehl lautet: LendPoint oder lendPoint.

In dieser Syntax ist endPoint ein Point , das den Endpunkt der Zeile darstellt.

L 20,30 und L 20 30 sind Beispiele für gültige Linienbefehle.

Informationen zum Erstellen einer geraden Linie als PathGeometry Objekt finden Sie unter Erstellen eines Zeilensegments.

Befehl für eine horizontale Linie

Mit dem Befehl horizontale Linie wird eine horizontale Linie zwischen dem aktuellen Punkt und der angegebenen x-Koordinate erstellt. Die Syntax für diesen Befehl lautet: Hx oder hx.

In dieser Syntax ist x ein double , das die x-Koordinate des Endpunkts der Linie darstellt.

H 90 ist ein Beispiel für einen gültigen Befehl für eine horizontale Linie.

Befehl für eine vertikale Linie

Mit dem Befehl vertikale Linie wird eine vertikale Linie zwischen dem aktuellen Punkt und der angegebenen y-Koordinate erstellt. Die Syntax für diesen Befehl lautet: Vy oder vy.

In dieser Syntax ist y ein double , das die y-Koordinate des Endpunkts der Linie darstellt.

V 90 ist ein Beispiel für einen gültigen Befehl für eine vertikale Linie.

Befehl für einen Ellipsenbogen

Der Befehl Ellipsenbogen erstellt einen elliptischen Bogen zwischen dem aktuellen Punkt und dem angegebenen Endpunkt. Die Syntax für diesen Befehl lautet: AsizerotationAngleisLargeArcFlagsweepDirectionFlagendPoint or asizerotationAngleisLargeArcFlagsweepDirectionFlagendPoint.

In dieser Syntax:

  • size ist ein Size , der den x- und y-Radius des Bogens darstellt.
  • rotationAngle ist eine double , die die Drehung der Ellipse in Grad darstellt.
  • isLargeArcFlag sollte auf 1 festgelegt werden, wenn der Winkel des Bogens 180 Grad oder höher sein soll, andernfalls auf 0 festlegen.
  • sweepDirectionFlag sollte auf 1 festgelegt werden, wenn der Bogen in positiver Winkelrichtung gezeichnet wird, andernfalls auf 0 festlegen.
  • endPoint ist ein Point Bogen, zu dem der Bogen gezeichnet wird.

A 150,150 0 1,0 150,-150 ist ein Beispiel für einen gültigen elliptischen Bogenbefehl.

Informationen zum Erstellen eines elliptischen Bogens als PathGeometry Objekt finden Sie unter Erstellen eines ArcSegments.

Befehl "Kubische Bézierkurve"

Mit dem Befehl kubische Bézierkurve wird eine kubische Bézierkurve zwischen dem aktuellen Punkt und dem angegebenen Endpunkt erstellt, indem die beiden angegebenen Kontrollpunkte verwendet werden. Die Syntax für diesen Befehl lautet: CcontrolPoint1controlPoint2endPoint oder ccontrolPoint1controlPoint2endPoint.

In dieser Syntax:

  • controlPoint1 ist ein Point , der den ersten Steuerungspunkt der Kurve darstellt, der den Starttangenten der Kurve bestimmt.
  • controlPoint2 ist ein Point , der den zweiten Steuerungspunkt der Kurve darstellt, der den Endtangenten der Kurve bestimmt.
  • endPoint ist ein Point Punkt, der den Punkt darstellt, auf den die Kurve gezeichnet wird.

C 100,200 200,400 300,200 ist ein Beispiel für einen gültigen kubischen Bezierkurvenbefehl.

Informationen zum Erstellen einer kubischen Bézierkurve als PathGeometry Objekt finden Sie unter Erstellen eines BézierSegments.

Befehl "Quadratische Bézierkurve"

Mit dem Befehl quadratische Bézierkurve wird eine quadratische Bézierkurve zwischen dem aktuellen Punkt und dem angegebenen Endpunkt erstellt, indem der angegebene Steuerungspunkt verwendet wird. Die Syntax für diesen Befehl lautet: QcontrolPointendPoint oder qcontrolPointendPoint.

In dieser Syntax:

  • controlPoint ist ein Point Steuerelement, das den Steuerungspunkt der Kurve darstellt, der die anfangs- und endenden Tangenten der Kurve bestimmt.
  • endPoint ist ein Point Punkt, der den Punkt darstellt, auf den die Kurve gezeichnet wird.

Q 100,200 300,200 ist ein Beispiel für einen gültigen quadratischen Bézierkurvenbefehl.

Informationen zum Erstellen einer quadratischen Bézierkurve als PathGeometry Objekt finden Sie unter Erstellen eines QuadraticBezierSegment.

Befehl "Glatte kubische Bézierkurve"

Mit dem Befehl glatte kubische Bézierkurve wird eine kubische Bézier-Kurve zwischen dem aktuellen Punkt und dem angegebenen Endpunkt erstellt, indem der angegebene Steuerungspunkt verwendet wird. Die Syntax für diesen Befehl lautet: ScontrolPoint2endPoint oder scontrolPoint2endPoint.

In dieser Syntax:

  • controlPoint2 ist ein Point , der den zweiten Steuerungspunkt der Kurve darstellt, der den Endtangenten der Kurve bestimmt.
  • endPoint ist ein Point Punkt, der den Punkt darstellt, auf den die Kurve gezeichnet wird.

Der erste Steuerungspunkt wird als Spiegelung des zweiten Steuerungspunkts des vorherigen Befehls relativ zum aktuellen Punkt angenommen. Wenn kein vorheriger Befehl vorhanden ist oder der vorherige Befehl kein kubischer Bézierkurvenbefehl oder ein smooth kubischer Bézierkurvenbefehl war, wird davon ausgegangen, dass der erste Steuerungspunkt mit dem aktuellen Punkt übereinstimmt.

S 100,200 200,300 ist ein Beispiel für einen gültigen Befehl für eine glatte kubische Bézierkurve.

Befehl "Glatte quadratische Bézierkurve"

Der Befehl glatte quadratische Bézierkurve erstellt mithilfe eines Kontrollpunkts eine quadratische Bézierkurve zwischen dem aktuellen Punkt und dem angegebenen Endpunkt. Die Syntax für diesen Befehl lautet: TendPoint oder tendPoint.

In dieser Syntax ist endPoint ein Point , das den Punkt darstellt, zu dem die Kurve gezeichnet wird.

Der Kontrollpunkt soll die Reflektion des Kontrollpunkts des vorherigen Befehls relativ zum aktuellen Punkt sein. Wenn kein vorheriger Befehl vorhanden ist oder der vorherige Befehl keine quadratische Bézierkurve oder ein glatter quadratischer Bézierkurvenbefehl war, wird davon ausgegangen, dass der Steuerungspunkt mit dem aktuellen Punkt übereinstimmt.

T 100,30 ist ein Beispiel für einen gültigen Befehl für eine quadratische kubische Bézierkurve.

Schließen-Befehl

Der Close-Befehl beendet die aktuelle Abbildung und erstellt eine Zeile, die den aktuellen Punkt mit dem Startpunkt der Abbildung verbindet. Daher erstellt dieser Befehl eine Zeilenverknnung zwischen dem letzten Segment und dem ersten Segment der Abbildung.

Die Syntax für den Befehl schließen lautet: Z oder z.

Zusätzliche Werte

Anstelle eines numerischen Standardwerts können Sie auch die folgenden Sonderwerte verwenden, bei dem die Groß-/Kleinschreibung beachtet wird:

  • Infinity stellt dar double.PositiveInfinity.
  • -Infinity stellt dar double.NegativeInfinity.
  • NaN stellt dar double.NaN.

Darüber hinaus können Sie auch die wissenschaftliche Notation ohne Beachtung der Groß-/Kleinschreibung verwenden. +1.e17 Daher ist ein gültiger Wert.