艾伟:WPF中的Style(风格,样式)

在WPF中我们可以使用Style来设置控件的某些属性值,并使该设置影响到指定范围内的所有该类控件或影响指定的某一控件,比如说我们想将窗口中的所有按钮都保持某一种风格,那么我们可以设置一个Style,而不必分别设置每个按钮的风格。

Style是作为一种资源被保存下来的. 看下面的例子:

 <Window.Resources>   
    <Style TargetType="Button">
      <Setter Property="Foreground"  Value="Blue"/>
      <Setter Property="FontFamily " Value="CourierNew"/>
    Style>      
 Window.Resources>

我们声明了一个Style,它被声明在Window.Resources中说明它的有效范围是当前窗体,TargetType="Button" 指示该Style的作用对象是Button类的实例,也就是说在当前窗体中的所有Button实例都将受到该Style的影响(除非某Button有明确地指明它所使用的是另外的Style)。
<Setter Property="Foreground"  Value="Blue"/> 这里的Setter是一个设置器,用来设置该Style要对TargetType的那些属性或对象进行设置,我们这里设置的是Button的Foreground属性,将其值设置为Blue,同理,我们将Button的FontFamily属性设置为CourierNew

这样一来,在默认情况下,被加载到窗口中的所有Button对象都将受到这个Style的影响,从而文本变成统一的蓝色CourierNew字体。
你可以粘贴以下代码到XamlPad中查看效果:

<Window 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="StyleDemo" Height="417" Width="579"
    >
  
  
  <Window.Resources>    
    <Style TargetType="Button">
      <Setter Property="Foreground"  Value="Blue"/>
      <Setter Property="FontFamily " Value="CourierNew"/>
    Style>       
  Window.Resources>
  
  
    Grid ShowGridLines="True">
      
      Grid.ColumnDefinitions>
        ColumnDefinition  Width="50*"/>
        ColumnDefinition Width="50*" />
      Grid.ColumnDefinitions>
      Grid.RowDefinitions>
        RowDefinition  Height="25*"/>
        RowDefinition  Height="25*"/>
        RowDefinition  Height="25*"/>
      Grid.RowDefinitions>

      Button Grid.Column="0" Grid.ColumnSpan="1" Grid.Row="0" Grid.RowSpan="1">button1Button>
      Button Grid.Column="2" Grid.ColumnSpan="1" Grid.Row="1" Grid.RowSpan="1">button2Button>
     
    Grid>
  
Window>

接下来很容易想到的一个问题是,想上述代码的强制窗口的所有按钮都受声明的Style的影响是不是有点强奸民意,如果我只想我定义的Style影响指定的Button对象而不是所有的Button对象应该怎么办呢?
参考以下代码:我们为Style添加一个x:Key="ButtonStyle"

  <Window.Resources>
    
    <Style TargetType="Button" x:Key="ButtonStyle">
      <Setter Property="Foreground"  Value="Blue"/>
      <Setter Property="FontFamily " Value="CourierNew"/>
    Style>
        
  Window.Resources>

然后我们使用Button的Style属性来指定该Button所要使用的Style,而其他没有将我们声明的Style指定为其样式的按钮将不受到该Style的影响。

<Button>normal buttonButton>
Button Style="{StaticResource ButtonStyle}">styled buttonButton>

这样就很好的解决了Style强制影响每个Button的问题,你可以粘贴以下代码到XamlPad中查看效果:

<Window 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="StyleDemo" Height="417" Width="579"
    >
  
  
  <Window.Resources>   
    <Style TargetType="Button" x:Key="ButtonStyle">
      <Setter Property="Foreground"  Value="Blue"/>
      <Setter Property="FontFamily " Value="CourierNew"/>
    Style>    
  Window.Resources>
  
  
    Grid ShowGridLines="True">
      
      Grid.ColumnDefinitions>
        ColumnDefinition  Width="50*"/>
        ColumnDefinition Width="50*" />
      Grid.ColumnDefinitions>
      Grid.RowDefinitions>
        RowDefinition  Height="25*"/>
        RowDefinition  Height="25*"/>
        RowDefinition  Height="25*"/>
      Grid.RowDefinitions>

      Button Grid.Column="0" Grid.ColumnSpan="1" Grid.Row="0" Grid.RowSpan="1">normal buttonButton>
      Button Grid.Column="1" Grid.ColumnSpan="1" Grid.Row="1" Grid.RowSpan="1" Style="{StaticResource ButtonStyle}">styled button1Button>
      Button Grid.Column="0" Grid.ColumnSpan="1" Grid.Row="2" Grid.RowSpan="1" Style="{StaticResource ButtonStyle}">styled button2Button>
    
    Grid>
  
