• WPF 样式


    1. 样式是属性值的集合,能被应用到一个元素,类似CSS,每个控件最多只能有一个样式,通过控件的Stype属性应用样式,如下代码,其中BigFontButtonStyle是用于检索资源的关键字,也可以通过代码指定样式:
      <Button Padding="5" Margin="5" Name="cmd"
       Style="{StaticResource BigFontButtonStyle}"> 
      </Button>
      cmd.Style = (Style)cmd.FindResource("BigFontButtonStyle"); //样式指定为空 <Button Padding="5" Margin="5" Style="{x:Null}">A Normal Button</Button>
    2. Style类一共有5个重要的属性:

      属性 描述
      Setters Setter或EventSetter对象的集合。用于自动地设置属性值和附着事件处理器。设置器只能改变依赖性属性,需要提供类和属性的名称,如果使用TargetType指定了所有属性应用的对象,则可以省略类名,只使用属性名
      Triggers TriggerBase对象的集合,并且允许你自动地改变样式设置。例如,当另一个属性改变时或当一个事件发生时,你能修改一个样式。
      Resources 你希望用于样式的资源集合。例如,有时需要用一个对象设置多个属性。在那种情况下,更有效的是创造对象作为一个资源,然后在你的设置器对象中使用那资源,而不是在每个设置器中,使用嵌套标签创造对象。
      BasedOn 一个属性,允许你创造一个更特殊的样式。此样式继承(和可选地覆盖)另一个样式的设置。
      TargetType 一个属性,识别样式所作用于的元素类型。此属性允许你创造仅影响某些元素的设置器,它允许你创造对于匹配的元素类型自动生效的设置器。
       
    3. 基于之前的样式建立一个新样式,使用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>
       
    4. 如果样式中的所有属性都应用到同类型的元素,可以设置TargetType属性,指出属性应用的类,可以注意Property的值没有类名。如果在窗口的Resources中定义的Style指定了TargetType为Button,则该窗口中所有的按钮将自动应用该样式,除非显示提供自己的样式。自动样式一般很少用
      <Style x:Key="BigFontButtonStyle" TargetType="Button">
        <Setter Property="FontFamily" Value="Times New Roman" />
        <Setter Property="FontSize" Value="18" />
        <Setter Property="FontWeight" Value="Bold" />
      </Style>
    5. 附加事件处理器: 表示TextBlock 发生MouseEnter时,执行element_MouseEnter代码
      <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><TextBlock Style="{StaticResource MouseOverHighlightStyle}">
       Hover over me.
      </TextBlock>

    6. 触发器:种类包括Trigger,MultiTrigger,DataTrigger,MultiDataTrigger和EventTrigger,下列代码表示当Control控件获得焦点时,把Control.Foreground设为DarkRed
      <Style.Triggers>
          <Trigger Property="Control.IsFocused" Value="True">
            <Setter Property="Control.Foreground" Value="DarkRed" />
          </Trigger>
       </Style.Triggers>
    7. DataTrigger:这种触发器使用数据绑定,监视绑定数据的变化
      <TextBlock.Style>
            <Style TargetType="{x:Type TextBlock}">
                   <Setter Property="Visibility" Value="Collapsed"/>
                       <Style.Triggers>
                             <DataTrigger Binding="{Binding Text, ElementName=DescriptionTextBox}" Value="">
                                  <Setter Property="Visibility" Value="Visible"/>
                              </DataTrigger>
                              <DataTrigger Binding="{Binding IsFocused, ElementName=DescriptionTextBox}" Value="true">
                                  <Setter Property="Visibility" Value="Collapsed"/>
                         </DataTrigger>
                    </Style.Triggers>
             </Style>
      </TextBlock.Style>

    8. 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>
    9. 事件触发器
      <Style.Triggers>
          <EventTrigger RoutedEvent="Mouse.MouseEnter">
              。。。
          </EventTrigger>
      </Style.Triggers>
     
  • 相关阅读:
    JS 中深拷贝的几种实现方法
    实现一个函数clone,可以对JS中的5种数据类型(Number、String、Object、Array、Boolean)进行值复制
    etTimeout来实现setInterval
    原型链
    Vue.js面试题整理
    JS中的闭包
    JavaScript的数据类型
    MyBatis-Plus使用(1)-概述+代码生成器
    JDK8的Optional用法
    动态修改HttpServletRequest的Post请求参数
  • 原文地址:https://www.cnblogs.com/phenixyu/p/3969031.html
Copyright © 2020-2023  润新知