图片 3

还没到家,WPF样式和行为

Wtf(暂时命名,随便起的 =
_=),模仿WPF的框架,还没有完善,只有简单的基础元素,支持数据绑定。虽然支持mono但是mono有bug

先创建一套样式描述细节,然后仅靠设置Style属性应用样式。

      
前面简单的说到了wpf中几种样式的用法,wpf有着类似web中的CSS一样,为界面上的元素定制外观,以提供更好的用户界面,这种灵活性也是winForm所不能及的,从前面讲到的可以知道在WPF应用程序中,通过控件的属性,我们也可以实现更改控件的外观。但是,这种方式局限性大、不灵活且不利于维护,比如一个,二个按钮的样式可以这样,如果有二十,三十个,甚至更多,难道也这样吗,显然这不是很好的选择,如果我们将上述控件的属性归纳起来,写到一段样式中,为按钮指定该样式(甚至用元素类型样式时,都不需要指定按钮样式),所有按钮就具有统一样式和外观了。如果想修改按钮外观,我们只需要改一下样式代码即可,所有按钮外观都会随之变化。

写这个只是兴趣爱好,感觉也没多大意义了,如果这个UI框架完善了,有多少人愿意用?毕竟Windows上有WPF,而且C#跨平台需求也不多啊。我对WPF也不算熟悉,要完善的话,还有很多要写。一大堆常用控件和设计器。不过我不用XML来描述,而是直接用C#来定义,设计器直接生成C#代码,因为我觉得,如果有强大的设计器,写XML就是多余的,而且解析XML还影响性能,对于WPF,我觉得Xaml太啰嗦了。

行为封装一些基本的UI功能,然后用一两行标记附加到元素上,实现功能。

样式的使用有多种方法,如内联样式(定义在元素内部)、已命名样式(为样式命名,使用时通过名称引用)、元素类型样式(为一种类型的元素,指定一种样式)等等。

 

样式基础

样式是一种重要的资源。

样式是属性值的集合,能被应用到一个元素。就像CSS,WPF样式允许你定义格式化特性并且遍及应用程序地应用它们去确保一致性。就像CSS,WPF样式可以级联通过元素树自动地应用到指定的元素类型的目标。而且,WPF样式更强力,因为他们可以设置任何依赖属性。那意味着你可以使用它们标准化格式化以外的特性,诸如控制控件的行为属性。WPF样式也支持触发器,这允许你当另一个属性被改变时改变控件的样式,并且他们可以使用模板去重定义控件的内建外观。

属性值继承,是依赖属性的特征之一。当你在窗口水平设置属性时,窗口内部所有的元素将获得相同的值,除非显式地覆盖他们。

考虑下面代码:

<Window.Resources>
  <Style x:Key="BigFontButtonStyle">
    <Setter Property="Control.FontFamily" Value="Times New Roman" />
    <Setter Property="Control.FontSize" Value="18" />
    <Setter Property="Control.FontWeight" Value="Bold" />
  </Style>    
</Window.Resources>

这段标记创造单个资源:一个System.Windows.Style对象。样式对象持有一个设置器集合,带有三设置器对象,每个设置器设置一个属性。每个设置器对象指出要设置属性的名字。和该属性的值。如同所有的资源,样式对象有一个用于检索资源的关键字。在本例中,关键字是BigFontButtonStyle。(按照约定,样式关键字的结尾是Style。)

每个WPF元素只能使用一个样式(或可以不使用样式)。一个元素通过Style属性应用样式。例如,为配置一个按钮使用你先前创造的样式,按钮像这样应用样式资源:

<Button Padding="5" Margin="5" Name="cmd"
 Style="{StaticResource BigFontButtonStyle}"> 
  A Customized Button
</Button>

当然,可以使用代码指定样式。方法是用FindResource()方法:

cmd.Style = (Style)cmd.FindResource("BigFontButtonStyle");

Style类一共有5个重要的属性:

