WPF Style设置和模板化Template

WPF样式设置和模板化是一套功能(样式,模板,触发器和演示图版),可以为产品设置统一外观。类似于html的css,可以快速的设置一系列属性值到控件。

 

案例:ButtonStyle

这里创建了一个目标类型为Button的基础ButtonStyle,其他的Button就可以继承SystemButtonBase,可以统一基础的Style,根据需求设置需要的属性值,登录按钮可以使用StaticResource的方式查找到这个style。

 1 <Style x:Key="SystemButtonBase" TargetType="ButtonBase">
 2         <Setter Property="Background" Value="Transparent"/>
 3         <Setter Property="BorderThickness" Value="0"/>
 4         <Setter Property="HorizontalContentAlignment" Value="Center"/>
 5         <Setter Property="VerticalContentAlignment" Value="Center"/>
 6         <Setter Property="Cursor" Value="Hand"/>
 7         <Setter Property="Padding" Value="1"/>
 8         <Setter Property="Template">
 9             <Setter.Value>
10                 <ControlTemplate TargetType="{x:Type ButtonBase}">
11                     <Border Name="Chrome"
12                                 Background="{TemplateBinding Background}"
13                                 BorderThickness="{TemplateBinding BorderThickness}"
14                                 BorderBrush="{TemplateBinding BorderBrush}"
15                                 SnapsToDevicePixels="true"
16                                 CornerRadius="5">
17                         <ContentPresenter Margin="{TemplateBinding Padding}"
18                                               VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
19                                               HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
20                                               RecognizesAccessKey="True"
21                                               SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/>
22                     </Border>
23                 </ControlTemplate>
24             </Setter.Value>
25         </Setter>
26         <Style.Triggers>
27             <Trigger Property="IsEnabled" Value="false">
28                 <Setter Property="Cursor" Value="Arrow" />
29             </Trigger>
30         </Style.Triggers>
31     </Style>
32     <Style TargetType="Button" BasedOn="{StaticResource SystemButtonBase}" x:Key="BtnStyle">
33         <Setter Property="Background" Value="#09a3dc"/>
34         <Setter Property="Foreground" Value="#ffffff"/>
35         <Setter Property="MinHeight" Value="28"/>
36         <Setter Property="MinWidth" Value="70"/>
37         <Style.Triggers>
38             <Trigger Property="IsMouseOver" Value="True">
39                 <Setter Property="Background" Value="#3cc3f5"/>
40             </Trigger>
41             <Trigger Property="IsPressed" Value="True">
42                 <Setter Property="Background" Value="#098cbc" />
43             </Trigger>
44             <Trigger Property="IsEnabled" Value="false">
45                 <Setter Property="Background" Value="#e1e1e1" />
46                 <Setter Property="Foreground" Value="#7e7e7e" />
47             </Trigger>
48         </Style.Triggers>
49     </Style>

 

简单引用

1 <Button Content="登录" Height="30" Margin="0"  Width="115" Style="{StaticResource BtnStyle}"/>

 

 

这个就是介绍的WPF的Style的简短文字

希望和大家多多的交流沟通,共同进步。 谢谢!

 

WPF Style设置和模板化Template

上一篇:Sublime Text3 高亮显示Jade语法 (Windows 环境)


下一篇:RESTFul API设计指南及使用说明