Farbverläufe

Durchsuchen Sie das Beispiel

Die .NET Multi-platform App UI (.NET MAUI) GradientBrush-Klasse wird von der Brush-Klasse abgeleitet und ist eine abstrakte Klasse, die einen Farbverlauf beschreibt, der aus Farbverlaufsstopps besteht. Ein Farbverlaufspinsel zeichnet einen Bereich mit mehreren Farben, die sich auf einer Achse miteinander vermischen.

Klassen, die von GradientBrush abgeleitet werden, beschreiben unterschiedliche Möglichkeiten des Interpretierens von Farbverlaufsstopps, und .NET MAUI stellt die folgenden Farbverlaufpinsel bereit:

• LinearGradientBrush zeichnet einen Bereich mit einem linearen Farbverlauf. Weitere Informationen finden Sie unter Lineare Farbverlaufpinsel.
• RadialGradientBrush zeichnet einen Bereich mit einem radialen Farbverlauf. Weitere Informationen finden Sie unter Radiale Farbverlaufspinsel.

Die GradientBrush-Klasse definiert die GradientStops-Eigenschaft des Typs GradientStopCollection, die die Farbverlaufsstopps des Pinsels darstellt, von denen jede eine Farbe und einen Offset entlang der Farbverlaufsachse des Pinsels angibt. Ein GradientStopCollection ist ein ObservableCollection von GradientStop-Objekten. Die GradientStops-Eigenschaft wird durch ein BindableProperty-Objekt gestützt, was bedeutet, dass sie das Ziel von Datenbindungen sein kann, und geformt.

Hinweis

Die GradientStops-Eigenschaft ist die ContentProperty der GradientBrush-Klasse und muss daher nicht explizit in XAML festgelegt werden.

Farbverlaufsstopps

Farbverlaufstopps sind die Bausteine eines Farbverlaufpinsels und geben die Farben im Farbverlauf und deren Position entlang der Farbverlaufsachse an. Farbverlaufsstopps werden mithilfe von GradientStop-Objekten angegeben.

Die GradientStop-Klasse definiert die folgenden Eigenschaften:

• Color, vom Typ Color, die die Farbe des Farbverlaufstopps darstellt.
• Offset, vom Typ float stellt den Speicherort des Farbverlaufsstopps innerhalb des Farbverlaufsvektors ab. Der Standardwert dieser Eigenschaft ist 0, und gültige Werte befinden sich im Bereich 0,0-1,0. Je näher dieser Wert bei 0 liegt, desto näher befindet sich die Farbe am Beginn des Farbverlaufs. Und je näher dieser Wert bei 1 liegt, desto näher befindet sich die Farbe am Ende des Farbverlaufs.

Diese Eigenschaften werden durch BindableProperty-Objekte gestützt, was bedeutet, dass sie Ziele von Datenbindungen sein können, und geformt.

Wichtig

Das von Farbverläufen verwendete Koordinatensystem ist relativ zu einem umgebenden Feld für den Ausgabebereich. 0 gibt 0 Prozent, und 1 gibt 100 Prozent des umgebenden Feldes an. Daher beschreibt (0,5,0,5) einen Punkt in der Mitte des umgebenden Felds und (1,1) einen Punkt am unteren rechten Rand des umgebenden Felds.

Im folgenden XAML-Beispiel wird eine Diagonale LinearGradientBrush mit vier Farben erstellt:

<LinearGradientBrush StartPoint="0,0"
                     EndPoint="1,1">
    <GradientStop Color="Yellow"
                  Offset="0.0" />
    <GradientStop Color="Red"
                  Offset="0.25" />
    <GradientStop Color="Blue"
                  Offset="0.75" />             
    <GradientStop Color="LimeGreen"
                  Offset="1.0" />
</LinearGradientBrush>                                                       

Die Farbe der einzelnen Punkte zwischen den Farbverlaufsstopps wird linear als eine Kombination der von den beiden umgebenden Farbverlaufsstopps angegebenen Farben interpoliert. Die folgende Abbildung zeigt den Farbverlauf des vorherigen Beispiels:

In diesem Diagramm markieren die Kreise die Position der Farbverlaufsstopps, und eine gestrichelte Linie zeigt die Farbverlaufsachse an. Der erste Farbverlaufsstopp gibt die Farbe Gelb bei einem Offset von 0,0 an. Der zweite Farbverlaufsstopp gibt die Farbe Rot bei einem Offset von 0,25 an. Die Farbe der Punkte zwischen diesen zwei Farbverlaufsstopps ändert sich allmählich von Gelb zu Rot, wenn Sie sich von links nach rechts auf der Farbverlaufsachse bewegen. Der dritte Farbverlaufsstopp gibt die Farbe Blau bei einem Offset von 0,75 an. Die Farbe der Punkte zwischen dem zweiten und dritten Farbverlaufsstopp ändert sich allmählich von Rot zu Blau. Der vierte Farbverlaufsstopp gibt die Farbe Gelbgrün bei einem Offset von 1,0 an. Die Farbe der Punkte zwischen dem dritten und vierten Farbverlaufsstopp ändert sich allmählich von Blau zu Gelbgrün.