-
Notifications
You must be signed in to change notification settings - Fork 22
Trigger
L edited this page Mar 22, 2020
·
7 revisions
Trigger
MultiTrigger
DataTrigger
MultiDataTrigger
EventTrigger
<Grid>
<Grid.Resources>
<Style x:Key="ButtonStyle" TargetType="Button">
<Setter Property="Foreground" Value="DarkOrange"></Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Foreground" Value="DarkRed"></Setter>
</Trigger>
</Style.Triggers>
</Style>
</Grid.Resources>
<Button Content="鼠标滑过时,修改字体颜色" Style="{StaticResource ButtonStyle}"></Button>
</Grid>
指定触发的事件,触发事件之后执行的内容,这里写了两个动画效果
<CheckBox Content="随着鼠标划入划出,长度改变" HorizontalAlignment="Left" Width="70">
<CheckBox.Resources>
<Style TargetType="{x:Type CheckBox}">
<Setter Property="Foreground" Value="OrangeRed"></Setter>
<Style.Triggers>
<!--当鼠标划入,增加长度-->
<EventTrigger RoutedEvent="MouseEnter">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<!--这里设置了一个动画,持续时间是0.2秒,改变属性为Width,目标数值是200-->
<DoubleAnimation Duration="0:0:0.2"
Storyboard.TargetProperty="Width"
To="200"></DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
<!--当鼠标划出,减小长度-->
<EventTrigger RoutedEvent="MouseLeave">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Duration="0:0:0.2"
Storyboard.TargetProperty="Width"
To="70"></DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Style.Triggers>
</Style>
</CheckBox.Resources>
</CheckBox>
根据值,设置对应的效果
这里设置的是行头和单元格的效果,也可以设置为其他属性
<Window.Resources>
<!--单元格的样式-->
<Style TargetType="DataGridCell" x:Key="ColorCell">
<Style.Triggers>
<DataTrigger Binding="{Binding Type}" Value="0">
<Setter Property="Background" Value="Pink"></Setter>
</DataTrigger>
<DataTrigger Binding="{Binding Type}" Value="1">
<Setter Property="Background" Value="Coral"></Setter>
</DataTrigger>
<DataTrigger Binding="{Binding Type}" Value="2">
<Setter Property="Background" Value="Crimson"></Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</Window.Resources>
<Grid>
<DataGrid ItemsSource="{Binding }" AutoGenerateColumns="False">
<!--行头的样式-->
<DataGrid.RowHeaderStyle>
<Style TargetType="DataGridRowHeader">
<Style.Triggers>
<DataTrigger Binding="{Binding Type}" Value="0">
<Setter Property="Background" Value="Pink"></Setter>
</DataTrigger>
<DataTrigger Binding="{Binding Type}" Value="1">
<Setter Property="Background" Value="Coral"></Setter>
</DataTrigger>
<DataTrigger Binding="{Binding Type}" Value="2">
<Setter Property="Background" Value="Crimson"></Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</DataGrid.RowHeaderStyle>
<DataGrid.Columns>
<DataGridTextColumn Header="Type值" Width="*" Binding="{Binding TypeValue}"/>
<DataGridTextColumn Header="Type效果" Width="*" Binding="{Binding Type}" CellStyle="{StaticResource ColorCell}"/>
</DataGrid.Columns>
</DataGrid>
</Grid>
MultiTrigger是在满足一组条件时应用属性值或执行操作的触发器
在MultiTrigger.Conditions
中填写多个
触发条件,触发条件同时满足
时,执行MultiTrigger.Setters
中的内容
<Style TargetType="CheckBox" >
<Style.Triggers>
<MultiTrigger >
<MultiTrigger.Conditions>
<Condition Property="IsChecked"
Value="true" />
<Condition Property="Content"
Value="飞鸟相与还。"/>
</MultiTrigger.Conditions>
<MultiTrigger.Setters>
<Setter Property="FontSize" Value="20" />
<Setter Property="Foreground" Value="Blue" />
</MultiTrigger.Setters>
</MultiTrigger>
</Style.Triggers>
</Style>
<StackPanel Grid.Row="1">
<CheckBox Content="山气日夕佳,"/>
<CheckBox Content="飞鸟相与还。"/>
<CheckBox Content="此中有真意,"/>
<CheckBox Content="欲辨已忘言。"/>
</StackPanel>