zoukankan      html  css  js  c++  java
  • 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

  • 相关阅读:
    flex布局
    input框不能输入问题
    JS的innerHTML完成注册表
    CSS的z-index属性和box-shadow属性
    JS个人笔记
    css照片墙
    透明度设置
    a标签的name属性
    iframe标签
    title属性
  • 原文地址:https://www.cnblogs.com/qixingduanyan/p/4421727.html
Copyright © 2011-2022 走看看