当前位置：首页 > news >正文

WPF中样式

news 来源：原创 2024/5/9 19:40:28

WPF中样式：类似于winform中控件的属性

<Grid><!-- Button属性 字体大小 字体颜色 内容 控件宽 高 --><Button FontSize="20" Foreground="Blue" Content="Hello" Width="100" Height="40"/></Grid>

效果如下：

如果要创建多个相似效果的按钮，就需要将该属性写多次，虽然也能达到相同的效果；但是费力。

<Grid><StackPanel><!-- Button属性 字体大小 字体颜色 内容 控件宽 高 --><Button FontSize="20" Foreground="Blue" Content="Hello" Width="100" Height="40"/><Button FontSize="20" Foreground="Blue" Content="Hello" Width="100" Height="40"/><Button FontSize="20" Foreground="Blue" Content="Hello" Width="100" Height="40"/></StackPanel></Grid>

效果如下：

因此，首先想到的是早轮子重复使用。需要通过Style。

创建样式的步骤：

在Window.Resources中创建样式
给每个样式声明一个键Key，一个样式的名称而已
给每个样式声明一个目标类型TargetType，例如Button
设置属性：（Button为例）
字体大小FontSize
背景颜色Background
字体颜色Foreground，边距Margin
水平位置HorizontalAlignment，垂直位置VerticalAlignment

样式是组织和重用以上的重要工具。不是使用重复的标记填充XAML，通过Styles创建一系列封装所有这些细节的样式。它也是模板（Template）、触发器（Trigger）的基础。

    <Window.Resources><Style x:Key="defaultStyle" TargetType="Button"><Setter Property="FontSize" Value="30"/><Setter Property="Foreground" Value="Blue"/><Setter Property="Width" Value="100"/><Setter Property="Height" Value="40"/></Style></Window.Resources><Grid><StackPanel><Button Style="{StaticResource defaultStyle}" Content="Hello"/><Button Style="{StaticResource defaultStyle}" Content="Hello"/><Button Style="{StaticResource defaultStyle}" Content="Hello"/></StackPanel></Grid>

效果如下：

查询Style源代码：

namespace System.Windows
{//// 摘要://     启用的属性、 资源和事件处理程序的一种类型的实例之间共享。[ContentProperty("Setters")][DictionaryKeyProperty("TargetType")][Localizability(LocalizationCategory.Ignore)]public class Style : DispatcherObject, INameScope, IAddChild, ISealable, IHaveResources, IQueryAmbient{//// 摘要://     初始化 System.Windows.Style 类的新实例。public Style();//// 摘要://     新实例初始化 System.Windows.Style 类，用于对指定 System.Type。//// 参数://   targetType://     该样式将应用于哪个类型。public Style(Type targetType);//// 摘要://     新实例初始化 System.Windows.Style 类，用于对指定 System.Type 并根据指定 System.Windows.Style。//// 参数://   targetType://     该样式将应用于哪个类型。////   basedOn://     要基于此样式的样式。public Style(Type targetType, Style basedOn);//// 摘要://     获取一个值，该值指示是否样式是只读的并且不能更改。//// 返回结果://     true 如果样式密封的;，否则为 false。public bool IsSealed { get; }//// 摘要://     获取或设置此样式所针对的类型。//// 返回结果://     此样式目标类型。[Ambient][Localizability(LocalizationCategory.NeverLocalize)]public Type TargetType { get; set; }//// 摘要://     获取或设置是当前样式的基础已定义的样式。//// 返回结果://     已定义的样式，其当前样式的基础。 默认值为 null。[Ambient][DefaultValue(null)]public Style BasedOn { get; set; }//// 摘要://     获取一套 System.Windows.TriggerBase 应用属性值的对象根据指定的条件。//// 返回结果://     System.Windows.TriggerBase 对象的集合。 默认值为空集合。[DesignerSerializationVisibility(DesignerSerializationVisibility.Content)]public TriggerCollection Triggers { get; }//// 摘要://     获取一套 System.Windows.Setter 和 System.Windows.EventSetter 对象。//// 返回结果://     一套 System.Windows.Setter 和 System.Windows.EventSetter 对象。 默认值为空集合。[DesignerSerializationVisibility(DesignerSerializationVisibility.Content)]public SetterBaseCollection Setters { get; }//// 摘要://     获取或设置此样式的作用域内的可用资源的集合。//// 返回结果://     可以使用此样式的作用域内的资源。[Ambient]public ResourceDictionary Resources { get; set; }//// 摘要://     返回此 System.Windows.Style 的哈希代码。//// 返回结果://     此 System.Windows.Style 的哈希代码。public override int GetHashCode();//// 摘要://     在当前的名称范围中注册新的名称对象对。//// 参数://   name://     要注册的名称。////   scopedElement://     要映射到指定的对象 name。public void RegisterName(string name, object scopedElement);//// 摘要://     锁定此样式和所有工厂和触发器，使它们不能进行更改。public void Seal();//// 摘要://     从名称范围中移除名称对象映射。//// 参数://   name://     要删除的映射的名称。public void UnregisterName(string name);}
}

TargetType：Style的作用类型，例如Button。
BaseOn：继承已有的样式。
TriggerCollection：触发器集合。
SetterBaseCollection：属性集合。
ResourceDictionary：资源字典，比如笔刷，样式。

