WPF中的Style(风格,样式)

转载 2008年05月02日 22:23:00
                                                                             WPF中的Style(风格,样式)
                                                                                                            周银辉

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

Style是作为一种资源被保存下来的. 看下面的例子:
None.gif <Window.Resources>   
None.gif    
<Style TargetType="Button">
None.gif      
<Setter Property="Foreground"  Value="Blue"/>
None.gif      
<Setter Property="FontFamily " Value="CourierNew"/>
None.gif    
</Style>      
None.gif 
</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中查看效果:
None.gif<Window 
None.gif    
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
None.gif    xmlns:x
="http://schemas.microsoft.com/winfx/2006/xaml"
None.gif    Title
="StyleDemo" Height="417" Width="579"
None.gif    
>
None.gif  
None.gif  
None.gif  
<Window.Resources>    
None.gif    
<Style TargetType="Button">
None.gif      
<Setter Property="Foreground"  Value="Blue"/>
None.gif      
<Setter Property="FontFamily " Value="CourierNew"/>
None.gif    
</Style>       
None.gif  
</Window.Resources>
None.gif  
None.gif  
None.gif    
<Grid ShowGridLines="True">
None.gif      
None.gif      
<Grid.ColumnDefinitions>
None.gif        
<ColumnDefinition  Width="50*"/>
None.gif        
<ColumnDefinition Width="50*" />
None.gif      
</Grid.ColumnDefinitions>
None.gif      
<Grid.RowDefinitions>
None.gif        
<RowDefinition  Height="25*"/>
None.gif        
<RowDefinition  Height="25*"/>
None.gif        
<RowDefinition  Height="25*"/>
None.gif      
</Grid.RowDefinitions>
None.gif
None.gif      
<Button Grid.Column="0" Grid.ColumnSpan="1" Grid.Row="0" Grid.RowSpan="1">button1</Button>
None.gif      
<Button Grid.Column="2" Grid.ColumnSpan="1" Grid.Row="1" Grid.RowSpan="1">button2</Button>
None.gif     
None.gif    
</Grid>
None.gif  
None.gif
</Window>
None.gif


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

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

然后我们使用Button的Style属性来指定该Button所要使用的Style,而其他没有将我们声明的Style指定为其样式的按钮将不受到该Style的影响。
None.gif<Button>normal button</Button>
None.gif
<Button Style="{StaticResource ButtonStyle}">styled button</Button>
这样就很好的解决了Style强制影响每个Button的问题,你可以粘贴以下代码到XamlPad中查看效果:
None.gif<Window 
None.gif    
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
None.gif    xmlns:x
="http://schemas.microsoft.com/winfx/2006/xaml"
None.gif    Title
="StyleDemo" Height="417" Width="579"
None.gif    
>
None.gif  
None.gif  
None.gif  
<Window.Resources>   
None.gif    
<Style TargetType="Button" x:Key="ButtonStyle">
None.gif      
<Setter Property="Foreground"  Value="Blue"/>
None.gif      
<Setter Property="FontFamily " Value="CourierNew"/>
None.gif    
</Style>    
None.gif  
</Window.Resources>
None.gif  
None.gif  
None.gif    
<Grid ShowGridLines="True">
None.gif      
None.gif      
<Grid.ColumnDefinitions>
None.gif        
<ColumnDefinition  Width="50*"/>
None.gif        
<ColumnDefinition Width="50*" />
None.gif      
</Grid.ColumnDefinitions>
None.gif      
<Grid.RowDefinitions>
None.gif        
<RowDefinition  Height="25*"/>
None.gif        
<RowDefinition  Height="25*"/>
None.gif        
<RowDefinition  Height="25*"/>
None.gif      
</Grid.RowDefinitions>
None.gif
None.gif      
<Button Grid.Column="0" Grid.ColumnSpan="1" Grid.Row="0" Grid.RowSpan="1">normal button</Button>
None.gif      
<Button Grid.Column="1" Grid.ColumnSpan="1" Grid.Row="1" Grid.RowSpan="1" Style="{StaticResource ButtonStyle}">styled button1</Button>
None.gif      
<Button Grid.Column="0" Grid.ColumnSpan="1" Grid.Row="2" Grid.RowSpan="1" Style="{StaticResource ButtonStyle}">styled button2</Button>
None.gif    
None.gif    
</Grid>
None.gif  
None.gif
</Window>
None.gif


