Nasıl yapılır: Doğrusal Gradyan ile bir Alanı Boyama

Bu örnekte, doğrusal gradyan ile bir alanı boyamak için sınıfın LinearGradientBrush nasıl kullanılacağı gösterilmektedir. Aşağıdaki örnekte, Fill bir Rectangle öğesinin rengi sarıdan kırmızıya maviden kireç yeşiline geçiş yapan çapraz doğrusal gradyan ile boyandı.

Örnek

<!-- 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;

Aşağıdaki çizimde, önceki örnek tarafından oluşturulan gradyan gösterilmektedir.

Yatay doğrusal gradyan oluşturmak için ve EndPoint öğesini LinearGradientBrush (0,0,5) ve (1,0,5) olarak değiştirinStartPoint. Aşağıdaki örnekte, yatay doğrusal gradyan ile bir Rectangle boyanmış.

<!-- 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;

Aşağıdaki çizimde, önceki örnek tarafından oluşturulan gradyan gösterilmektedir.

Dikey doğrusal gradyan oluşturmak için ve EndPoint öğesini LinearGradientBrush (0,5,0) ve (0,5,1) olarak değiştirinStartPoint. Aşağıdaki örnekte, dikey Rectangle doğrusal gradyan ile bir boyanmış.

<!-- 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;

Aşağıdaki çizimde, önceki örnek tarafından oluşturulan gradyan gösterilmektedir.

Dekont

Bu konudaki örneklerde başlangıç noktalarını ve bitiş noktalarını ayarlamak için varsayılan koordinat sistemi kullanılır. Varsayılan koordinat sistemi sınırlayıcı kutuya göredir: 0 sınırlayıcı kutunun yüzde 0'ını, 1 ise sınırlayıcı kutunun yüzde 100'unu gösterir. özelliğini değerine BrushMappingMode.Absoluteayarlayarak MappingMode bu koordinat sistemini değiştirebilirsiniz. Mutlak koordinat sistemi sınırlayıcı kutuya göre değildir. Değerler doğrudan yerel alanda yorumlanır.

Ek örnekler için bkz . Fırça örneği. Gradyanlar ve diğer fırça türleri hakkında daha fazla bilgi için bkz . Düz Renkler ve Gradyanlar ile Boyamaya Genel Bakış.