【LinearGradientBrush】线性渐变笔刷

本示例演示如何使用 LinearGradientBrush 类来绘制带有线性渐变的区域。在下面的示例中，Rectangle 的Fill 是用从黄色依次过渡到红色、蓝色和浅绿色的对角线性渐变来绘制的。

XAML

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

C#

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; 

下图显示了上一示例创建的渐变。

若要创建水平线性渐变，请将 LinearGradientBrush 的 StartPoint 和 EndPoint 分别改为 (0,0.5) 和 (1,0.5)。在下面的示例中，Rectangle 是用水平线性渐变来绘制的。

XAML

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

C#

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;   

下图显示了上一示例创建的渐变。

若要创建垂直线性渐变，请将 LinearGradientBrush 的 StartPoint 和 EndPoint 分别改为 (0.5,0) 和 (0.5,1)。在下面的示例中，Rectangle 是用垂直线性渐变来绘制的。

XAML

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

C#

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;   

下图显示了上一示例创建的渐变。

说明：

此主题中的示例使用默认坐标系来设置起点和终点。默认坐标系是相对于边界框的：0 表示边界框的 0%，1 表示边界框的 100%。可以通过将 MappingMode 属性设置为值 BrushMappingMode..::.Absolute 来更改此坐标系。绝对坐标系不是相对于边界框的。值直接在本地坐标系中解释。

有关更多示例，请参见 Brush 示例。有关渐变以及其他类型的画笔的更多信息，请参见使用纯色和渐变进行绘制概述。

更多代码

如何：使用径向渐变绘制区域

本示例演示如何使用 RadialGradientBrush 类来绘制带有径向渐变的区域。