属性 描述
Setters Setter或EventSetter对象的集合。用于自动地设置属性值和附着事件处理器。
Triggers TriggerBase对象的集合,并且允许你自动地改变样式设置。例如,当另一个属性改变时或当一个事件发生时,你能修改一个样式。
Resources 你希望用于样式的资源集合。例如,有时需要用一个对象设置多个属性。在那种情况下,更有效的是创造对象作为一个资源,然后在你的设置器对象中使用那资源,而不是在每个设置器中,使用嵌套标签创造对象。
BasedOn 一个属性,允许你创造一个更特殊的样式。此样式继承(和可选地覆盖)另一个样式的设置。
TargetType 一个属性,识别样式所作用于的元素类型。此属性允许你创造仅影响某些元素的设置器,它允许你创造对于匹配的元素类型自动生效的设置器。

一、内联样式

WtfObject 
相当于WPF里的DependencyObject依赖对象。继承该类的对象,所有属性默认都是依赖属性

创建一个样式对象

你能创建各种水平的资源集合,窗口的,容器的,或者应用程序的。

实际上,你可以直接设置控件的样式:

<Button>
  <Button.Style>
    <Style>
      <Setter Property="Control.FontFamily" Value="Times New Roman" />
      <Setter Property="Control.FontSize" Value="18" />
      <Setter Property="Control.FontWeight" Value="Bold" />
    </Style>
  </Button.Style>
  <Button.Content>A Customized Button</Button.Content>
</Button>

比如下面的为textBox加样式

属性写法:

设置属性

如你所见,每个Style对象包裹一个Setter对象的集合。每个Setter对象设置一个元素的一个属性。唯一限制是一个设置器只能改变一个依赖属性—不能修改其他属性。

在一些情况下,你不能使用一个简单的字符串设置属性值。例如,不能使用一个简单字符串创造一个ImageBrush对象。在这种情况下,你能用一个嵌套元素设置属性。这是一个例子:

<Style x:Key="HappyTiledElementStyle">
  <Setter Property="Control.Background">
    <Setter.Value>
      <ImageBrush TileMode="Tile"
        ViewportUnits="Absolute" Viewport="0 0 32 32"
        ImageSource="happyface.jpg" Opacity="0.3">
      </ImageBrush>
    </Setter.Value>
  </Setter>
</Style>

 

为识别你希望设置的属性,你需要提供一个类和一个属性的名字。但是,类名字不需要是定义属性的类。它也能是该类的一个派生类。例如,考虑下面BigFontButton样式的版本,Button类的引用代替Control类的引用:

<Style x:Key="BigFontButtonStyle">
  <Setter Property="Button.FontFamily" Value="Times New Roman" />
  <Setter Property="Button.FontSize" Value="18" />
  <Setter Property="Button.FontWeight" Value="Bold" />
</Style>

区别是派生类缩小了样式应用的范围。例如,这个样式可以影响Button控件,但是不能影响Label控件。对于使用Control类的前面的例子,这个样式即可以影响Button控件,也可以影响Label控件。

WPF忽略无法被应用的属性。

如果样式中的所有属性都应用到同类型的元素,可以设置TargetType属性,指出属性应用的类:

<Style x:Key="BigFontButtonStyle" TargetType="Button">
  <Setter Property="FontFamily" Value="Times New Roman" />
  <Setter Property="FontSize" Value="18" />
  <Setter Property="FontWeight" Value="Bold" />
</Style>

可以看见,所有设置器的Property属性内没有指明类名。

<TextBox Text="内容">
            <TextBox.Style>
                <Style>
                    <Setter Property="TextBox.FontSize" Value="16"></Setter>
                    <Setter Property="TextBox.Width" Value="80"></Setter>
                    <Setter Property="TextBox.Height" Value="40"></Setter>

                </Style>
            </TextBox.Style>
        </TextBox>

 

附加事件处理器

<Style x:Key="MouseOverHighlightStyle">
  <EventSetter Event="TextBlock.MouseEnter" Handler="element_MouseEnter" />
  <EventSetter Event="TextBlock.MouseLeave" Handler="element_MouseLeave" />
  <Setter Property="TextBlock.Padding" Value="5"/>
</Style>

样式可以直接嵌套Setter元素和EventSetter元素。

这是事件处理的代码:

