1、序言
在WPF中,设置外观样式我们有很多种方式,比如通过设置控件的属性来控制控件的外观样式;或者通过在每一个控件中分别设置Style;或者通过在整个Window.Resource中设置Style,又或者在App.xaml的Application.Resource设置Style。总之样式概念使开发人员能够更好的设置控件的外观,下面就上面的几种情形进行说明。
2、通过在控件中设置Style来控制控件的外观
<Window x:Class="WpfApplication5.Window1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="Window1" Height="300" Width="300"> <Grid> <Button Click="Button_Click"> <Button.Style> <Style TargetType="Button"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Button"> <Grid> <Rectangle Width="100" Fill="Red" ></Rectangle> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </Button.Style> </Button> </Grid> </Window>
显示效果:
分析:我们把样式直接作用于当前Button控件,样式在这里用于设置控件模板,使Button显示矩形框形状。
3、通过在Window.Resource中设置Style来控制控件的外观
1)在Style中添加X:Key属性
<Window x:Class="WpfApplication5.Window1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="Window1" Height="300" Width="300"> <Window.Resources> <Style TargetType="Button" x:Key="ButtonStyle"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Button"> <Grid> <Rectangle Fill="Red"></Rectangle> <Label>我是在Resources中设计的样式</Label> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </Window.Resources> <Canvas> <Button Width="200" Height="50" Canvas.Left="0" Canvas.Top="0" Style="{StaticResource ButtonStyle} "> </Button> <Button Width="200" Height="50" Canvas.Left="0" Canvas.Top="80"> </Button> </Canvas> </Window>
效果图如下:
分析:虽然Style的TargetType="Button",但是由于没有为第二个Button指定Style,所以Style没有作用于第二个Button。
2)
<Window x:Class="WpfApplication5.Window1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="Window1" Height="300" Width="300"> <Window.Resources> <Style TargetType="Button" > <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Button"> <Grid> <Rectangle Fill="Red"></Rectangle> <Label>我是在Resources中设计的样式</Label> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </Window.Resources> <Canvas> <Button Width="200" Height="50" Canvas.Left="0" Canvas.Top="0"> </Button> <Button Width="200" Height="50" Canvas.Left="0" Canvas.Top="80"> </Button> </Canvas> </Window>
效果图如下:
分析:由于没有为Style设置Key,而且也没有为Button设置特定的Style,所以Style作用于整个Window的所有Button(没有两外为Button指定Style)。
3、通过在App.xaml中的Application.Resource中设置Style来控制控件的外观
<Application x:Class="WpfApplication5.App" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" StartupUri="Window1.xaml"> <Application.Resources> <Style TargetType="Button" > <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Button"> <Grid> <Rectangle Fill="Red"></Rectangle> <Label>我是在Resources中设计的样式</Label> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </Application.Resources> </Application>
<Window x:Class="WpfApplication5.Window1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="Window1" Height="300" Width="300"> <Window.Resources> <Style TargetType="Button" x:Key="WindowStyle" > <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Button"> <Grid> <Rectangle Fill="Blue"></Rectangle> <Label>我是在Resources中设计的样式</Label> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </Window.Resources> <Canvas> <Button Width="200" Height="50" Canvas.Left="0" Canvas.Top="0" Style="{StaticResource WindowStyle}"> </Button> <Button Width="200" Height="50" Canvas.Left="0" Canvas.Top="80"> </Button> </Canvas> </Window>
效果图如下:
分析:由于第一个Button指定了Style,所以key=WindowStyle的样式作用于它。第二个Button没有指定,所以在App资源中定义的Style作用于第二个Button.
以上是比较简单的Demo,但是能够说明Style的用途了,记录下来以备以后用到。