为了让我们的Style对外界的交互做出外观上的相应,比如当鼠标按下时蓝色的文本变成红色,当鼠标松开时文本又恢复蓝色,我们可以在Style中添加Trigger(触发器),除此之外,与类的继承原理相类似,我们还可以使用BaseOn来使一个Style“继承”另一个Style。
参考以下代码:
None.gif <Window.Resources>
None.gif    
None.gif    
<Style TargetType="Button" x:Key="ButtonStyle">
None.gif      
<Setter Property="Foreground"  Value="Blue"/>
None.gif      
<Setter Property="FontFamily " Value="CourierNew"/>
None.gif    
</Style>
None.gif    
None.gif    
<Style TargetType="Button" x:Key="TriggerButtonStyle" BasedOn="{StaticResource ButtonStyle}">
None.gif      
<Style.Triggers>
None.gif        
<Trigger  Property="IsPressed" Value="True">
None.gif          
<Setter Property="Foreground" Value="Red"/>
None.gif        
</Trigger>
None.gif      
</Style.Triggers>
None.gif    
</Style>
None.gif    
None.gif  
</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中查看效果:
None.gif<Window 
None.gif    
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
None.gif    xmlns:x
="http://schemas.microsoft.com/winfx/2006/xaml"
None.gif    Title
="StyleDemo" Height="417" Width="579"
None.gif    
>
None.gif  
None.gif  
None.gif  
<Window.Resources>
None.gif    
None.gif    
<Style TargetType="Button" x:Key="ButtonStyle">
None.gif      
<Setter Property="Foreground"  Value="Blue"/>
None.gif      
<Setter Property="FontFamily " Value="CourierNew"/>
None.gif    
</Style>
None.gif    
None.gif    
<Style TargetType="Button" x:Key="TriggerButtonStyle" BasedOn="{StaticResource ButtonStyle}">
None.gif      
<Style.Triggers>
None.gif        
<Trigger  Property="IsPressed" Value="True">
None.gif          
<Setter Property="Foreground" Value="Red"/>
None.gif        
</Trigger>
None.gif      
</Style.Triggers>
None.gif    
</Style>
None.gif    
None.gif  
</Window.Resources>
None.gif  
None.gif  
None.gif    
<Grid ShowGridLines="True">
None.gif      
None.gif      
<Grid.ColumnDefinitions>
None.gif        
<ColumnDefinition  Width="50*"/>
None.gif        
<ColumnDefinition Width="50*" />
None.gif      
</Grid.ColumnDefinitions>
None.gif      
<Grid.RowDefinitions>
None.gif        
<RowDefinition  Height="25*"/>
None.gif        
<RowDefinition  Height="25*"/>
None.gif        
<RowDefinition  Height="25*"/>
None.gif      
</Grid.RowDefinitions>
None.gif
None.gif      
<Button Grid.Column="0" Grid.ColumnSpan="1" Grid.Row="0" Grid.RowSpan="1">normal button</Button>
None.gif      
<Button Grid.Column="1" Grid.ColumnSpan="1" Grid.Row="1" Grid.RowSpan="1" Style="{StaticResource ButtonStyle}">styled button</Button>
None.gif      
<Button Grid.Column="0" Grid.ColumnSpan="1" Grid.Row="2" Grid.RowSpan="1" Style="{StaticResource TriggerButtonStyle}">trigger button</Button>
None.gif    
None.gif    
</Grid>
None.gif  
None.gif
</Window>
None.gif

文章来源于 http://www.cnblogs.com/zhouyinhui 版权归原作者所有

WPF窗口模板——Style样式

在WPF中新建一个通用窗口模板,在新建一个窗口时,通过使用该模板样式,达成窗口风格统一的目的。以下是具体步骤:...
  • xwlyun
  • xwlyun
  • 2015-01-13 15:00:59
  • 7251

<em>WPF</em>的<em>样式</em>与<em>模板</em>

<em>WPF样式</em>(Style)与<em>模板</em>(Template) <em>WPF</em>窗口<em>模板</em>——<em>Style样式</em> <em>WPF</em>的样式与<em>模板</em> 立即下载 上传者: dawn 时间: 2012-11-16 综合评分: 5 积分/C币:3 <em>WPF</em>...
  • 2018年04月08日 00:00

WPF Style & Template

WPF元素可以使用一个样式,通过元素的Style属性设置(Style属性在FrameworkElement中定义) Setter是Style中最重要的属性,Setter只支持依赖属性; 某些依赖属...
  • hetoby
  • hetoby
  • 2017-09-22 13:46:59
  • 212

WPF中的Style(风格,样式)

WPF中的Style(风格,样式)                                                                                   ...
  • cuijie
  • cuijie
  • 2008-01-03 08:42:00
  • 406

WPF样式(Style)与模板(Template)

一、WPF样式   类似于Web应用程序中的CSS,在WPF中可以为控件定义统一的样式(Style)。样式属于资源的一种,例如为Button定义统一的背景颜色和字体:  1:   2:     3: ...
  • mane_yao
  • mane_yao
  • 2010-04-30 15:40:00
  • 9211

WPF样式(Style)与模板(Template)

一、WPF样式 类似于Web应用程序中的CSS,在WPF中可以为控件定义统一的样式(Style)。样式属于资源的一种,例如为Button定义统一的背景颜色和字体: 1: ...
  • xiurui12345
  • xiurui12345
  • 2012-06-04 12:44:58
  • 410

有了它wpf的style可以任你发挥了

前段时间一直在做wpf的UI开发,每次想做些控件style定制的时候都很头疼 很多控件不知道他的controltemplate是什么样的 为了方便大家写style 特别奉上wpf的style大全 ...
  • lhx527099095
  • lhx527099095
  • 2012-09-20 11:01:50
  • 9951

WPF中Style样式原理分析

  • 2011年06月10日 00:13
  • 5KB
  • 下载

Bootstrap WPF Style,Bootstrap风格的WPF样式

简介 GitHub地址:https://github.com/ptddqr/bootstrap-wpf-style 此样式基于bootstrap-3.3.0,样式文件里的源码行数都是指的这...
  • lHz76ttw1U
  • lHz76ttw1U
  • 2017-03-08 16:33:40
  • 223

WPF-样式继承

PS:现在我的MailMail完工了,进入内测阶段了,终于可以腾出手来写写教程了哈,关于MailMail的介绍及内测程序索取:http://www.cnblogs.com/SkyD/archive/2...
  • yqj234
  • yqj234
  • 2016-03-11 18:28:59
  • 2102
收藏助手
不良信息举报
您举报文章:WPF中的Style(风格,样式)
举报原因:
原因补充:

(最多只允许输入30个字)