private void element_MouseEnter(object sender, MouseEventArgs e)
{
    ((TextBlock)sender).Background =
      new SolidColorBrush(Colors.LightGoldenrodYellow);
}

private void element_MouseLeave(object sender, MouseEventArgs e)
{
    ((TextBlock)sender).Background = null;
}

鼠标进入和鼠标离开都是直接事件路由。

应用样式:

<TextBlock Style="{StaticResource MouseOverHighlightStyle}">
 Hover over me.
</TextBlock>

这个功能也可以用事件触发器实现。

对于冒泡事件,最好直接在容器元素中连接事件处理函数。

就是说,我们可以通过在元素内部通过拓展属性Style来定义样式。但是缺点也是显而易见的,如果有多个这样的控件指向同一个样式,该怎么办呢,只能每个都要写,所以很不好,所以我们可以在资源中定义一个样式,然后让多个控件调用这一个样式即可

        /// <summary>
        /// 绑定的数据上下文
        /// </summary>
        [UIPropertyMetadata(null, true)]
        public virtual object DataContext
        {
            get { return GetValue<object>(); }
            set { SetValue(value); }
        }

多层样式

使用属性值继承特征的属性包括IsEnabled,IsVisible,Foreground,以及所有字体属性。

基于之前的样式建立一个新样式,使用BasedOn属性:

<Window.Resources>
  <Style x:Key="BigFontButtonStyle">
    <Setter Property="Control.FontFamily" Value="Times New Roman" />
    <Setter Property="Control.FontSize" Value="18" />
    <Setter Property="Control.FontWeight" Value="Bold" />
  </Style>

  <Style x:Key="EmphasizedBigFontButtonStyle"
    BasedOn="{StaticResource BigFontButtonStyle}">
    <Setter Property="Control.Foreground" Value="White" />
    <Setter Property="Control.Background" Value="DarkBlue" />
  </Style>
</Window.Resources>

 

除非两个样式有语义上的联系,否则不要应用BasedOn属性使他们相关联。

二、已命名样式

 

自动应用样式到类型

样式资源可以自动应用到指定类型的元素。只需要设置TargetType属性指定目标类型,并且完全省略关键字。这时,实际上隐式使用了类型标记扩展:

x:Key="{x:Type Button}"

这是自动应用按钮样式的例子:

<Window.Resources>
  <Style TargetType="Button">
    <Setter Property="FontFamily" Value="Times New Roman" />
    <Setter Property="FontSize" Value="18" />
    <Setter Property="FontWeight" Value="Bold" />
  </Style>
</Window.Resources>

<StackPanel Margin="5">
  <Button Padding="5" Margin="5">Customized Button</Button>
  <TextBlock Margin="5">Normal Content.</TextBlock>
  <Button Padding="5" Margin="5" Style="{x:Null}">A Normal Button</Button>
  <TextBlock Margin="5">More normal Content.</TextBlock>
  <Button Padding="5" Margin="5">Another Customized Button</Button>
</StackPanel>

中间的按钮显式删除了样式。不用提供新样式,只需要设置Style属性为空。

 将相同的内敛样式归纳起来,放入资源中,构成一个样式,并为它起一个名字。这样,就可以通过名字为元素指定该样式。

属性上的特性可以是 PropertyMetadata或者UIPropertyMetadata
中的一个,默认值可以通过这两个特性来设置。如果不加这两个特性,那默认值就是null或者0

触发器

使用触发器,你能自动化简单的样式改变。

触发器通过Style.Triggers集合链接到样式。每个样式能有无数个触发器,并且每个触发器是System.Windows.TriggerBase派生类的一个实例。

名字 描述
Trigger 观察依赖属性一个改变,然后使用一个设置器改变样式。
MultiTrigger 这类似于触发器,但是结合多重的条件。触发器生效之前,所有条件必须被满足。
DataTrigger 触发器与数据绑定一起工作。它类似于触发器,除了它监视绑定数据的改变。
MultiDataTrigger 这结合多个数据触发器。
EventTrigger 事件发生时,触发一个动画。
  <Window.Resources>
        <Style x:Key="buttonStyle">
            <Setter Property="Foreground" Value="#999999"/>
        </Style>

    </Window.Resources>