Window>

为了让我们的Style对外界的交互做出外观上的相应,比如当鼠标按下时蓝色的文本变成红色,当鼠标松开时文本又恢复蓝色,我们可以在Style中添加Trigger(触发器),除此之外,与类的继承原理相类似,我们还可以使用BaseOn来使一个Style“继承”另一个Style。
参考以下代码:

 <Window.Resources>
    
    <Style TargetType="Button" x:Key="ButtonStyle">
      <Setter Property="Foreground"  Value="Blue"/>
      <Setter Property="FontFamily " Value="CourierNew"/>
    Style>
    
    Style TargetType="Button" x:Key="TriggerButtonStyle" BasedOn="{StaticResource ButtonStyle}">
      Style.Triggers>
        Trigger  Property="IsPressed" Value="True">
          Setter Property="Foreground" Value="Red"/>
        Trigger>
      Style.Triggers>
    Style>
    
  Window.Resources>

我们所声明的第二个Style,即TriggerButtonStyle,它“继承”于ButtonStyle,那么TriggerButtonStyle将会从ButtonStyle那里得到蓝色CourierNew文本的性质。然后我们使用了Trigger来响应鼠标按下,  <Trigger  Property="IsPressed" Value="True"> 表示当Button的IsPressed属性值变为True的时候,将做如下设置<Setter Property="Foreground" Value="Red"/>,即将Button的Foreground属性设置为Red。这里有一个隐含的意思是:当当Button的IsPressed属性值变为False的时候,Foreground属性将恢复原值。
你可以粘贴以下代码到XamlPad中查看效果:

<Window 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="StyleDemo" Height="417" Width="579"
    >
  
  
  <Window.Resources>
    
    <Style TargetType="Button" x:Key="ButtonStyle">
      <Setter Property="Foreground"  Value="Blue"/>
      <Setter Property="FontFamily " Value="CourierNew"/>
    Style>
    
    Style TargetType="Button" x:Key="TriggerButtonStyle" BasedOn="{StaticResource ButtonStyle}">
      Style.Triggers>
        Trigger  Property="IsPressed" Value="True">
          Setter Property="Foreground" Value="Red"/>
        Trigger>
      Style.Triggers>
    Style>
    
  Window.Resources>
  
  
    <Grid ShowGridLines="True">
      
      <Grid.ColumnDefinitions>
        <ColumnDefinition  Width="50*"/>
        <ColumnDefinition Width="50*" />
      Grid.ColumnDefinitions>
      <Grid.RowDefinitions>
        <RowDefinition  Height="25*"/>
        <RowDefinition  Height="25*"/>
        <RowDefinition  Height="25*"/>
      Grid.RowDefinitions>

      <Button Grid.Column="0" Grid.ColumnSpan="1" Grid.Row="0" Grid.RowSpan="1">normal buttonButton>
      <Button Grid.Column="1" Grid.ColumnSpan="1" Grid.Row="1" Grid.RowSpan="1" Style="{StaticResource ButtonStyle}">styled buttonButton>
      <Button Grid.Column="0" Grid.ColumnSpan="1" Grid.Row="2" Grid.RowSpan="1" Style="{StaticResource TriggerButtonStyle}">trigger buttonButton>
    
    Grid>
  
Window>

时间: 2024-10-06 01:12:42

艾伟:WPF中的Style(风格,样式)的相关文章

WPF中的Style(风格,样式)

