Xamarin.Forms Formen

Eine Shape ist ein Typ von View, mit der Sie eine Form auf dem Bildschirm zeichnen können. Shape-Objekte können in Layout-Klassen und den meisten Steuerelementen verwendet werden, da die Shape-Klasse von der View-Klasse abgeleitet ist.

Xamarin.FormsShapes sind im Xamarin.Forms.Shapes Namespace unter iOS, Android, macOS, dem Universelle Windows-Plattform (UWP) und der Windows Presentation Foundation (WPF) verfügbar.

Shape definiert die folgenden Eigenschaften:

  • Aspect, vom Typ Stretch, beschreibt, wie die Form den ihr zugewiesenen Platz ausfüllt. Der Standardwert dieser Eigenschaft ist Stretch.None.
  • Fill, vom Typ Brush, gibt den Pinsel an, mit dem das Innere der Form gemalt wird.
  • Stroke vom Typ Brush gibt den Pinsel an, mit dem der Umriss der Form gezeichnet wird.
  • StrokeDashArray, vom Typ DoubleCollection, der eine Sammlung von double-Werten darstellt, die das Muster von Strichen und Lücken angeben, die zur Umrandung einer Form verwendet werden.
  • StrokeDashOffset, vom Typ double, gibt den Abstand innerhalb des Strichmusters an, in dem ein Strich beginnt. Der Standardwert für diese Eigenschaft ist 0,0.
  • StrokeLineCap, vom Typ PenLineCap, beschreibt die Form am Anfang und Ende einer Linie oder eines Segments. Der Standardwert dieser Eigenschaft ist PenLineCap.Flat.
  • StrokeLineJoin vom Typ PenLineJoin gibt die Art der Verbindung an, die an den Scheitelpunkten einer Form verwendet wird. Der Standardwert dieser Eigenschaft ist PenLineJoin.Miter.
  • StrokeMiterLimit, vom Typ double, gibt das Verhältnis der Gehrungslänge zur Hälfte des StrokeThickness einer Form an. Der Standardwert für diese Eigenschaft ist 10,0.
  • StrokeThickness, vom Typ double, gibt die Breite des Umrisses der Form an. Der Standardwert für diese Eigenschaft ist 1,0.

Diese Eigenschaften werden von BindableProperty-Objekten unterstützt, was bedeutet, dass sie Ziele von Datenbindungen sein können und formatiert werden können.

Xamarin.Forms definiert eine Anzahl von Objekten, die von der Shape Klasse abgeleitet sind. Dies sind Ellipse, , Line, Path, Polygon, Polylineund Rectangle.

Zeichnen von Formen

Brush Objekte werden verwendet, um die Stroke und Fill einer Form zu malen:

<Ellipse Fill="DarkBlue"
         Stroke="Red"
         StrokeThickness="4"
         WidthRequest="150"
         HeightRequest="50"
         HorizontalOptions="Start" />

In diesem Beispiel werden die Kontur und die Füllung eines Ellipse angegeben:

Zeichnen von Formen

Wichtig

Brush-Objekte verwenden einen Typkonverter, der die Angabe von Color-Werten für die Stroke-Eigenschaft ermöglicht.

Wenn Sie kein Brush-Objekt für Stroke angeben oder StrokeThickness auf 0 setzen, wird der Rand um die Form nicht gezeichnet.

Weitere Informationen zu Brush Objekten finden Sie unter Xamarin.Forms Pinsel. Weitere Informationen zu gültigen Color Werten finden Sie unter Farben in Xamarin.Forms.

Formen strecken

Shape Objekte haben eine Aspect-Eigenschaft, vom Typ Stretch. Diese Eigenschaft bestimmt, wie der Inhalt eines Shape-Objekts gestreckt wird, um den Layoutbereich des Shape-Objekts zu füllen. Shape Der Layoutbereich eines Objekts ist der vom Layoutsystem zugewiesene Xamarin.Forms PlatzShape, da es sich um eine explizite WidthRequest und HeightRequest einstellung oder aufgrund seiner HorizontalOptions Einstellungen handeltVerticalOptions.

Die Stretch-Enumeration definiert die folgenden Members:

  • None, was angibt, dass der Inhalt seine originale Größe behält. Dies ist der Standardwert der Eigenschaft Shape.Aspect.
  • Fill, was bedeutet, dass die Größe des Inhalts an die Zielmaße angepasst wird. Das Seitenverhältnis wird nicht beibehalten.
  • Uniform, was bedeutet, dass die Größe des Inhalts an die Zielmaße angepasst wird, wobei das Seitenverhältnis erhalten bleibt.
  • UniformToFill zeigt an, dass die Größe des Inhalts so angepasst wird, dass er die Zielmaße ausfüllt, wobei das Seitenverhältnis erhalten bleibt. Falls das Seitenverhältnis des Zielrechtecks von der Quelle abweicht, wird der Quellinhalt entsprechend den Zieldimensionen beschnitten.

Die folgende XAML zeigt, wie die Eigenschaft Aspect festgelegt wird:

<Path Aspect="Uniform"
      Stroke="Yellow"
      Fill="Red"
      BackgroundColor="LightGray"
      HorizontalOptions="Start"
      HeightRequest="100"
      WidthRequest="100">
    <Path.Data>
        <!-- Path data goes here -->
    </Path.Data>  
</Path>      