如果是复杂属性类型默认值,可以通过重写 OnOverrideMetadata 来设置

简单触发器

你能附加简单触发器到任何依赖属性。例如,你能响应Control类的IsFocused,IsMouseOver,和IsPressed属性改变,创造鼠标悬停和焦点效果。

每个简单触发器标识你监视的属性,以及你期望的值。当这值发生,你存储在Trigger.Setters集合中的设置器被应用。(不幸地,不能使用更世故的触发器逻辑,比较一个值落在一个范围内,执行一个计算,等等。在这些情况下,你应转而使用一个事件处理器。)

这里是一个触发器,当按钮获得键盘焦点时,背景变为暗红色:

<Style x:Key="BigFontButton">
  <Style.Setters>
    <Setter Property="Control.FontFamily" Value="Times New Roman" />
    <Setter Property="Control.FontSize" Value="18" />
  </Style.Setters>

  <Style.Triggers>
    <Trigger Property="Control.IsFocused" Value="True">
      <Setter Property="Control.Foreground" Value="DarkRed" />
    </Trigger>
  </Style.Triggers>
</Style>    

不需要写逻辑反转触发器。触发器停止应用,元素就恢复它的正常的外观。

触发器没有修改依赖属性的原始值。原始值可能是本地值,也可能是样式值。触发器一失活,触发之前的值就再次可用。

触发器集合可以包括多个触发器。如果,一个以上的触发器修改同一个属性,位于列表最后的触发器赢。

它不关心哪一个触发器先发生。例如,WPF不关心在你点击按钮之前一个按钮是否获得焦点。触发器被排列在你标记中的位置是它唯一关心的事。

MultiTrigger提供一个条件集合,让你定义一系列的属性和值的结合。只有所有的条件都是真,触发器开启:

<Style x:Key="BigFontButton">
  <Style.Setters>
    ...
  </Style.Setters>
  <Style.Triggers>
    <MultiTrigger>
      <MultiTrigger.Conditions>
        <Condition Property="Control.IsFocused" Value="True">
        <Condition Property="Control.IsMouseOver" Value="True">
      </MultiTrigger.Conditions>
      <MultiTrigger.Setters>
        <Setter Property="Control.Foreground" Value="DarkRed" />
      </MultiTrigger.Setters>
    </MultiTrigger>
  </Style.Triggers>
</Style>

然后调用即可

 

事件触发器

事件触发器等待指定的事件被引发。事件触发器要求你提供一系列行为修改控件。这些行为被用于应用一个动画。

事件触发器也是放在Style.Triggers集合中:

<Style.Triggers>
    <EventTrigger RoutedEvent="Mouse.MouseEnter">
        。。。
    </EventTrigger>
</Style.Triggers>

见296页。

 <Button Content="Button" Height="23" Style="{StaticResource buttonStyle}"  
HorizontalAlignment="Left" Margin="10,204,0,0" Name="button5" VerticalAlignment="Top" Width="75" />
       protected override void OnOverrideMetadata(OverrideMetadata overridePropertys)
       {
            base.OnOverrideMetadata(overridePropertys);
            overridePropertys.Override("StrokeStyle", new UIPropertyMetadataAttribute(new Stroke(1), false, false, true));
        }

行为

如果给样式指定一种类型,则属性中的名字可以去掉,加上指定目标类型(TargetType)

 

支持行为

    <Window.Resources>
        <Style x:Key="buttonStyle" TargetType="{x:Type Button}">
            <Setter Property="Foreground" Value="#999999"/>
        </Style>
    </Window.Resources>

 

理解行为模型

 上述中的TargetType可以改成Control ,因为Button是从Control派生而来的。

数据绑定:

创建行为

如果其他控件也是派生自Control可以将Style1指定给这些控件也是合适的。这样就能使多种元素共用一种样式。

var bind = label["Text"] <= "Test";//右到左数据绑定,数据源是DataContext的属性

var bind = label["Text"] >= "Test";//左到右数据绑定,数据源是DataContext的属性

var bind = label["Text"] != "Test";//右到左数据绑定,只传递一次 ,数据源是DataContext的属性

