Erstellen eines linearen Farbverlaufs

GDI+ bietet horizontale, vertikale und diagonale lineare Farbverläufe. Die Farbe in einem linearen Farbverlauf wird im Normalfall gleichmäßig geändert. Sie können einen linearen Farbverlauf jedoch auch anpassen, so dass die Farbe ungleichmäßig geändert wird.

Horizontale lineare Farbverläufe

Im folgenden Beispiel werden eine Linie, eine Ellipse und ein Rechteck mit einem Pinsel mit horizontalem linearem Farbverlauf ausgefüllt:

' Pass in the opaque red and opaque blue as the third and fourth argument, 
' respectively.
Dim linGrBrush As New LinearGradientBrush( _
   New Point(0, 10), _
   New Point(200, 10), _
   Color.FromArgb(255, 255, 0, 0), _
   Color.FromArgb(255, 0, 0, 255))
Dim pen As New Pen(linGrBrush)
  
e.Graphics.DrawLine(pen, 0, 10, 200, 10)
e.Graphics.FillEllipse(linGrBrush, 0, 30, 200, 100)
e.Graphics.FillRectangle(linGrBrush, 0, 155, 500, 30)
[C#]
LinearGradientBrush linGrBrush = new LinearGradientBrush(
   new Point(0, 10),
   new Point(200, 10),
   Color.FromArgb(255, 255, 0, 0),   // Opaque red
   Color.FromArgb(255, 0, 0, 255));  // Opaque blue

Pen pen = new Pen(linGrBrush);

e.Graphics.DrawLine(pen, 0, 10, 200, 10);
e.Graphics.FillEllipse(linGrBrush, 0, 30, 200, 100);
e.Graphics.FillRectangle(linGrBrush, 0, 155, 500, 30);

Der LinearGradientBrush-Konstruktor empfängt vier Argumente: zwei Punkte und zwei Farben. Der erste Punkt (0, 10) ist mit der ersten Farbe (Rot) und der zweite Punkt (200, 10) mit der zweiten Farbe (Blau) verknüpft. Erwartungsgemäß ändert sich die Farbe der Linie, die von (0, 10) nach (200, 10) gezeichnet wird, graduell von Rot nach Blau.

Die Werte 10 in den Punkten (50, 10) und (200, 10) sind nicht wichtig. Es kommt lediglich darauf an, dass die zweite Koordinate der beiden Punkte identisch ist, die Linie also horizontal verläuft. Auch die Farbe der Ellipse und des Rechtecks ändert sich von Rot nach Blau, wenn die horizontale Koordinate von 0 auf 200 ansteigt.

In der folgenden Abbildung werden die Linie, die Ellipse und das Rechteck angezeigt. Beachten Sie, dass der Farbverlauf sich wiederholt, wenn die horizontale Koordinate über den Wert 200 hinausgeht.

Anpassen von linearen Farbverläufen

Die Farbkomponenten im vorhergehenden Beispiel verändern sich beim Verschieben der horizontalen Koordinate von 0 auf 200 linear. Wenn sich beispielsweise ein Punkt genau zwischen 0 und 200 befindet, liegt sein Blauwert genau in der Mitte zwischen 0 und 255.

GDI+ ermöglicht es Ihnen, die Art des Farbwechsels von einem Ende des Farbverlaufs zum anderen anzupassen. Angenommen, Sie möchten einen Farbverlaufspinsel erstellen, der entsprechend der folgenden Tabelle von Schwarz in Rot übergeht:

Beachten Sie, dass der Rotanteil bereits die Hälfte der maximalen Intensität hat, wenn die horizontale Koordinate erst 20 Prozent der Strecke von 0 nach 200 entspricht.

Im folgenden Beispiel wird die Blend-Eigenschaft eines LinearGradientBrush-Objekts festgelegt, um drei relative Intensitäten mit drei relativen Positionen zu verknüpfen. Wie in der vorangehenden Tabelle wird die relative Intensität 0.5 mit der relativen Position 0.2 verknüpft. Durch den Code werden eine Ellipse und ein Rechteck mit dem Farbverlaufspinsel ausgefüllt.

' Pass in the opaque black and opaque red as the third and fourth argument, 
' respectively.
Dim linGrBrush As New LinearGradientBrush( _
   New Point(0, 10), _
   New Point(200, 10), _
   Color.FromArgb(255, 0, 0, 0), _
   Color.FromArgb(255, 255, 0, 0))

Dim relativeIntensities As Single() =  {0F, 0.5F, 1F}
Dim relativePositions As Single() =  {0F, 0.2F, 1F}

'Create a Blend object and assign it to linGrBrush.
Dim blend As New Blend()
blend.Factors = relativeIntensities
blend.Positions = relativePositions
linGrBrush.Blend = blend

e.Graphics.FillEllipse(linGrBrush, 0, 30, 200, 100)
e.Graphics.FillRectangle(linGrBrush, 0, 155, 500, 30)
[C#]
LinearGradientBrush linGrBrush = new LinearGradientBrush(
   new Point(0, 10),
   new Point(200, 10),
   Color.FromArgb(255, 0, 0, 0),     // Opaque black 
   Color.FromArgb(255, 255, 0, 0));  // Opaque red

float[] relativeIntensities = {0.0f, 0.5f, 1.0f};
float[] relativePositions   = {0.0f, 0.2f, 1.0f};

//Create a Blend object and assign it to linGrBrush.
Blend blend = new Blend();
blend.Factors = relativeIntensities;
blend.Positions = relativePositions;
linGrBrush.Blend = blend;

e.Graphics.FillEllipse(linGrBrush, 0, 30, 200, 100);
e.Graphics.FillRectangle(linGrBrush, 0, 155, 500, 30);

In der folgenden Abbildung sind die resultierende Ellipse und das resultierende Rechteck dargestellt.

Diagonale lineare Farbverläufe

Die Farbverläufe in den bisherigen Beispielen verlaufen in horizontaler Richtung, d. h., die Farbe wechselt graduell entlang einer beliebigen horizontalen Linie. Darüber hinaus können Sie auch vertikale und diagonale Farbverläufe festlegen.

Im folgenden Beispiel werden die Punkte (0, 0) und (200, 100) an einen LinearGradientBrush-Konstruktor übergeben. Die Farbe Blau wird mit (0, 0) und die Farbe Grün mit (200, 100) verknüpft. Eine Linie (mit Stiftbreite 10) und eine Ellipse werden mit dem Pinsel mit linearem Farbverlauf ausgefüllt.

' Pass in the opaque blue and opaque green as the third and fourth 
' argument, respectively.
Dim linGrBrush As New LinearGradientBrush( _
   New Point(0, 0), _
   New Point(200, 100), _
   Color.FromArgb(255, 0, 0, 255), _
   Color.FromArgb(255, 0, 255, 0)) 
      ' opaque blue
      ' opaque green
Dim pen As New Pen(linGrBrush, 10)

e.Graphics.DrawLine(pen, 0, 0, 600, 300)
e.Graphics.FillEllipse(linGrBrush, 10, 100, 200, 100)
[C#]
LinearGradientBrush linGrBrush = new LinearGradientBrush(
   new Point(0, 0),
   new Point(200, 100),
   Color.FromArgb(255, 0, 0, 255),   // opaque blue
   Color.FromArgb(255, 0, 255, 0));  // opaque green

Pen pen = new Pen(linGrBrush, 10);

e.Graphics.DrawLine(pen, 0, 0, 600, 300);
e.Graphics.FillEllipse(linGrBrush, 10, 100, 200, 100);

In der folgenden Abbildung sind die Linie und die Ellipse dargestellt. Die Farbe in der Ellipse wechselt graduell entlang einer beliebigen Linie, die parallel zu der Linie mit den Punkten (0, 0) und (200, 100) verläuft.