A LinearGradientBrush paints an area with a linear gradient. A linear gradient defines a gradient along a line. The line's end points are defined by the StartPoint and EndPoint properties of the linear gradient. A LinearGradientBrush brush paints its GradientStops along this line.

The default linear gradient is diagonal. In the default, the StartPoint of a linear gradient is a Point with value 0,0, the upper-left corner of the area being painted, and its EndPoint is a Point with value 1,1, the lower-right corner of the area being painted. The colors in the resulting gradient are interpolated along the diagonal path.

The following illustration shows a diagonal gradient. A line was added to highlight the interpolation path of the gradient from the start point to the end point.

The next illustration shows the same linear gradient, but with highlighted gradient stops.

It is possible to specify a gradient axis that does not completely fill area being painted. When this occurs, the SpreadMethod property determines how the remaining area is painted.

The following example creates a linear gradient with four colors and uses it to paint a Rectangle.

<StackPanel>
  <!-- This rectangle is painted with a vertical linear 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>
</StackPanel>

The following illustration shows the resulting gradient. The gradient axis is marked with a dashed line, and the gradient stops are marked with circles.

For a list of the operating systems and browsers that are supported by Silverlight, see Supported Operating Systems and Browsers.

Reference

Other Resources