var bind = label["Text"] == "Test";//双向绑定,数据源是DataContext的属性,双向绑定需要对象实现INotifyPropertyChanged



var bind = label["Text"] <= button["Test"];//右到左数据绑定

var bind = label["Text"] >= button["Test"];//左到右数据绑定

var bind = label["Text"] != button["Test"];//右到左数据绑定,只传递一次

var bind = label["Text"] == button["Test"];//双向绑定

使用行为

如:

 

Blend的设计时行为支持

  <Window.Resources>  
      <Style x:Key="Style1" TargetType="{x:Type Control }">          
  <Setter Property="FontSize" Value="16"></Setter>            <Setter Property="Width" Value="180"></Setter>   
         <Setter Property="Height" Value="30">
</Setter>       
 </Style>    
</Window.Resources>   
 <Grid>        
<Button Style="{StaticResource Style1}" Margin="23,32,95,139">Button1</Button>   
     <CheckBox Style="{StaticResource Style1}" Margin="23,130,95,41">Checkbox1</CheckBox> 
   </Grid>

 

 Button、Check可以使用Style1,而TextBlock则不行,原因是TextBlock不是派生自Control。

命令绑定:

重用样式(Reusing Styles)

当事件触发或者属性变化的时候调用方法

  重用样式指的是,样式可以拥有目标所没有的属性。比如,我们想定义一种样式,其中含有不想被所有元素共享的属性,而只希望这些非共享属性应用到特定的元素上。这时,我们就可以去掉目标类型,重新加上前缀。

label.AddCommand("MouseDown","button1_Click","CommandContext", Wtf.Windows.CommandParameter.EventArgs);

        /// <summary>
        /// 添加处理命令,命令方法在CommandContext或者其他属性的对象上
        /// </summary>
        /// <param name="eventName">触发的事件名或者属性名</param>
        /// <param name="methodName">命令方法名</param>
        /// <param name="propertyName">命令对象所在的属性名</param>
        /// <param name="ps">方法参数,可以是自定义的数据或者相关属性或者事件的数据</param>
        public void AddCommand(string eventName, string methodName, string propertyName = "CommandContext", params object[] ps)
    <Window.Resources>     
   <Style x:Key="Style1">   
         <Setter Property="CheckBox.FontSize" Value="16"></Setter>        
    <Setter Property="Button.Foreground" Value="Red"></Setter>    
        <Setter Property="CheckBox.IsChecked" Value="True"></Setter>     
   </Style>  
  </Window.Resources>  
  <Grid>      
  <CheckBox Style="{StaticResource Style1}" Margin="23,32,95,139">Button1</CheckBox>     
   <TextBlock Style="{StaticResource Style1}">TextBlock1</TextBlock>  
  </Grid>

 

 将Style1同时指定给CheckBox1和TextBlock1,TextBlocak会自动忽略不适用它们自身的样式属性IsChecked。而二者公有的属性(比如Foreground、FontSize),不论加不加前缀,对二者都有效。

 

重写样式(Overriding Style)

一些类型的隐式转换

  重写样式属性类似于面向对象中的重写,其效果也类似于CSS中的样式覆盖。最终的外观取决于最近的样式或者属性。比如,给一个元素指定了一个样式,其中包含FontSize属性值为14。而在元素定义时,重新给它的属性FontSize设置了一个值18。最终元素文本的FontSize将为18。

Brush, Color :  “#0000ff” “#ff0000ff” “255,255,255” 
“255,255,255,255”  颜色字符串转换,按顺序是r,g,b、a,r,g,b

 

 

  <Window.Resources>     
   <Style x:Key="Style1">    
        <Setter Property="Button.FontSize" Value="14"></Setter>    
    </Style>  
  </Window.Resources>   
 <Grid>       
 <Button Width="80" Height="30" FontSize="18">Button1</Button>   
 </Grid>

FloatValue: “10%” “100” “zero” “auto”  100  100.5    
数字或者百分比字符串转换,整形,浮点数据自动转换

 拓展样式(Extending Styles)

 

  可以对现有样式进行拓展,类似于面向对象中的继承或派生,可以在添加新的属性或者重载已存在的属性。