In diesem Beispiel zeichnet ein Path-Objekt ein Herz. Die Eigenschaften WidthRequest und HeightRequest des Path-Objekts werden auf 100 geräteunabhängige Einheiten und die Eigenschaft Aspect auf Uniform gesetzt. Infolgedessen wird der Inhalt des Objekts unter Beibehaltung des Seitenverhältnisses an die Zielgröße angepasst:

Formen strecken

Gestrichelte Formen zeichnen

Shape-Objekte haben eine StrokeDashArray-Eigenschaft, vom Typ DoubleCollection. Diese Eigenschaft stellt eine Sammlung von double-Werten dar, die das Muster der Striche und Lücken angeben, die zur Umrandung einer Form verwendet werden. Ein DoubleCollection ist ein ObservableCollection von double Werten. Jedes double in der Sammlung gibt die Länge eines Gedankenstrichs oder einer Lücke an. Das erste Element in der Sammlung, das sich bei Index 0 befindet, gibt die Länge eines Gedankenstrichs an. Das zweite Element in der Sammlung, das sich bei Index 1 befindet, gibt die Länge einer Lücke an. Daher geben Objekte mit einem geraden Indexwert Striche an, während Objekte mit einem ungeraden Indexwert Lücken angeben.

Shape-Objekte haben auch eine StrokeDashOffset-Eigenschaft vom Typ double, die den Abstand innerhalb des Strichmusters angibt, in dem ein Strich beginnt. Wenn diese Eigenschaft nicht festgelegt wird, hat der Shape einen durchgehenden Umriss.

Gestrichelte Formen können durch Einstellen der Eigenschaften StrokeDashArray und StrokeDashOffset gezeichnet werden. Die StrokeDashArray-Eigenschaft sollte auf einen oder mehrere double-Werte gesetzt werden, wobei jedes Paar durch ein einzelnes Komma und/oder ein oder mehrere Leerzeichen abgegrenzt ist. Zum Beispiel sind „0.5 1.0“ und „0.5,1.0“ beide gültig.

Das folgende XAML-Beispiel zeigt, wie man ein gestricheltes Rechteck zeichnet:

<Rectangle Fill="DarkBlue"
           Stroke="Red"
           StrokeThickness="4"
           StrokeDashArray="1,1"
           StrokeDashOffset="6"
           WidthRequest="150"
           HeightRequest="50"
           HorizontalOptions="Start" />

In diesem Beispiel wird ein gefülltes Rechteck mit einer gestrichelten Linie gezeichnet:

Gestricheltes Rechteck

Steuern von Linienenden

Eine Linie hat drei Teile: Linienanfang, Linienkörper und Linienende. Die Start- und Endkappen beschreiben die Form am Anfang und Ende einer Linie oder eines Segments.

Shape-Objekte haben eine StrokeLineCap-Eigenschaft vom Typ PenLineCap, die die Form am Anfang und Ende einer Linie oder eines Segments beschreibt. Die PenLineCap-Enumeration definiert die folgenden Members:

  • Flat, was eine Obergrenze darstellt, die nicht über den letzten Punkt der Linie hinausgeht. Dies ist vergleichbar mit keiner Zeilenbegrenzung und ist der Standardwert der Eigenschaft StrokeLineCap.
  • Square, das ein Rechteck darstellt, dessen Höhe der Linienstärke und dessen Länge der halben Linienstärke entspricht.
  • Round, der einen Halbkreis darstellt, dessen Durchmesser der Liniendicke entspricht.

Wichtig

Die Eigenschaft StrokeLineCap hat keine Wirkung, wenn Sie sie auf eine Form ohne Start- oder Endpunkte setzen. Diese Eigenschaft hat zum Beispiel keine Wirkung, wenn Sie sie auf einen Ellipse oder Rectangle setzen.

Die folgende XAML zeigt, wie die Eigenschaft StrokeLineCap festgelegt wird:

<Line X1="0"
      Y1="20"
      X2="300"
      Y2="20"
      StrokeLineCap="Round"
      Stroke="Red"
      StrokeThickness="12" />

In diesem Beispiel wird die rote Linie am Anfang und Ende der Linie abgerundet:

Linienkappen

Steuern von Linienverbindungen

Shape-Objekte haben eine StrokeLineJoin-Eigenschaft vom Typ PenLineJoin, die die Art der Verbindung angibt, die an den Scheitelpunkten der Form verwendet wird. Die PenLineJoin-Enumeration definiert die folgenden Members:

  • Miter, die regelmäßige winklige Scheitelpunkte darstellen. Dies ist der Standardwert der Eigenschaft StrokeLineJoin.
  • Bevel, die abgeschrägte Scheitelpunkte darstellt.
  • Round, die abgerundete Scheitelpunkte darstellen.

Hinweis

Wenn die StrokeLineJoin-Eigenschaft auf Miter gesetzt ist, kann die StrokeMiterLimit-Eigenschaft auf double gesetzt werden, um die Gehrungslänge von Linienverbindungen in der Form zu begrenzen.

Die folgende XAML zeigt, wie die Eigenschaft StrokeLineJoin festgelegt wird:

<Polyline Points="20 20,250 50,20 120"
          Stroke="DarkBlue"
          StrokeThickness="20"
          StrokeLineJoin="Round" />

In diesem Beispiel hat die dunkelblaue Polylinie abgerundete Verbindungen an ihren Scheitelpunkten:

Linienbeitritte