WPF—Triggers触发器

WPF—Triggers触发器

介绍 :

WPF提供了一个丰富和灵活的图形渲染框架，触发器（Triggers）是其中一个重要的功能。触发器能够用来控制或改变UI元素的属性、样式、甚至行为.        

触发器类型

Property Triggers	当某个依赖属性达到某个值时触发(列如: 点击或鼠标移入)
Data Triggers	当绑定到的数据满足某个条件时触发
Event Triggers	当某个事件被触发时进行相应的行为(用于动画操作)
MultiTriggers 和 MultiDataTriggers	当多个条件被满足时触发

Property Triggers实例 当某个依赖属性达到某个值时触发(列如: 点击或鼠标移入) 

介绍:

当UI元素的某个属性达到特定值时，Property Triggers会被触发。

// 当组件被点击时触发（TargetType: 设置相对应的标签类型）
<Button Content="点击我">
    <Button.Style>
        <Style TargetType="{x:Type Button}">
            <Style.Triggers>
                <Trigger Property="Click" Value="True">
                    <Setter Property="Background" Value="Yellow"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Button.Style>
</Button>

Data Triggers实例  当绑定到的数据满足某个条件时触发

介绍:

DataTrigger是一种在数据绑定的值满足特定条件时改变控件样式的触发器。DataTrigger的工作方式类似于常规的Trigger，但它们关联的是绑定的数据属性而不是依赖属性。

// 当TextBox标签的text属性绑定的数据为111时触发，将背景颜色改为pink
（TargetType: 设置相对应的标签类型）
    <Window.Resources>
        <Style TargetType="TextBox">
            <Style.Triggers>
                <DataTrigger Binding="{Binding Text, RelativeSource={RelativeSource Self}}" Value="111">
                    <Setter Property="Background" Value="Pink"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid>
        <TextBox Width="200" Height="30" Margin="20"/>
    </Grid>

Event Triggers实例： 当某个事件被触发时进行相应的行为(用于动画操作)

介绍:

用于触发一系列的动画或者行为。

// 当鼠标点击该标签时 触发动画效果
<Button Content="点击我">
    <Button.Triggers>
        <EventTrigger RoutedEvent="Button.Click">
            <BeginStoryboard>
                <Storyboard>
                    <!-- 动画效果 -->
                </Storyboard>
            </BeginStoryboard>
        </EventTrigger>
    </Button.Triggers>
</Button>

MultiTriggers 和 MultiDataTriggers实例  当多个条件被满足时触发

介绍:

当需要多个条件同时满足时使用。

// 当鼠标悬停在按钮上并且按钮处于可用状态时，按钮的背景变为粉红色。
(x:Key：用于设置触发器的键   |   TargetType : 用于设置对应的标签类型)
<Style x:Key="multiTriggerExample" TargetType="{x:Type Button}">
    <Style.Triggers>
        <MultiTrigger>
            <MultiTrigger.Conditions>
                <Condition Property="IsMouseOver" Value="True"/>
                <Condition Property="IsEnabled" Value="True"/>
            </MultiTrigger.Conditions>
            <Setter Property="Background" Value="Pink"/>
        </MultiTrigger>
    </Style.Triggers>
</Style>

// 在button标签中调用该触发器的键
<Button Content="测试按钮" Style="{StaticResource multiTriggerExample}">
</Button>