样式的作用：样式可以包含多个属性（样式管理属性集合），并批量作用于对象（不用写过多重复代码），也可以用于继承。

    <Window.Resources><Style TargetType="Button"><Setter Property="FontSize" Value="25"/><Setter Property="Foreground" Value="White"/><Setter Property="Background" Value="Black"/><Setter Property="Content" Value="Button"/></Style></Window.Resources><Grid><UniformGrid Columns="3" Rows="3"><Button /><Button /><Button /><Button /><Button /><Button /><Button /><Button /><Button /></UniformGrid></Grid>

效果如下：

给样式起名字，并在作用对象中使用该样式：

    <Window.Resources><Style x:Key="ButtonStyle" TargetType="Button"><Setter Property="FontSize" Value="25"/><Setter Property="Foreground" Value="White"/><Setter Property="Background" Value="Black"/><Setter Property="Content" Value="Button"/></Style></Window.Resources><Grid><UniformGrid Columns="3" Rows="3"><Button Style="{StaticResource ButtonStyle}"/><Button Style="{StaticResource ButtonStyle}"/><Button Style="{StaticResource ButtonStyle}"/><Button Style="{StaticResource ButtonStyle}"/><Button Style="{StaticResource ButtonStyle}"/><Button Style="{StaticResource ButtonStyle}"/><Button Style="{StaticResource ButtonStyle}"/><Button Style="{StaticResource ButtonStyle}"/><Button Style="{StaticResource ButtonStyle}"/></UniformGrid></Grid>

效果如下：

样式继承

    <Window.Resources><Style x:Key="baseButtonStyle" TargetType="Button"><Setter Property="FontSize" Value="30"/><Setter Property="Foreground" Value="Blue"/></Style><Style x:Key="defaultButtonStyle1" TargetType="Button" BasedOn="{StaticResource baseButtonStyle}"><Setter Property="Width" Value="100"/><Setter Property="Height" Value="40"/></Style><Style x:Key="defaultButtonStyle2" TargetType="Button" BasedOn="{StaticResource baseButtonStyle}"><Setter Property="Width" Value="100"/><Setter Property="Height" Value="50"/></Style></Window.Resources><Grid><StackPanel><!-- Button属性 字体大小 字体颜色 内容 控件宽 高 --><Button Style="{StaticResource defaultButtonStyle1}" Content="Hello"/><Button Style="{StaticResource defaultButtonStyle2}" Content="Hello"/><Button Style="{StaticResource defaultButtonStyle2}" Content="Hello"/></StackPanel></Grid>

效果如下：

控件模板ControlTemplate

视图->其他->文档大纲

右键按钮->编辑模板->编辑副本

产生按钮模板：

<Window.Resources><Style x:Key="FocusVisual"><Setter Property="Control.Template"><Setter.Value><ControlTemplate><Rectangle Margin="2" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/></ControlTemplate></Setter.Value></Setter></Style><SolidColorBrush x:Key="Button.Static.Background" Color="#FFDDDDDD"/><SolidColorBrush x:Key="Button.Static.Border" Color="#FF707070"/><SolidColorBrush x:Key="Button.MouseOver.Background" Color="#FFBEE6FD"/><SolidColorBrush x:Key="Button.MouseOver.Border" Color="#FF3C7FB1"/><SolidColorBrush x:Key="Button.Pressed.Background" Color="#FFC4E5F6"/><SolidColorBrush x:Key="Button.Pressed.Border" Color="#FF2C628B"/><SolidColorBrush x:Key="Button.Disabled.Background" Color="#FFF4F4F4"/><SolidColorBrush x:Key="Button.Disabled.Border" Color="#FFADB2B5"/><SolidColorBrush x:Key="Button.Disabled.Foreground" Color="#FF838383"/><Style x:Key="ButtonStyle1" TargetType="{x:Type Button}"><Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/><Setter Property="Background" Value="{StaticResource Button.Static.Background}"/><Setter Property="BorderBrush" Value="{StaticResource Button.Static.Border}"/><Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/><Setter Property="BorderThickness" Value="1"/><Setter Property="HorizontalContentAlignment" Value="Center"/><Setter Property="VerticalContentAlignment" Value="Center"/><Setter Property="Padding" Value="1"/><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="{x:Type Button}"><Border x:Name="border" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="true"><ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/></Border><ControlTemplate.Triggers><Trigger Property="IsDefaulted" Value="true"><Setter Property="BorderBrush" TargetName="border" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/></Trigger><Trigger Property="IsMouseOver" Value="true"><Setter Property="Background" TargetName="border" Value="{StaticResource Button.MouseOver.Background}"/><Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.MouseOver.Border}"/></Trigger><Trigger Property="IsPressed" Value="true"><Setter Property="Background" TargetName="border" Value="{StaticResource Button.Pressed.Background}"/><Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Pressed.Border}"/></Trigger><Trigger Property="IsEnabled" Value="false"><Setter Property="Background" TargetName="border" Value="{StaticResource Button.Disabled.Background}"/><Setter Property="BorderBrush" TargetName="border" Value="{StaticResource Button.Disabled.Border}"/><Setter Property="TextElement.Foreground" TargetName="contentPresenter" Value="{StaticResource Button.Disabled.Foreground}"/></Trigger></ControlTemplate.Triggers></ControlTemplate></Setter.Value></Setter></Style></Window.Resources>

Content Presenter使得按钮可以承载很多内容。