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

wpf之样式

backend 2025/9/2 9:35:59

前言

wpf的style样式用于将一组属性设置封装起来放置于资源文件中，从而轻松地应用到多个元素上，从而实现 UI 的统一和换肤功能，style主要有Setter、Trigger两个特性，

1、Setter

下面的代码中使用style通过Setter封装了三个属性Background、Foreground、FontSize，让这三个属性成为一个样式，并且通过TargetType="Button"来指定Button控件使用这个样式，并且使用x:Key=“MyButtonStyle"来为这个样式起了一个名称，并且这个样式放置于Window.Resources中使样式成为了资源文件。最后使用Button时，通过Style=”{StaticResource MyButtonStyle}"来让Button使用指定的样式.

<Window x:Class="wpf之Style.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d="http://schemas.microsoft.com/expression/blend/2008"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:local="clr-namespace:wpf之Style"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><Window.Resources><Style x:Key="MyButtonStyle" TargetType="Button"><Setter Property="Background" Value="Red" /><Setter Property="Foreground" Value="White"/><Setter Property="FontSize" Value="25"/></Style></Window.Resources><Grid><StackPanel ><Button  Height=" 100" Style="{StaticResource MyButtonStyle}"  Content="样式Button"/><Button  Height=" 100" Content="普通Button" /></StackPanel ></Grid>
</Window>

2、运行结果

从运行结果可以看出，使用了样式的Button，背景色、字体颜色、字体大小和不使用样式的Button比都得到了改变。
在这里插入图片描述

2、Trigger

Trigger称为触发器，Property是触发器关注的属性，Value是触发的条件，下面的代码中使用了两个触发器，当CheckBox的IsChecked为true时，背景色设置为Green，否则设置为红色

<Window x:Class="wpf之Style.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d="http://schemas.microsoft.com/expression/blend/2008"xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"xmlns:local="clr-namespace:wpf之Style"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><Window.Resources><Style x:Key="MyCheckBoxStyle" TargetType="CheckBox" ><Style.Triggers><Trigger Property="IsChecked" Value="True" ><Setter Property="Background" Value="Green"    /></Trigger><Trigger Property="IsChecked" Value="False"  ><Setter Property="Background" Value="Red"  /></Trigger></Style.Triggers></Style></Window.Resources><Grid><StackPanel Orientation="Vertical" ><CheckBox   Style="{StaticResource MyCheckBoxStyle}"  Content="样式CheckBox"/><CheckBox   Content="普通CheckBox" /></StackPanel ></Grid>
</Window>