触发器 Trigger
触发器(Trigger)是 WPF 中的一种机制:
 当某个条件满足时,自动改变控件的某些属性,比如颜色、大小、透明度等。
换句话说,就是"如果……那么就……" 的一种规则。
常见触发器类型:
| 类型 | 说明 | 
|---|---|
Trigger | 依赖属性变化时触发 | 
DataTrigger | 绑定的数据变化时触发 | 
EventTrigger | 事件发生时触发 | 
MultiTrigger | 多个条件同时满足时触发 | 
MultiDataTrigger | 多个数据条件同时满足时触发 | 
1. Trigger —— 属性值触发(最基础)
 
例如,当按钮被鼠标悬停(IsMouseOver = true)时,改变背景色:
<Button Content="鼠标悬停变色"><Button.Style><Style TargetType="Button"><Style.Triggers><Trigger Property="IsMouseOver" Value="True"> <!--Is... 触发条件--><Setter Property="Background" Value="LightGreen"/><Setter Property="Foreground" Value="DarkBlue"/></Trigger></Style.Triggers></Style></Button.Style>
</Button>
 
✅ 效果:鼠标悬停到按钮上时,按钮背景变绿、文字变蓝。
相关属性:
| 属性 / 子元素 | 类型 | 说明 | 
|---|---|---|
Property | DependencyProperty | 触发器监听的属性(比如 IsMouseOver) | 
Value | object | 当 Property 的值等于这个 Value 时触发 | 
Setters | 集合(Setter) | 满足条件后要应用的一组属性修改(比如改颜色、改大小) | 
EnterActions | 集合(TriggerAction) | 当进入触发状态时执行的动作(比如动画) | 
ExitActions | 集合(TriggerAction) | 当离开触发状态时执行的动作 | 
常用条件:
属性触发器(PropertyTrigger)常用条件:
| 属性名 | 说明 | 
|---|---|
IsMouseOver | 鼠标悬停在控件上时为 True | 
IsPressed | 按钮等控件被按下时为 True | 
IsEnabled | 控件是否启用(禁用时为 False) | 
IsFocused | 控件是否获得焦点(获取为 True) | 
IsChecked | 复选框(CheckBox)、单选按钮(RadioButton)是否选中 | 
IsSelected | 列表项(ListBoxItem、TabItem等)是否被选中 | 
Visibility | 控件是否可见(Visible / Hidden / Collapsed) | 
IsReadOnly | 文本框(TextBox)是否只读 | 
Orientation | StackPanel等控件的方向(Horizontal / Vertical) | 
2. DataTrigger —— 数据变化触发
 
当绑定的数据满足某条件时,触发样式改变。
例子:如果按钮绑定的某个值是 "危险",就变成红色。
<Button Content="按钮" Tag="危险"><Button.Style><Style TargetType="Button"><Style.Triggers><DataTrigger Binding="{Binding Tag, RelativeSource={RelativeSource Self}}" Value="危险"><Setter Property="Background" Value="Red"/></DataTrigger></Style.Triggers></Style></Button.Style>
</Button>
 
✅ Tag 属性是 “危险” 时,按钮背景变红。
常用条件
DataTrigger 用于根据绑定到的数据(DataContext)变化触发,比如:
| 绑定属性 | 说明 | 
|---|---|
| 自定义属性值 | 比如某个 ViewModel 中的 Status == "完成" | 
| 布尔型标志 | 比如 IsLoading == true | 
| 数值型、字符串型比较 | 比如 Level > 5(需要结合 Converter 实现) | 
3. EventTrigger —— 事件发生时触发动作(一般配合动画)
 
例子:当按钮加载完毕(Loaded 事件),让按钮慢慢变大:
<Button Content="加载放大按钮"><Button.Triggers><EventTrigger RoutedEvent="Button.Loaded"><BeginStoryboard> <!--动画--><Storyboard><DoubleAnimation Storyboard.TargetProperty="Width"From="100" To="200" Duration="0:0:2"/></Storyboard></BeginStoryboard></EventTrigger></Button.Triggers>
</Button>
 
✅ 效果:按钮出现后,2秒内宽度从100变到200。
主要属性
| 属性 / 子元素 | 类型 | 说明 | 
|---|---|---|
RoutedEvent | RoutedEvent 类型 | 要监听的事件(比如 Button.ClickEvent) | 
SourceName | string(可选) | 指定事件来源控件的名字(通常用于模板中) | 
Actions | 集合(TriggerAction) | 事件触发时要执行的动作,通常是开始动画(BeginStoryboard) | 
- RoutedEvent:必填!指定要监听哪个路由事件。
 
<!--当按钮被点击时触发。-->
<EventTrigger RoutedEvent="Button.Click">
 
-  
SourceName:(可选)指定事件来源控件的名字
-  
如果要监听的事件是来自模板中另一个控件,需要指定它的
x:Name。 -  
通常用在
ControlTemplate或DataTemplate内。 
 -  
 
<!--监听名为 `InnerBorder` 的元素的鼠标进入事件。-->
<EventTrigger RoutedEvent="MouseEnter" SourceName="InnerBorder">
 
- Actions:当事件发生时执行的动作。 
BeginStoryboard:开始一个动画StopStoryboard:停止一个动画PauseStoryboard:暂停动画ResumeStoryboard:恢复动画
 
<!--当事件触发时,执行透明度变化动画。-->
<BeginStoryboard><Storyboard><DoubleAnimation Storyboard.TargetProperty="Opacity" To="0.5" Duration="0:0:0.3"/></Storyboard>
</BeginStoryboard>
 
4. MultiTrigger —— 多属性同时满足触发
 
例子:按钮被禁用(IsEnabled = False)且鼠标悬停时,背景变灰:
<Button Content="多条件触发按钮" IsEnabled="False"><Button.Style><Style TargetType="Button"><Style.Triggers><MultiTrigger><MultiTrigger.Conditions><Condition Property="IsMouseOver" Value="True"/><Condition Property="IsEnabled" Value="False"/></MultiTrigger.Conditions><Setter Property="Background" Value="Gray"/></MultiTrigger></Style.Triggers></Style></Button.Style>
</Button>
 
✅ 效果:按钮同时满足两种状态,才改变样式。
相关属性
| 属性/子元素 | 类型 | 说明 | 
|---|---|---|
Conditions | 集合(Condition) | 定义多个条件,必须全部同时满足才触发 | 
Setters | 集合(Setter) | 满足条件后要改变的属性 | 
EnterActions(可选) | 集合(TriggerAction) | 进入触发状态时执行的动作(如动画) | 
ExitActions(可选) | 集合(TriggerAction) | 离开触发状态时执行的动作 | 
| 使用小技巧 | 说明 | 
|---|---|
尽量用 Style 包裹触发器 | 让界面更整洁、好维护 | 
配合 ControlTemplate | 自定义控件外观时,触发器更强大 | 
用 Storyboard 让触发更有动效 | 比如渐变色、放大缩小动画 |