Gewusst wie: Zeichnen eines Bereichs mit einem linearen Farbverlauf

In diesem Beispiel wird veranschaulicht, wie mithilfe der LinearGradientBrush-Klasse ein Bereich mit einem linearen Farbverlauf gezeichnet wird. In dem folgenden Beispiel wird die Fill eines Rectangle mit einem diagonalen linearen Farbverlauf gezeichnet, der sich von Gelb über Rot und Blau in Gelbgrün ändert.

Beispiel

<!-- This rectangle is painted with a diagonal linear gradient. -->
<Rectangle Width="200" Height="100">
  <Rectangle.Fill>
    <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>
  </Rectangle.Fill>
</Rectangle>

Rectangle diagonalFillRectangle = new Rectangle();
diagonalFillRectangle.Width = 200;
diagonalFillRectangle.Height = 100;

// Create a diagonal linear gradient with four stops.   
LinearGradientBrush myLinearGradientBrush =
    new LinearGradientBrush();
myLinearGradientBrush.StartPoint = new Point(0,0);
myLinearGradientBrush.EndPoint = new Point(1,1);
myLinearGradientBrush.GradientStops.Add(
    new GradientStop(Colors.Yellow, 0.0));
myLinearGradientBrush.GradientStops.Add(
    new GradientStop(Colors.Red, 0.25));                
myLinearGradientBrush.GradientStops.Add(
    new GradientStop(Colors.Blue, 0.75));        
myLinearGradientBrush.GradientStops.Add(
    new GradientStop(Colors.LimeGreen, 1.0));

// Use the brush to paint the rectangle.
diagonalFillRectangle.Fill = myLinearGradientBrush;

In der folgenden Abbildung wird der im vorherigen Beispiel erstellte Farbverlauf dargestellt.

Einen horizontalen linearen Farbverlauf erstellen Sie, indem Sie den StartPoint und EndPoint für das LinearGradientBrush-Element in (0,0.5) und (1,0.5) ändern. In dem folgenden Beispiel wird ein Rectangle-Element mit einem horizontalen linearen Farbverlauf gezeichnet.

<!-- This rectangle is painted with a horizontal linear gradient. -->
<Rectangle Width="200" Height="100">
  <Rectangle.Fill>
    <LinearGradientBrush StartPoint="0,0.5" EndPoint="1,0.5">
      <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>
  </Rectangle.Fill>
</Rectangle>

            Rectangle horizontalFillRectangle = new Rectangle();
            horizontalFillRectangle.Width = 200;
            horizontalFillRectangle.Height = 100;

            // Create a horizontal linear gradient with four stops.   
            LinearGradientBrush myHorizontalGradient =
                new LinearGradientBrush();
            myHorizontalGradient.StartPoint = new Point(0,0.5);
            myHorizontalGradient.EndPoint = new Point(1,0.5);
            myHorizontalGradient.GradientStops.Add(
                new GradientStop(Colors.Yellow, 0.0));
            myHorizontalGradient.GradientStops.Add(
                new GradientStop(Colors.Red, 0.25));                
            myHorizontalGradient.GradientStops.Add(
                new GradientStop(Colors.Blue, 0.75));        
            myHorizontalGradient.GradientStops.Add(
                new GradientStop(Colors.LimeGreen, 1.0));

            // Use the brush to paint the rectangle.
            horizontalFillRectangle.Fill = myHorizontalGradient; 

In der folgenden Abbildung wird der im vorherigen Beispiel erstellte Farbverlauf dargestellt.

Einen vertikalen linearen Farbverlauf erstellen Sie, indem Sie den StartPoint und EndPoint für das LinearGradientBrush-Element in (0.5,0) und (0.5,1) ändern. In dem folgenden Beispiel wird ein Rectangle-Element mit einem vertikalen linearen Farbverlauf gezeichnet.

<!-- This rectangle is painted with a vertical gradient. -->
<Rectangle Width="200" Height="100">
  <Rectangle.Fill>
    <LinearGradientBrush StartPoint="0.5,0" EndPoint="0.5,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>
  </Rectangle.Fill>
</Rectangle>

Rectangle verticalFillRectangle = new Rectangle();
verticalFillRectangle.Width = 200;
verticalFillRectangle.Height = 100;

// Create a vertical linear gradient with four stops.   
LinearGradientBrush myVerticalGradient =
    new LinearGradientBrush();
myVerticalGradient.StartPoint = new Point(0.5,0);
myVerticalGradient.EndPoint = new Point(0.5,1);
myVerticalGradient.GradientStops.Add(
    new GradientStop(Colors.Yellow, 0.0));
myVerticalGradient.GradientStops.Add(
    new GradientStop(Colors.Red, 0.25));                
myVerticalGradient.GradientStops.Add(
    new GradientStop(Colors.Blue, 0.75));        
myVerticalGradient.GradientStops.Add(
    new GradientStop(Colors.LimeGreen, 1.0));

// Use the brush to paint the rectangle.
verticalFillRectangle.Fill = myVerticalGradient;  

In der folgenden Abbildung wird der im vorherigen Beispiel erstellte Farbverlauf dargestellt.

Hinweis

Die Beispiele in diesem Thema verwenden das Standardkoordinatensystem zum Festlegen von Startpunkten und Endpunkten.Das Standardkoordinatensystem ist relativ zu einem umgebenden Rechteck: 0 gibt 0 Prozent des umgebenden Rechtecks an, und 1 gibt 100 Prozent des umgebenden Rechtecks an.Sie können dieses Koordinatensystem ändern, indem Sie den Wert der MappingMode-Eigenschaft auf den Wert BrushMappingMode.Absolute festlegen.Ein absolutes Koordinatensystem ist nicht relativ zu einem umgebenden Rechteck.Werte werden direkt im lokalen Raum interpretiert.

Weitere Beispiele finden Sie unter Beispiel für Pinsel. Weitere Informationen zu Farbverläufen und anderen Typen von Pinseln finden Sie unter Übersicht über das Zeichnen mit Volltonfarben und Farbverläufen.