Silverlight 2.0 beta 2.0 之 blend 2.5 (7) Brush 全面接触

画笔类型：
SolidColorBrush: 纯色画笔
LinearGradientBrush: 线性渐变画笔
RadialGradientBrush: 径向渐变画笔
ImageBrush: 图像画笔
VideoBrush: 视频画笔



1\SolidColorBrush
SolidColorBrush单一颜色填充， 在使用SolidColorBrush时只要指定Fill属性的Color值就可以了，除此之外，还可以选择指定A(Alpha)属性来调节它的透明度。

2\LinearGradientBrush
LinearGradientBrush将会使用线性渐变来进行填充，标注5区域可以添加渐变的颜色,和拖动位置以示该色块在此元素中所显示的大小.
我们打开XAML看一下：StartPoint属性表渐变起始点坐标(相当于标注4的箭尾)和EndPoint属性表渐变结束点坐标(相当于标注4的箭头位置)，这两点的坐标最大值为1，最小值为0.用GradientStop则是用来设置不同的颜色渐变以及它的偏移量。

看到4所标注的箭头了吗?按住箭尾拖动就来改变渐变色的方向

<Rectangle Height="97.575" HorizontalAlignment="Stretch" Margin="229,154.574996948242,294,227.850006103516" VerticalAlignment="Stretch" Stroke="#FF000000" d:LayoutOverrides="Height" RadiusY="9" RadiusX="9" Stretch="Fill">
            <Rectangle.Fill>
                <LinearGradientBrush StartPoint="0.103000000119209,0.10700000077486" EndPoint="0.949000000953674,0.947000026702881" >
                    <GradientStop Color="#FFF902FF" Offset="0"/>
                    <GradientStop Color="#FFFFF614" Offset="1"/>
                </LinearGradientBrush>
            </Rectangle.Fill>
        </Rectangle>

Xaml 和设计界面详细标注


3\RadialGradientBrush
RadialGradientBrush使用放射性渐变来进行颜色填充，用GradientOrigin来指定放射源的位置坐标，同样使用GradientStop指定不同颜色的渐变及偏移量

<Rectangle Height="97.575" HorizontalAlignment="Stretch" Margin="229,0,294,129.274993896484" VerticalAlignment="Bottom" Stroke="#FF000000" d:LayoutOverrides="Height" RadiusY="11" RadiusX="5">
            <Rectangle.Fill>
                <RadialGradientBrush GradientOrigin="0.5,0.5">
                    <GradientStop Color="#FFF902FF" Offset="0.022"/>
                    <GradientStop Color="#FFFFF500" Offset="1"/>
                </RadialGradientBrush>
            </Rectangle.Fill>
        </Rectangle>

ImageBrush

如何制作图片笔刷的资源?
先在工作区插入一张image ,选中该图片在Tools/Make Brush Resource/Make ImageBrush Resourse..

<UserControl.Resources>
        <ImageBrush x:Key="ImageBrush1" ImageSource="20082151856574670.jpg"/>
    </UserControl.Resources>

border边框也可以填充笔刷资源

<Border Height="114" HorizontalAlignment="Stretch" Margin="255.332992553711,25,210,0" VerticalAlignment="Top" BorderThickness="10,10,10,10" BorderBrush="{StaticResource ImageBrush1}"/>

运行:



ImageBrush     Stretch设置填充模式：
None:不随输出的区域而拉伸画笔
Fill:完全填充输出区域,图像可能被扭曲.
Uniform:等比放大或缩小以能最大填充输出区域.
Uniformtofill:等比缩放画笔,使其完全填充输出区域,多余部分裁除(注:多余部分只是你看不到了,但一样可以激发事件,所以有的时候会比较头疼)


VideoBrush
使用MediaElement控件绘制一个视频区域。同ImageBrush一样它也有Stretch属性。