在WPF中我们可以使用Style来设置控件的某些属性值,并使该设置影响到指定范围内的所有该类控件或影响指定的某一控件,比如说我们想将窗口中的所有按钮都保持某一种风格,那么我们可以设置一个Style,而不必分别设置每个按钮的风格. Style是作为一种资源被保存下来的. 看下面的例子: <Window.Resources>        <Style TargetType="Button">       <Setter Property="Fore

【WPF】在Style中设置ToolTip的问题

今天在群里有人问到: "怎样设置 TextBlock.ToolTip 的width,使得过长的字符串自动换行" 其实ToolTip是一个object,我们可以在其中放置任何东西,所以要解决这个问题,其实很简单,只需 要写如下的xaml代码: <TextBlock> <TextBlock.ToolTip> <TextBlock Text="xxxxxx" TextWrapping="Wrap"/> </Te

艾伟:WPF中,如何将绑定源设置到单件实例

大概两个月前,曾有位朋友问我:如果我想在WPF中将绑定源设置到某个采用单件模式设计的实例上,应该怎么做呢?这是一个不错的问题.可能这段时间比较忙,呵呵,忘记回答这个问题了,昨天拿到伍迷大哥的<大话设计模式>(PS:强烈推荐该书哈,真的不错)时突然想起这个问题了.今天简要说一下: 首先我们简单地写一个使用了单件模式的MyButton类:     public class MyButton : Button    {        private MyButton()        {      

wpf中的触发器详解

原文 http://zwkufo.blog.163.com/blog/static/25882512009724113250883/ 7.1.2 简单逻辑的表示--触发器(1) 在本章的多处介绍中都会涉及触发器的使用.顾名思义,触发器(Trigger)就是当某种条件满足后即完成相应逻辑功能的一部分程序组成.在当前的WPF中,Trigger一共有三种类型,它们分别是: (1)属性触发器:其对应的类是Trigger.它在特定关联属性发生变化时被触发. (2)数据触发器:其对应的类是DataTrigg

jquery eas...-easyui是如何加载easyui.css文件中没有的css样式的?

问题描述 easyui是如何加载easyui.css文件中没有的css样式的? easyui是如何加载easyui.css文件中没有的css样式的? 比如,我用jquery去生成一个linkbutton $('#lb').linkbutton({ plain:true });之后.easyui是怎么加载出样式的?我看了浏览器解析出来的代码是这样: <a id="lb" href="javascript:void(0)" class="l-btn l-

Flex中如何利用swatchHighlightSize样式设置ColorPicker控件加亮

接下来的例子演示了Flex中如何利用swatchHighlightSize样式,设置ColorPicker控件加亮边框粗细 尺寸. 下面是完整代码 <?xml version="1.0" encoding="utf-8"?> <mx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign=&quo

WPF中TreeView.BringIntoView方法的替代方案

WPF中TreeView.BringIntoView()方法并不是那么地好用,不少时候会没有效果,这里有一个替代方案,调用SelectItem()方法可以展开并呈现TreeView上指定的Item: public static class TreeViewHelper { /// <summary> /// Expands all children of a TreeView /// </summary> /// <param name="treeView"

WPF中自定义漂亮的进度条

wpf中自带的进度条是这个样子德. 在2003中这个进度条的样子就会变得非常难看. 在wpf中您可以自己制作任意样式的进度条.如下图: UserControl.xaml 用户控件 <Grid x:Name="LayoutRoot" Background="Transparent" HorizontalAlignment="Center" VerticalAlignment="Center"> <Grid.Re

MSDN 杂志:UI 前沿技术 - WPF 中的多点触控操作事件

原文  MSDN 杂志:UI 前沿技术 - WPF 中的多点触控操作事件 UI 前沿技术 WPF 中的多点触控操作事件 Charles Petzold 下载代码示例 就在过去几年,多点触控还只是科幻电影中表现未来主义的一种重要手法,现在俨然已经成为主流的用户界面技术. 多点触控显示屏现在成了新型智能手机和 Tablet 计算机的标准显示屏. 此外,它还可能在公共场所的计算机上普及,例如 Microsoft Surface 率先开发的网亭或桌面计算机. 实际存在的唯一不确定因素是多点触控在常规台式