触发器样式例子

  <Window.Resources>      
  <Style x:Key="Style1" TargetType="Button">
            <Setter Property="FontSize" Value="16"></Setter>  
          <Setter Property="Foreground" Value="Red"></Setter>        </Style>    
    <Style x:Key="Style2" BasedOn="{StaticResource Style1}" TargetType="Button">       
     <!--添加新属性-->           
 <Setter Property="FontWeight" Value="Bold"></Setter>  
          <!--重载-->          
  <Setter Property="Foreground" Value="Yellow"></Setter>      
  </Style>    </Window.Resources>    <Grid>       
 <Button Style="{StaticResource Style1}"  Width="80" Height="30" FontSize="18" Margin="109,55,109,116">Button1</Button>   
     <Button Style="{StaticResource Style2}" Width="80" Height="30" FontSize="18" Margin="109,120,109,51">Button2</Button> 
   </Grid>

 

三、元素类型样式

按钮的鼠标操作效果,鼠标移入移出按下背景色变化

 一般来说,我们希望用户界面上的控件拥有统一外观,比如所有按钮大小相同、颜色一致等,这时我们可以定义一种元素的样式,对一个范围内的所有元素都有效,这就是元素类型样式。

            

  同一类型元素共享外观

 

  倘若希望一个顶级窗口内所有的元素,具有相同的样式和外观——可以这样实现:1.在顶级窗口资源中定义一个样式,不标记x:Key,将TargetType设置为一种元素类型。2.定义元素,不用指定Style,窗口中所有该类型的元素,都将使用资源中定义的样式,并具有统一外观。

       Styling.Trigger hover = new Styling.Trigger { Condition = Styling.Conditions.Equals, Property = "IsMouseOver", Value = true };

            hover.Setters.Add("Background", Drawing.Brush.Parse("#ff0000"));

            Styling.Trigger normal = new Styling.Trigger { };

            normal.Setters.Add("Background", Drawing.Brush.Parse("#00ff00"));

            Styling.Trigger press = new Styling.Trigger { Condition = Styling.Conditions.Equals, Property = "IsMouseCaptured", Value = true };

            press.Setters.Add("Background", Drawing.Brush.Parse("#ffff00"));

            label.Triggers.Add(normal);

            label.Triggers.Add(hover);

            label.Triggers.Add(press);

            label.MouseDown += delegate
            {
                label.CaptureMouse();
            };

            label.MouseUp += delegate
            {
                label.ReleaseMouseCapture();
            };
<Window.Resources>    
    <!--Button 样式-->     
   <Style TargetType="{x:Type Button}">  
          <Setter Property="FontWeight" Value="Normal"></Setter>          
  <Setter Property="Foreground" Value="Green"></Setter>      
  </Style>       
    <!--TextBlock 样式-->     
   <Style TargetType="TextBlock">   
         <Setter Property="FontSize" Value="16"></Setter>      
      <Setter Property="Foreground" Value="Red"></Setter>     
   </Style>   
 </Window.Resources> 
   <Grid>  
      <Button Name="Button1" Width="80" Height="30" Margin="46,41,172,130">Button1</Button>    
            <Button Name="Button2" Width="80" Height="30" Margin="46,90,172,80">Button2</Button>   
     <TextBlock Name="TextBlock1" Margin="164,41,38,0" Height="30" VerticalAlignment="Top">TextBlock1</TextBlock>   
     <TextBlock Name="TextBlock2" Margin="164,90,38,80">TextBlock2</TextBlock>  
  </Grid>

 

 作用范围

 

  以上的共享外观不仅仅局限于顶级窗口,而是根据你定义的样式所在的范围。如果你将样式定义在一个面板资源中,共享外观将仅仅作用该面板。

WtfObject
的属性设置的值优先级比触发器样式设置的值要高,所以当你设置了属性值,触发器样式可能没有效果

  窗口范围(作用于该窗口)

 

 

 

<Window ...>
    <Window.Resources>
        <!--Button 样式-->
        <Style TargetType="{x:Type Button}">
            <Setter Property="Foreground" Value="Green"></Setter>
        </Style>           
    </Window.Resources>
</Window>

