Copyright notice: This article is an original article and follows
CC 4.0 BY-NC-ND
Copyright agreement. If you want to repost this article, please attach the original source link and this statement.
Source link:
https://www.v2know.com/MainPage/PreView/466
总目录：https://www.v2know.com/MainPage/Category/WPF
基本触发器
直接上代码：
<Window.Resources>
<Style x:Key="defaultStyle" TargetType="Button">
<Setter Property="FontSize" Value="30"/>
<Setter Property="Foreground" Value="Blue"/>
<Setter Property="Width" Value="100"/>
<Setter Property="Height" Value="40"/>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="Foreground" Value="Red"/>
<Setter Property="FontSize" Value="30"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="False">
<Setter Property="Foreground" Value="Blue"/>
<Setter Property="FontSize" Value="20"/>
</Trigger>
</Style.Triggers>
</Style>
</Window.Resources>
<Grid>
<StackPanel>
<Button Style="{StaticResource defaultStyle}" Content="Hello"/>
<Button Style="{StaticResource defaultStyle}" Content="Hello"/>
<Button Style="{StaticResource defaultStyle}" Content="Hello"/>
</StackPanel>
</Grid>
嘛，没什么好说的，既然你有Winform+HTML的基础，这种代码应该看得懂，不懂自己跑一遍罢。
还是稍微解释一下罢：
这是一个简单的触发器，它实现的功能是当鼠标移动到按钮的时候，触发第一个触发器使得字体变成红色，并放大到30，当离开的时候，触发第一个触发器，使得按钮还原。
接下来说多条件触发器。
多条件触发器
为什么会出现这个东西？
其实看了上面的代码，你应该发现了，你为了一个IsMouseOver事件，写了两个触发器，这样代码实在是太多了。
所以，有更好的解决方案，那就是“多条件触发器”。
“多条件触发器”顾名思义就是多条件，直接上代码：
<Window.Resources>
<Style x:Key="defaultStyle" TargetType="Button">
<Setter Property="Width" Value="100"/>
<Setter Property="Height" Value="40"/>
<Style.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True"/>
<Condition Property="IsFocused" Value="True" />
</MultiTrigger.Conditions>
<MultiTrigger.Setters>
<Setter Property="Foreground" Value="Red"/>
</MultiTrigger.Setters>
</MultiTrigger>
</Style.Triggers>
</Style>
</Window.Resources>
<Grid>
<StackPanel>
<Button Style="{StaticResource defaultStyle}" Content="Hello"/>
<Button Style="{StaticResource defaultStyle}" Content="Hello"/>
<Button Style="{StaticResource defaultStyle}" Content="Hello"/>
</StackPanel>
</Grid>
嘛，先不介绍上一套代码的简化版，继续看事件触发器。
事件触发器
直接上代码：
<Window.Resources>
<Style x:Key="defaultStyle" TargetType="Button">
<Setter Property="Width" Value="100"/>
<Setter Property="Height" Value="40"/>
<Style.Triggers>
<EventTrigger RoutedEvent="Mouse.MouseEnter">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation Duration="0:0:0.2"
Storyboard.TargetProperty="FontSize"
To="30"
>
</DoubleAnimation>
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Style.Triggers>
</Style>
</Window.Resources>
<Grid>
<StackPanel>
<Button Style="{StaticResource defaultStyle}" Content="Hello"/>
<Button Style="{StaticResource defaultStyle}" Content="Hello"/>
<Button Style="{StaticResource defaultStyle}" Content="Hello"/>
</StackPanel>
</Grid>
不解释，自己测试，因为你有Winform+Web Design的基础，也没啥好说的。
下一篇：WPF设计之控件模板
Today's comments have reached the limit. If you want to comment, please wait until tomorrow (UTC-Time).
There is 04h35m42s left until you can comment.