使用渐变绘制区域
渐变画笔使用沿一条轴彼此混合的多种颜色绘制区域。可以使用它们来形成光和影的效果，使 UI 元素具有三维外观。还可以使用它们来模拟玻璃、镶边、水和其他光滑表面。Silverlight 提供两种类型的渐变画笔：LinearGradientBrush 和 RadialGradientBrush。
LinearGradientBrush 使用沿一条直线（即"渐变轴"）定义的渐变来绘制区域。可以使用 GradientStop 对象指定渐变的颜色及其在渐变轴上的位置。还可以修改渐变轴，这样能够创建水平和垂直渐变并反转渐变方向。默认情况下创建对角线渐变。
<StackPanel>
<!-- 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>
</StackPanel>
<!-- 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>
</StackPanel>
GradientStop 是渐变画笔的基本构造块。渐变停止点指定渐变轴上 Offset 处的 Color
与 LinearGradientBrush 类似，RadialGradientBrush 用沿一条轴混合在一起的颜色绘制区域。径向渐变画笔的轴由一个圆圈定义；其颜色从圆圈的原点向外辐射。
<StackPanel>
<!-- This rectangle is painted with a radial gradient. -->
<Rectangle Width="200" Height="100">
<Rectangle.Fill>
<RadialGradientBrush GradientOrigin="0.5,0.5" Center="0.5,0.5"
RadiusX="0.5" RadiusY="0.5">
<GradientStop Color="Yellow" Offset="0" />
<GradientStop Color="Red" Offset="0.25" />
<GradientStop Color="Blue" Offset="0.75" />
<GradientStop Color="LimeGreen" Offset="1" />
</RadialGradientBrush>
</Rectangle.Fill>
</Rectangle>
</StackPanel>
<!-- This rectangle is painted with a radial gradient. -->
<Rectangle Width="200" Height="100">
<Rectangle.Fill>
<RadialGradientBrush GradientOrigin="0.5,0.5" Center="0.5,0.5"
RadiusX="0.5" RadiusY="0.5">
<GradientStop Color="Yellow" Offset="0" />
<GradientStop Color="Red" Offset="0.25" />
<GradientStop Color="Blue" Offset="0.75" />
<GradientStop Color="LimeGreen" Offset="1" />
</RadialGradientBrush>
</Rectangle.Fill>
</Rectangle>
</StackPanel>
ImageBrush 类支持您将图像用作填充、背景和轮廓。ImageBrush 使用由 ImageSource 属性指定的 JPEG 或 PNG 图像来绘制区域。使用要加载的图像的路径来设置 ImageSource 属性。
<Grid x:Name="LayoutRoot">
<Grid.Background>
<ImageBrush ImageSource="Forest.jpg" />
</Grid.Background>
</Grid>
<Grid.Background>
<ImageBrush ImageSource="Forest.jpg" />
</Grid.Background>
</Grid>
VideoBrush 类支持您使用视频绘制某个区域。以下示例使用 VideoBrush 绘制 TextBlock 的 Foreground。
<Grid x:Name="LayoutRoot" Background="White">
<MediaElement
x:Name="butterflyMediaElement"
Source="Butterfly.wmv" IsMuted="True"
Opacity="0.0" IsHitTestVisible="False" />
<TextBlock Canvas.Left="5" Canvas.Top="30"
FontFamily="Verdana" FontSize="120"
FontWeight="Bold" TextWrapping="Wrap"
Text="Video">
<!-- Paint the text with video. -->
<TextBlock.Foreground>
<VideoBrush SourceName="butterflyMediaElement" Stretch="UniformToFill" />
</TextBlock.Foreground>
</TextBlock>
</Grid>
<MediaElement
x:Name="butterflyMediaElement"
Source="Butterfly.wmv" IsMuted="True"
Opacity="0.0" IsHitTestVisible="False" />
<TextBlock Canvas.Left="5" Canvas.Top="30"
FontFamily="Verdana" FontSize="120"
FontWeight="Bold" TextWrapping="Wrap"
Text="Video">
<!-- Paint the text with video. -->
<TextBlock.Foreground>
<VideoBrush SourceName="butterflyMediaElement" Stretch="UniformToFill" />
</TextBlock.Foreground>
</TextBlock>
</Grid>