添加UI元素,UI元素可以互相嵌套

面板范围(作用于该面板)

            var root = testControl1.RootUIElement;
            root.Foreground = "#ff0000";
            root.FontFamily = "微软雅黑";
            root.FontSize = 16;
            root.Children.Add(label);
            root.Children.Add(new Windows.Shapes.Ellipse
            {
                Stroke = "#0000ff",
                Fill = "white",
                Width = 40,
                Height = 20,
                MarginLeft = 30,
                MarginTop = 30
            });

            root.Children.Add(new Windows.Shapes.Ellipse
            {
                Stroke = "#0000ff",
                Fill = "white",
                Width = 40,
                Height = 20,
                MarginRight = "30%",
                MarginTop = 30

            });    
<Grid>
        <Grid.Resources>
            <!--Button 样式-->
            <Style TargetType="{x:Type Button}">
                <Setter Property="Foreground" Value="Green"></Setter>
            </Style>
        </Grid.Resources>
        <!---->
    </Grid>

 

 应用程序范围(作用于该应用程序)

 

<Application ...>   
 <Application.Resources>     
   <!--Button 样式-->   
     <Style TargetType="{x:Type Button}">    
        <Setter Property="Foreground" Value="Green">
</Setter>      
  </Style>  
  </Application.Resources>
</Application>  

元素布局,支持百分比布局,margin调整定位,默认居中。

四、编程控制样式

 

通过代码更改按钮Button1的样式:

触发器绑定动画

<Window.Resources>
        <!--Style1-->
        <Style x:Key="Style1" TargetType="{x:Type Button}">
            <Setter Property="FontWeight" Value="Normal"></Setter>
            <Setter Property="Foreground" Value="Green"></Setter>
        </Style>
        <!--Style2-->
        <Style x:Key="Style2" TargetType="{x:Type Button}">
            <Setter Property="FontWeight" Value="Bold"></Setter>
            <Setter Property="Foreground" Value="Red"></Setter>                        
        </Style>
    </Window.Resources>

    <Grid>
        <Button Name="Button1" Width="100" Height="40" Style="{StaticResource Style1}">Button</Button>        
        <Button Name="Button2" Width="150" Height="30" Click="Button2_Click" Margin="79,143,69,28">Change Button1's Style</Button>
    </Grid>

private void Button2_Click(object sender, RoutedEventArgs e)
{
    this.Button1.Style = (Style)FindResource("Style2");
}
            var t = new Trigger();
            Storyboard ss = new Storyboard();
            ss.Duration = new TimeSpan(0, 0, 0, 0, 500);
            var tl = new Timeline(1);
            tl.KeyFrames.Add(new KeyFrame<FloatValue> { Property = "Height", Value = 300, Ease = new BounceEase(), AnimateMode = AnimateMode.EaseIn });
            tl.KeyFrames.Add(new KeyFrame<FloatValue> { Property = "Width", Value = "30%", Ease = new BounceEase(), AnimateMode = AnimateMode.EaseIn });
            tl.KeyFrames.Add(new KeyFrame<GeneralTransform> { Property = "RenderTransform", AnimateMode = AnimateMode.EaseOut, Value = new GeneralTransform { Angle = 30 }, Ease = new ElasticEase() });
            //tl.KeyFrames.Add(new KeyFrame<SolidColorBrush> { Property = Shape.FillProperty, Value = "White" });
            ss.Timelines.Add(tl);
            t.Property = "IsMouseOver";
            t.Value = true;
            t.Animation = ss;
            t.Setters.Add("Fill", Brush.Parse("#fff"));
            v.Triggers.Add(t);

 五、触发器

 

样式(Styles)由三部分构成:设置器(Setter)、触发器(Triggers)、资源(Resources)。触发器,让样式的使用更加准确、灵活和高效。触发器(Triggers)主要分为三类,属性触发器(检查从属属性即WPF元素自身属性)、数据触发器(检查任意可绑定的属性)、事件触发器(用于监听事件)。

如果写自定义控件,继承Wtf.Windows.Controls.Control
 然后重写InitializeComponent
把样式定义代码写在里面,如果再次继承修改的话,可以重写覆盖。

