WPF 触发器

347 阅读2分钟

WPF中的触发器

在WPF中,触发器(Triggers) 是用于响应控件或元素的属性值变化而执行特定操作的机制。WPF提供了多种类型的触发器,每种触发器都有不同的用途。

  • Trigger(属性触发器) :这是最常用的触发器,它基于控件的某个属性值的变化来执行操作。
  • DataTrigger(数据触发器):是基于绑定到控件的属性值的变化触发操作。适用于需要根据数据模型的值来改变控件的表现的情况。
  • EventTrigger(事件触发器):是基于控件的事件来触发动作。例如,当按钮被点击时,可以触发动画或其他行为。
  • MultiTrigger(多条件触发器):是用于当多个条件满足时,触发某个动作。你可以在同一个触发器中定义多个条件。
  • MultiDataTrigger(多条件数据触发器):是一种特殊的触发器,它允许你同时基于多个数据绑定的条件来触发某个动作。这种触发器在你需要根据多个绑定的属性值来执行特定行为时非常有用。

Trigger 属性触发器

<Button Content="这是按钮">
    <Button.Style>
        <Style TargetType="Button">
            <Style.Triggers>
                <!-- 当鼠标移入时,按钮颜色变成蓝色 -->
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Foreground" Value="Blue"/>
                </Trigger>
                <!-- 当鼠标移出时,按钮颜色变成绿色 -->
                <Trigger Property="IsMouseOver" Value="False">
                    <Setter Property="Foreground" Value="Green"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Button.Style>
</Button>

DataTrigger 数据触发器

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <BooleanToVisibilityConverter x:Key="BoolToVis" />
    </Window.Resources>

    <Grid>
        <Button Content="这是按钮">
            <Button.Style>
                <Style TargetType="Button">
                    <Style.Triggers>
                        <!-- 基于绑定数据改变按钮的可见性 -->
                        <DataTrigger Binding="{Binding IsVisible}" Value="False">
                            <Setter Property="Visibility" Value="Collapsed"/>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Button.Style>
            <!-- 也可以简写成这样 -->
            <Button Content="这是另外的按钮" Visibility="{Binding IsVisible}" />
        </Button>
    </Grid>
</Window>

EventTrigger 事件触发器

<Button Content="这是按钮">
    <Button.Style>
        <Style TargetType="Button">
            <Style.Triggers>
                <!-- 当按钮被点击时,背景颜色会平滑过渡到红色 -->
                <EventTrigger RoutedEvent="Button.Click">
                    <!-- 开始故事板 -->
                    <BeginStoryboard>
                        <Storyboard>
                            <!-- 颜色动画 -->
                            <ColorAnimation 
                                Storyboard.TargetProperty="(Button.Background).(SolidColorBrush.Color)" 
                                To="Red" Duration="0:0:1"/>
                        </Storyboard>
                    </BeginStoryboard>
                </EventTrigger>
            </Style.Triggers>
        </Style>
    </Button.Style>
</Button>

MultiTrigger 多条件触发器

<Button Content="Click me">
    <Button.Style>
        <Style TargetType="Button">
            <Style.Triggers>
                <MultiTrigger>
                    <!-- 当鼠标悬停并且按钮的IsEnabled属性为True时 -->
                    <MultiTrigger.Conditions>
                        <Condition Property="IsMouseOver" Value="True"/>
                        <Condition Property="IsEnabled" Value="True"/>
                    </MultiTrigger.Conditions>
                    <Setter Property="Background" Value="Green"/>
                </MultiTrigger>
            </Style.Triggers>
        </Style>
    </Button.Style>
</Button>

MultiDataTrigger 多条件数据触发器

<Window x:Class="WpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">

    <Window.DataContext>
        <local:Person IsEnabled="True" Age="25"/>
    </Window.DataContext>

    <Grid>
        <Button Content="Click me" Width="200" Height="50">
            <Button.Style>
                <Style TargetType="Button">
                    <Style.Triggers>
                        <!-- 使用 MultiDataTrigger 来检查多个绑定属性 -->
                        <MultiDataTrigger>
                            <MultiDataTrigger.Conditions>
                                <Condition Binding="{Binding IsEnabled}" Value="True"/>
                                <Condition Binding="{Binding Age}" Value="25"/>
                            </MultiDataTrigger.Conditions>
                            <Setter Property="Background" Value="Green"/>
                        </MultiDataTrigger>
                    </Style.Triggers>
                </Style>
            </Button.Style>
        </Button>
    </Grid>
</Window>