Silverlight 4中的笔刷
介绍Silverlight 3、Silverlight 4 中的笔刷，及其使用方法和条件。
Silverlight中的的笔刷主要有SolidColorBrush、LinearGradientBrush、RadialGradientBrush、ImageBrush、VideoBrush、HtmlBrush。其中除HtmlBrush是Silverlight 4中新增的，其它都是Silverlight 3中就已经拥有的。
这里就以Visual Studio 2010为环境复习下Silverlight中旧的笔刷和4.0中新加的笔刷。
先放下综合实例的运行效果图：
Silvrelight 笔刷示例（浏览器中运行）
Silvrelight 笔刷示例（浏览器外运行）
SolidColorBrush（单色笔刷）
即只有一种颜色，这种笔刷的使用方法最简单，如下面的XAML：
<Ellipse Margin="20" x:Name="ellipse1" Stroke="Black" StrokeThickness="1" ToolTipService.ToolTip="单色笔刷">
<Ellipse.Fill>
<SolidColorBrush Color="Red"></SolidColorBrush>
</Ellipse.Fill>
</Ellipse>
效果如上面图中的红色椭圆。
LinearGradientBrush（线性渐变）
即在一直线上的渐变效果，可以通过StartPoint和EndPoint设置渐变方向（(0,0)为左上角，(1,1)为右下角）。还可以通过添加GradientStop子节点来设置过渡颜色。效如上图左下区域。XAML如下：
<Border Margin="20" Grid.Row="2" BorderBrush="Black" BorderThickness="1" ToolTipService.ToolTip="渐变笔刷">
<Border.Background>
<LinearGradientBrush>
<GradientStop Color="#FFFD0707"/>
<GradientStop Color="#FF040404" Offset="1"/>
<GradientStop Color="#FF1E4BB1" Offset="0.5"/>
</LinearGradientBrush>
</Border.Background>
</Border>
RadialGradientBrush（径向渐变）
说简单点就是放射状的渐变吧，和线性渐变的区别不是告别大。上面的示例XAML代码如下：
<controls:Calendar Margin="20" Grid.Column="1" Grid.Row="2" ToolTipService.ToolTip="渐变笔刷">
<controls:Calendar.Background>
<RadialGradientBrush>
<GradientStop Color="#FF0D8933"/>
<GradientStop Color="#FF4E4ECA" Offset="0.5"/>
<GradientStop Color="#FFA094B5" Offset="1"/>
</RadialGradientBrush>
</controls:Calendar.Background>
</controls:Calendar>
ImageBrush（图片笔刷）
示例中就是以一个图片笔刷作为Rectangle的Fill属性。XAML代码 如下：
<Rectangle Stroke="Black" StrokeThickness="1" Margin="20" Grid.Column="1" ToolTipService.ToolTip="图片笔刷" >
<Rectangle.Fill>
<ImageBrush ImageSource="Content/IMG_5607.jpg"/>
</Rectangle.Fill>
</Rectangle>
VideoBrush（视频笔刷）
视频笔刷必须借助MediaElement，其SourceName应该是一个MediaElement的Name。示例中，我放了一个MediaElement在资源中：
<UserControl.Resources>
<MediaElement x:Name="reVideo" AutoPlay="True" Source="Content/qfc.wmv" IsMuted="True" />
</UserControl.Resources>
下面就是把示例中的代码放出来：
<Ellipse Grid.Row="1" Margin="20" x:Name="ellipse2" Stroke="Black" StrokeThickness="1">
<Ellipse.Fill>
<VideoBrush SourceName="reVideo"/>
</Ellipse.Fill>
</Ellipse>
注意：刚接触SL的人可能会出现不显示视频的问题，那么请检查下MediaElement 是否正在播放或者并请AutoPlay设置为True，还有一种可能就是视频的编码问题，用Expression Encoder处理下就应该没问题了。
HtmlBrush（网页笔刷）
顾名思义就是以网页作为笔刷。他的使用和视频笔刷类似，需要一个承载网页的东西——WebBrowser，XAML如下：
<WebBrowser ToolTipService.ToolTip="WebBrowser" x:Name="reBrowser" Source="http://www.code84.com/u/matrixdom/Blog.aspx/t-254" AllowDrop="True" Grid.Column="2" Margin="0" Grid.Row="1"></WebBrowser>
下面就是HTMLBrush作为笔刷的心形路径：
<Path Stretch="Fill" Stroke="Black" Margin="10.833,24.08,11.167,10.5" UseLayoutRounding="True" Grid.Column="1" Grid.Row="1" Data="M200,256 C200,256 255.33333,230.66667 255.33333,191 C255.33333,151.33333 200,139.66667 200,200 C200.00017,137.33376 144.33333,152.33371 144.33301,192.00023 C144.66667,240.00011 200,256 200,256 z" MouseLeftButtonDown="Path_MouseLeftButtonDown" ToolTipService.ToolTip="HTML笔刷">
<Path.Fill>
<HtmlBrush x:Name="hbFill" SourceName="reBrowser" ></HtmlBrush>
</Path.Fill>
</Path>
要注意的是：WebBrowser 只能在浏览器外运行；HtmlBrush 不会自动重绘，所以默认情况下WebBrowse里的内容更新了HtmlBrush不会跟着变化，要作一点小小的处理，我的方法如下：
CompositionTarget.Rendering += (ctrSender, ctre) =>
{
if (App.Current.IsRunningOutOfBrowser)
hbFill.Redraw();
};
好了，基本使用方法和要注意的情况就这些。想了解更详细点，可以下载附件中的工程源码。