属性触发器

dll暂时不提供下载

  检查从属属性的值,即WPF元素自身属性。比如按钮的内容、字体的大小、颜色等等。

图片 1

<Window.Resources> 
       <Style TargetType="Button">    
        <Style.Triggers>           
     <Trigger Property="Content" Value="按钮">         
           <Setter Property="ToolTip" Value="这是一个按钮">
</Setter>              
  </Trigger>         
   </Style.Triggers>   
     </Style>    
</Window.Resources>

 

 <Button
Content=”按钮” Height=”23″ HorizontalAlignment=”Left” Margin=”28,6,0,0″
Name=”button1″ VerticalAlignment=”Top” Width=”102″ />

注意的是: <Trigger Property=”Content”
Value=”按钮”>        一定要和<Button
Content=”按钮”..   content的值一样,否则掉不出来
 图片 2

多属性触发器

 <Window.Resources> 
       <Style TargetType="Button">      
      <Style.Triggers>     
           <Trigger Property="Content" Value="按钮">             
       <Setter Property="ToolTip" Value="这是一个按钮"></Setter>           
     </Trigger>           
     <Trigger Property="Content" Value="Button">   
                 <Setter Property="ToolTip" Value="This is a button"></Setter>          
      </Trigger>         
   </Style.Triggers>    
    </Style>    
</Window.Resources>

图片 3

多条件属性触发器

  <Window.Resources>   
     <Style TargetType="Button">   
         <Style.Triggers>        
        <MultiTrigger>           
         <!--条件列表-->            
        <MultiTrigger.Conditions>        
                <Condition Property="Content" Value="按钮"></Condition>      

  <Condition Property="Visibility" Value="Visible"></Condition>                    </MultiTrigger.Conditions>       
             <!--样式-->           
         <Setter Property="ToolTip" Value="这是一个可见按钮"></Setter>            
    </MultiTrigger>       
     </Style.Triggers>    
    </Style>  
  </Window.Resources>

 数据触发器

  可以检查任意可绑定的属性,比如CLR对象属性、XPath声明等。相对于属性触发器,数据触发器通常用来检查不可见的对象属性。

   

<Window x:Class="WpfApplication2.样式的用法.styleDemo"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="styleDemo" Height="300" Width="300">
    <Window.Resources>
        <Style TargetType="Button">
            <Style.Triggers>
                <DataTrigger Binding="{Binding Path=Name}" Value="dd">
                    <Setter Property="Foreground" Value="Tomato"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid>
        <Button Content="{Binding Path=Name}" Height="23" Margin="103,94,120,84" Name="button1" Width="75"/>
    </Grid>
</Window>

  public partial class styleDemo : Window
    {
        public styleDemo() 
        {
            InitializeComponent(); 
            DataContext = new Person("dddd", "dd"); }

        class Person { 
            string _Name;
            public string Name { get { return _Name; }
            set { _Name = value; } }
            string _Age; 
            public string Age { get { return _Age; } 
                set { _Age = value; } }
            public Person(string name, string age) 
            { _Name = name; _Age = age; } }
    }

多条件数据触发器

<Window.Resources>
        <Style TargetType="Button">
            <Style.Triggers>
                <MultiDataTrigger>
                    <!--条件列表-->
                    <MultiDataTrigger.Conditions>
                        <Condition Binding="{Binding Path=Name}" Value="李宝亨"/>
                        <Condition Binding="{Binding Path=Age}" Value="21"/>
                    </MultiDataTrigger.Conditions>
                    <Setter Property="Foreground" Value="Tomato"/>
                </MultiDataTrigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid>
        <Button Content="{Binding Path=Name}" Height="23" Margin="103,94,120,84" Name="button1" Width="75"/>
    </Grid>

事件触发器

<Window.Resources>
        <Style TargetType="Button">
            <Style.Triggers>
                <!--事件触发器-->
                <EventTrigger RoutedEvent="MouseEnter">
                    <BeginStoryboard>
                        <Storyboard>
                            <DoubleAnimation Storyboard.TargetProperty="Opacity" From="1" To="0.1" Duration="0:0:3"></DoubleAnimation>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>

后续..