LinearGradientBrush Object
Paints an area with a linear gradient.
XAML | |
Scripting |
To create an object using scripting, see CreateFromXAML.
|
XAML Values
oneOrMoreGradientStops | One or more GradientStop object elements. Object elements defined here become members of the collection held by the GradientStops property, when accessed by scripting at runtime. |
Properties
ColorInterpolationMode, EndPoint, GradientStops, MappingMode, Name, Opacity, RelativeTransform, SpreadMethod, StartPoint, Transform
Methods
Equals, FindName, GetHost, GetValue, SetValue
Remarks
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 (0,0), the upper-left corner of the area being painted, and its EndPoint is (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.
Gradient axis for a diagonal linear gradient
The following illustration shows the same linear gradient, but with highlighted gradient stops.
Gradient stops in a linear gradient
Examples
The following example creates a linear gradient with four colors and uses it to paint a Rectangle.
XAML |
---|
<Canvas xmlns="https://schemas.microsoft.com/client/2007" xmlns:x="https://schemas.microsoft.com/winfx/2006/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> </Canvas> |
The following illustration shows the results of the preceding code, with the highlighted gradient stops.
Gradient stops in a linear gradient