WPF学习 第十二章2 画刷

2. 画刷

2.1有哪些画刷

名称	说明
SolidColorBrush	单色画刷
LinearGradientBrush	渐变画刷
RadialGradientBrush	散射渐变画刷
ImageBrush	图片画刷
DrawingBrush	绘图画刷
VisualBrush	虚拟画刷
BitmapCacheBrush	缓冲画刷

2.2 SolidColorBrush

下面三种方法都可以创建画刷：

SolidColorBrush brush1 = newSolidColorBrush(Colors.Blue);

SolidColorBrush brush2 =SystemColors.ControlLightBrush;

SolidColorBrush brush3 = newSolidColorBrush(Color.FromRgb(255,0,0));

2.3 LinearGradientBrush

2.3.1 常用属性说明

GradientStop：设置渐变颜色Color和拐点Offset

StartPoint 和EndPoint：设置相对起始点和结束点（值范围是0-1）

SpreadMethod：设置平铺模式

2.3.2 GradientStop

1.默认渐变是从左上角到右下角，定义两个GradientStop，一个Offset=0，另一个Offset=1则表示从左上角(0,0)到右下角。

 


<Rectangle Canvas.Top="30"Canvas.Left="30" Width="200" Height="150"Stroke="Black">

           <Rectangle.Fill>

                <LinearGradientBrush>

                    <GradientStopColor="Red" Offset="0"></GradientStop>

                    <GradientStopColor="White" Offset="1"></GradientStop>

               </LinearGradientBrush>

           </Rectangle.Fill>

       </Rectangle>

2.如果设置第二个Offset为0.5则渐变范围是左上角到中间，后面则保持第二种颜色。



<LinearGradientBrush>

<GradientStopColor="Red" Offset="0"></GradientStop>

<GradientStop Color="White" Offset="0.5"></GradientStop>

</LinearGradientBrush>

2.可以添加多个GradientStop实现多个颜色的渐变。



<LinearGradientBrush>

<GradientStopColor="Red" Offset="0"></GradientStop>

<GradientStopColor="Yellow" Offset="0.3"></GradientStop>

<GradientStopColor="Blue" Offset="0.6"></GradientStop>

<GradientStopColor="White" Offset="1"></GradientStop>

</LinearGradientBrush>

2.3.3 StartPoint 和EndPoint

1.纵向渐变和横向渐变



<LinearGradientBrushStartPoint="0,0" EndPoint="0,1">

<GradientStop Color="Red"Offset="0"></GradientStop>

<GradientStop Color="White"Offset="1"></GradientStop>

</LinearGradientBrush>



<LinearGradientBrushStartPoint="0,0" EndPoint="1,0">

<GradientStop Color="Red"Offset="0"></GradientStop>

<GradientStop Color="White"Offset="1"></GradientStop>

</LinearGradientBrush>

2.EndPoint和Offset的值都会影响最终的显示



<LinearGradientBrushStartPoint="0,0" EndPoint="0.5,0">

<GradientStop Color="Red"Offset="0"></GradientStop>

<GradientStop Color="White" Offset="0.5"></GradientStop>

</LinearGradientBrush>

2.3.4 SpreadMethod

1. 反转



<LinearGradientBrushStartPoint="0,0" EndPoint="0.5,0"SpreadMethod="Reflect">

 <GradientStop Color="Red"Offset="0"></GradientStop>

<GradientStopColor="White" Offset="1"></GradientStop>

</LinearGradientBrush>

2. 重复



<LinearGradientBrushStartPoint="0,0" EndPoint="0.5,0"SpreadMethod="Repeat">

 <GradientStop Color="Red"Offset="0"></GradientStop>

<GradientStopColor="White" Offset="1"></GradientStop>

</LinearGradientBrush>

2.3.5 可以填充任何需要画刷的地方

2.4 RadialGradientBrush

2.4.1 常用属性说明

GradientStop：设置渐变颜色Color和拐点Offset

Center、RadiusX和RadiusY：定义椭圆渐变区域

GradientOrigin：在椭圆渐变区域里的渐变坐标原点

SpreadMethod：设置平铺模式，椭圆渐变区域外的平铺模式。

2.4.2 GradientStop

<Rectangle Canvas.Top="25"Canvas.Left="25" Width="200" Height="150"Stroke="Black" >

           <Rectangle.Fill>

                <RadialGradientBrush>

                    <GradientStopColor="Red" Offset="0"></GradientStop>

                    <GradientStopColor="Yellow" Offset="1"></GradientStop>

                </RadialGradientBrush>

           </Rectangle.Fill>

       </Rectangle>

2.4.3 Center、RadiusX、 RadiusY和 GradientOrigin



左上：Center=0.5,0.5 RadiusX=0.4 RadiusY=0.4 GradientOrigin=0.5,0.5

右上：Center=0.7,0.5 RadiusX=0.4 RadiusY=0.4 GradientOrigin=0.7,0.5

左下：Center=0.5,0.5 RadiusX=0.7 RadiusY=0.7 GradientOrigin=0.5,0.5

右下：Center=0.5,0.5 RadiusX=0.7 RadiusY=0.7 GradientOrigin=0.2,0.2

2.5 ImageBrush

2.5.1 使用图片画刷

<Rectangle Canvas.Top="55"Canvas.Left="25" Width="200" Height="82.553"Stroke="Black" >

           <Rectangle.Fill>

                <ImageBrushImageSource="Koala.jpg"></ImageBrush>

           </Rectangle.Fill>

       </Rectangle>

2.5.2 使用Stretch改变填充方式

 

2.5.3 使用Viewbox剪取显示图片的一部分

2.5.4 使用TileMode平铺图片

2.6 VisualBrush

相当于一面复制图片的镜子。



<StackPanelName="stackpanel1">

           <Button Name="button1" Canvas.Top="10"Canvas.Left="50">Button1</Button>

           <TextBox>TextBox1</TextBox>

       </StackPanel>

       <Rectangle Canvas.Top="55" Canvas.Left="25"Width="200" Height="82.553" Stroke="Black" >

           <Rectangle.Fill>

                <VisualBrushVisual="{Binding ElementName=stackpanel1}"></VisualBrush>

           </Rectangle.Fill>

       </Rectangle>