WPF样式之画刷结合样式
第一种画刷,渐变画刷GradientBrush
(拿线性渐变画刷LinearGradientBrush(其实它涵盖在GradientBrush画刷内。现在拿他来说事。),还有一个圆心渐变画刷RadialgradientBrush,两者用法相同):
我想象中的button的总体样式大体结构应该如下:
<Style TargetType="Button">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border x:Name="border">
<ContentPresenter/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
那么看看这样的button到底是什么样子:
<Button Height="50" Width="150" Content="Button"/>
窗体的背景是灰色,button显示如下:
可见,现在button的样式是只显示出里面content的内容,之前的那些特效全部消失。那么就看我们能不能给button样式补充画刷,让他慢慢的改变形状。
其中,border的background引用的是如下的一个画刷:
这个画刷应该算是最简单的一个了,从上到下,用白色渐变到稍微有点的灰色。看看button的现在呈现,结果出现异常:
看起来,似乎是由于静态引用导致的,现在将其改为动态的,修改样式background为:
Background="{DynamicResource NormalBrush}"
运行通过,button表现如下:
虽然button表达出来了我们定义的画刷,看起来,也似乎是像点样子了,但是button的content竟然在左上角,ok修改样式展现层代码如下:
<ContentPresenter Margin="2" HorizontalAlignment="Center" VerticalAlignment="Center" RecognizesAccessKey="True"/>
看到最后这个RecognizesAccessKey属性,我查了下msdn,上面是这样说的,获取或设置一个值 ContentPresenter 是否处于其样式应当使用 AccessText 。事实上,说实话,我也没怎么看懂。后来看了AccessText才知道,是对应用下划线起作用的,大概说明如下:
如果内容有多个下划线字符,因此,只有第一个转换为 AccessKey;其他下划线显示为常规文本。 如果要转换为访问键的下划线不是第一个下划线,对于前面一个要转换的所有下划线请使用两个连续的下划线。 例如,下面的代码包含一个访问键和显示作为的 _HelloWorld:
上面也是msdn的内容。
这次button的content显示已经变得正常了,显示在了中央:
好的,接下来,我们还要对这个button应用一些其他的画刷,首先,我们内容是被一个border包围的,那么我们就看看这个border的borderbrush。更改style,添加一个borderbrush,在border的属性里面加如下一句:
BorderBrush="Red",显现出来的效果如下:
Soga,看到这,就明白这borderbrush是干什么的了,下面定义一个borderbrush如下:
这依旧是个线性画刷,从上到下,由浅灰色过渡到浅黑色,引用:BorderBrush="{DynamicResource NormalBorderBrush}"
看效果吧:
看了上面,说一下线性画刷:
其中线性画刷有两个必要的属性:
StartPoint="0,0"EndPoint="1,1"分别表示开始画的点,和结束画的点,左上角的点为0,0,右下角的点为1,1.两个点的连线表示画刷画的方向。
如果上面的button从0,0画到0,1,表示依靠Y轴从上到下画线。
下面说说GradientStop的Offset属性,这表示画刷画线方向的偏移。上面画button我们只从上到下,渐变颜色。如果我们渐变的颜色不一样,就可以有好几个offset:例如修改代码如下:
则button的表现如下(从浅白画一半到红,然后再从红画到浅黑。):
这样一来,我们也就大概了解了这第一种画刷的用法。
注意(MSDN):如果想要从水平渐变,则可以设置如下:若要创建水平线性渐变,请将 LinearGradientBrush 的 StartPoint 和 EndPoint 分别改为 (0,0.5) 和 (1,0.5)。
如果想要从垂直渐变:若要创建垂直线性渐变,请将 LinearGradientBrush 的 StartPoint 和 EndPoint 分别改为 (0.5,0) 和 (0.5,1)。
第二种画刷,实心画刷,也叫固体画刷。SolidColorBrush
这第二种画刷应该来说比较简单,直接上代码:
<SolidColorBrush x:Key="DisabledForegroundBrush" Color="Red" />
在上面的button里面用,改写button的Style如下:
button的表现如下:
可见,前景色发生了变化。这大概就是实心画刷的用法了。
第三种画刷,就是所说的TileBrush了
不过,我们只拿ImageBrush来说事。(除此之外,还有Drawing画刷和VisualBrush)
在上述style的基础上增加代码:
<ImageBrush x:Key="ButtonImageBrush" ImageSource="btnImage.png"/>
在Style里面引用:
button的表现,如下:
至此,画刷的一些简单的用法也就说完了。都是一些简单的引用。下面贴出来一线码农大神的画刷结构图:
如果想要知道更多关于画刷的知识,一线码农也可以帮助到您,一线文章索引:http://www.cnblogs.com/huangxincheng/archive/2012/07/14/2591941.html