WPF触发器(Trigger、DataTrigger、EventTrigger)

WPF中有种叫做触发器的东西(记住不是数据库的trigger哦)。它的主要作用是根据trigger的不同条件来自动更改外观属性,或者执行动画等操作。

  WPFtrigger的主要类型有:Trigger、MultiTrigger、DataTrigger、MultiDataTrigger、EventTrigger几种。从字面意思上我们想大家已经知道个大概,接下来我将还会用实例代码逐一进行介绍。trigger主要运用的场景在Style、ControlTemplate、DataTemplate三个地方。在这些地方可以使用trigger,具体视情况而定。

  1.在Style中使用各种trigger

  在style中使用的trigger主要是属性的触发器,当属性的值发生改变是将会引发触发器。

  a.普通属性trigger 当鼠标滑过时字体变成红色

<CheckBox Content="Style Trigger MouseOver Red">             <CheckBox.Resources>                 <Style TargetType="{x:Type CheckBox}">                     <Setter Property="Foreground" Value="SkyBlue"/>                     <Style.Triggers>                         <!--鼠标滑过时字体为红色-->                         <Trigger Property="IsMouseOver" Value="True">                             <Setter Property="Foreground" Value="Red"/>                         </Trigger>                     </Style.Triggers>                 </Style>             </CheckBox.Resources>         </CheckBox>

  b.普通属性MultiTrigger 当checkbox勾选并且鼠标滑过时字体变成绿色

<CheckBox Content="Style MultiTrigger Checked and MouseOver Green ">             <CheckBox.Resources>                 <Style TargetType="{x:Type CheckBox}">                     <Setter Property="Foreground" Value="SkyBlue"/>                     <Style.Triggers>                         <MultiTrigger>                             <MultiTrigger.Conditions>                                 <Condition Property="IsChecked" Value="True" />                                 <Condition Property="IsMouseOver" Value="True" />                             </MultiTrigger.Conditions>                             <Setter Property="Foreground" Value="Green"/>                         </MultiTrigger>                     </Style.Triggers>                 </Style>             </CheckBox.Resources>         </CheckBox>

  c.EventTrigger 鼠标划入长度变长 鼠标移出 长度变短

 <CheckBox Content="Style EventTrigger " Width="70" HorizontalAlignment="Left">             <CheckBox.Resources>                 <Style TargetType="{x:Type CheckBox}">                     <Setter Property="Foreground" Value="SkyBlue"/>                     <Style.Triggers>                         <EventTrigger RoutedEvent="Mouse.MouseEnter">                             <EventTrigger.Actions>                                 <BeginStoryboard>                                     <Storyboard>                                         <DoubleAnimation                                           Duration="0:0:0.2"                                           Storyboard.TargetProperty="Width"                                           To="150"  />                                     </Storyboard>                                 </BeginStoryboard>                             </EventTrigger.Actions>                         </EventTrigger>                         <EventTrigger RoutedEvent="Mouse.MouseLeave">                             <EventTrigger.Actions>                                 <BeginStoryboard>                                     <Storyboard>                                         <DoubleAnimation                                           Duration="0:0:0.2"                                           Storyboard.TargetProperty="Width"                                           To="70"  />                                     </Storyboard>                                 </BeginStoryboard>                             </EventTrigger.Actions>                         </EventTrigger>                     </Style.Triggers>                 </Style>             </CheckBox.Resources>         </CheckBox>

  2.在ControlTemplate中使用trigger

  在ControlTemplate中使用的trigger主要是在controltemplate中的元素的触发器,当属性的值发生改变是将会引发触发器。

  属性为“Border” 的鼠标滑过时背景变色,其他的trigger同上面的style一样 这里就不多举例了

<Button Content="ControlTemplate" Width="120" Height="30">             <Button.Resources>                 <Style TargetType="{x:Type Button}">                     <Setter Property="Background" Value="Gray"/>                     <Setter Property="BorderBrush" Value="Black"/>                     <Setter Property="Cursor" Value="Hand"/>                     <Setter Property="Template">                         <Setter.Value>                             <ControlTemplate TargetType="{x:Type Button}">                                 <StackPanel>                                     <Border Height="10" Background="Red"></Border>                                     <Border x:Name="Border" CornerRadius="0" BorderThickness="1"  Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}">                                         <ContentPresenter VerticalAlignment="Center" HorizontalAlignment="Center"/>                                     </Border>                                 </StackPanel>                                                                  <ControlTemplate.Triggers>                                     <Trigger Property="IsMouseOver" Value="True">                                         <Setter TargetName="Border" Property="Background" Value="#FFC2E0FF"/>                                         <Setter TargetName="Border" Property="BorderBrush" Value="#FF3399FF"/>                                     </Trigger>                                 </ControlTemplate.Triggers>                             </ControlTemplate>                         </Setter.Value>                     </Setter>                 </Style>             </Button.Resources>         </Button>

  3.在DataTemplate中使用trigger

  在DataTemplate中使用trigger可以根据绑定的数据不同显示不同的内容。

<TreeView Name="_tree" Margin="0" BorderThickness="0" VerticalAlignment="Stretch" Background="Transparent" ItemsSource="{Binding Children}" >                 <TreeView.ItemTemplate>                     <HierarchicalDataTemplate ItemsSource="{Binding Children}">                         <Border CornerRadius="0" Margin="1"  x:Name="back" MinWidth="70"                                 Background="Transparent" DataContext="{Binding}" PreviewMouseMove="TreeItem_PreviewMouseMove">                             <StackPanel Orientation="Horizontal" Margin="2">                                 <Image x:Name="BGimage" Source="/Vdc3D.Coms.DModelEditor;component/Images/item.png" Height="15" Width="15" />                                 <TextBlock Text="{Binding ShowText}" Margin="2 0"/>                             </StackPanel>                             <Border.ContextMenu>                                 <ContextMenu x:Name="menu" >                                     <MenuItem Header="Add Directory" x:Name="menu_addDir" Click="AddDir_Click" DataContext="{Binding}"/>                                     <MenuItem Header="Add Property" x:Name="menu_addChild"  Click="AddChild_Click" DataContext="{Binding}"/>                                     <MenuItem Header="Edit" Click="Modify_Click" DataContext="{Binding}"/>                                     <MenuItem Header="Delete" Click="Delete_Click" DataContext="{Binding}"/>                                 </ContextMenu>                             </Border.ContextMenu>                         </Border>                         <HierarchicalDataTemplate.Triggers>                             <MultiDataTrigger>                                 <MultiDataTrigger.Conditions>                                     <Condition Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type TreeViewItem}},Path=IsExpanded}"  Value="False"/>                                     <Condition Binding="{Binding IsDir}" Value="True"/>                                 </MultiDataTrigger.Conditions>                                 <MultiDataTrigger.Setters>                                     <Setter TargetName="BGimage" Property="Source" Value="/Vdc3D.Coms.DModelEditor;component/Images/dir.png" />                                 </MultiDataTrigger.Setters>                             </MultiDataTrigger>                             <MultiDataTrigger>                                 <MultiDataTrigger.Conditions>                                     <Condition Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type TreeViewItem}},Path=IsExpanded}"  Value="True"/>                                     <Condition Binding="{Binding IsDir}" Value="True"/>                                 </MultiDataTrigger.Conditions>                                 <MultiDataTrigger.Setters>                                     <Setter TargetName="BGimage" Property="Source" Value="/Vdc3D.Coms.DModelEditor;component/Images/dir_open.png" />                                 </MultiDataTrigger.Setters>                             </MultiDataTrigger>                             <DataTrigger Binding="{Binding IsDir}" Value="True">                                 <Setter TargetName="menu_addDir"  Property="Visibility" Value="Visible"/>                                 <Setter TargetName="menu_addChild"  Property="Visibility" Value="Visible"/>                             </DataTrigger>                             <DataTrigger Binding="{Binding IsDir}" Value="False">                                 <Setter TargetName="menu_addDir"  Property="Visibility" Value="Collapsed"/>                                 <Setter TargetName="menu_addChild"  Property="Visibility" Value="Collapsed"/>                             </DataTrigger>                         </HierarchicalDataTemplate.Triggers>                     </HierarchicalDataTemplate>                 </TreeView.ItemTemplate>             </TreeView>

  这是一个treeview控件 根据绑定的isdir值不同 可以显示icon是一个目录(文件夹)或者是一个文件,看是不是很简单呢

  以上只是简单的介绍了trigger的一些用法,具体的功能大家可以自由发挥,这也是wpf的强大之处

  本文来自lhx527099095的博客,原文地址:http://blog.csdn.net/lhx527099095/article/details/8029207

WPF快速指导6:触发器     本文摘要:     1:属性触发器;     2:数据触发器;     3:事件触发器;

Style、ControlTemplate 和 DataTemplate 都有触发器集合。     属性触发器只检查WPF从属属性,而数据触发器则可检查任何一种可绑定的属性。属性触发器一般用来检查WPF可视元素的属性,而数据触发器则通常用来检查不可视对象的属性。     属性触发器:通过此机制,一个属性的更改会在另一个属性中触发即时或动态更改。     数据触发器:通过此机制,事件会在属性中触发动态更改。     数据触发器:EventTrigger,它根据事件的引发来启动一组操作,但这类操作仅限于动画。

一:属性触发器     查看代码片段1:

  1. <Style TargetType="ListBoxItem">
  2. <Setter Property="Opacity" Value="0.5" />
  3. <Setter Property="MaxHeight" Value="75" />
  4. <Style.Triggers>
  5. <Trigger Property="IsSelected" Value="True">
  6. <Trigger.Setters>
  7. <Setter Property="Opacity" Value="1.0" />
  8. </Trigger.Setters>
  9. </Trigger>
  10. </Style.Triggers>
  11. </Style>

表示在ListBoxItem的IsSelected属性变为True的时候,其另外一个属性Opacity的值变为1.0。 1.1单个触发器     代码片段1就是单个触发器。 1.2多个触发器     可以为ListBoxItem设置多个触发器。 1.3多条件属性触发器     多条件触发器就是说,同时满足几个条件的时候才触发行为。     如代码片段2:

  1. <MultiTrigger>
  2. <MultiTrigger.Conditions>
  3. <Condition Property="IsFocused" Value="True"></Condition>
  4. <Condition Property="Content" Value="{x:Null}"></Condition>
  5. </MultiTrigger.Conditions>
  6. <Setter Property="ToolTip" Value="content is null!"></Setter>
  7. </MultiTrigger>

二:数据触发器     使用 DataTrigger,可以在数据对象的属性值与指定的 Value 匹配时设置属性值。例如,在显示 Employee 对象列表时,可能希望前景色根据每个 Employee 的当前出勤情况而变化。(例如,用紫色前景色显示当前正在休假的 Employee。)     查看代码片段3

  1. <Window.Resources>
  2. <c:Places x:Key="PlacesData"/>
  3.  
  4. <Style TargetType="ListBoxItem">
  5. <Style.Triggers>
  6. <DataTrigger Binding="{Binding Path=State}" Value="WA">
  7. <Setter Property="Foreground" Value="Red" />
  8. </DataTrigger>
  9. <MultiDataTrigger>
  10. <MultiDataTrigger.Conditions>
  11. <Condition Binding="{Binding Path=Name}" Value="Portland" />
  12. <Condition Binding="{Binding Path=State}" Value="OR" />
  13. </MultiDataTrigger.Conditions>
  14. <Setter Property="Background" Value="Cyan" />
  15. </MultiDataTrigger>
  16. </Style.Triggers>
  17. </Style>
  18.  
  19. <DataTemplate DataType="{x:Type c:Place}">
  20. <Canvas Width="160" Height="20">
  21. <TextBlock FontSize="12"
  22. Width="130" Canvas.Left="0" Text="{Binding Path=Name}"/>
  23. <TextBlock FontSize="12" Width="30"
  24. Canvas.Left="130" Text="{Binding Path=State}"/>
  25. </Canvas>
  26. </DataTemplate>
  27. </Window.Resources>
  28.  
  29. <StackPanel>
  30. <TextBlock FontSize="18" Margin="5" FontWeight="Bold"
  31. HorizontalAlignment="Center">Data Trigger Sample</TextBlock>
  32. <ListBox Width="180" HorizontalAlignment="Center" Background="Honeydew"
  33. ItemsSource="{Binding Source={StaticResource PlacesData}}"/>
  34. </StackPanel>

2.1单条件触发     以上的DataTrigger就是一个单条件触发器。 2.2多条件触发     以上的MultiDataTrigger就是一个多条件触发器。

三:事件触发器     属性触发器用来检查从属属性的值,数据触发器用来检查CLR属性的值,而事件触发器用来监视事件。当一个事件发生的时候,事件触发器就会通过引发相关的动画事件来响应。     如代码片段4:

  1. <Style TargetType="ListBoxItem">
  2. <Setter Property="Opacity" Value="0.5" />
  3. <Setter Property="MaxHeight" Value="75" />
  4. <Style.Triggers>
  5. <Trigger Property="IsSelected" Value="True">
  6. <Trigger.Setters>
  7. <Setter Property="Opacity" Value="1.0" />
  8. </Trigger.Setters>
  9. </Trigger>
  10. <EventTrigger RoutedEvent="Mouse.MouseEnter">
  11. <EventTrigger.Actions>
  12. <BeginStoryboard>
  13. <Storyboard>
  14. <DoubleAnimation
  15. Duration="0:0:0.2"
  16. Storyboard.TargetProperty="MaxHeight"
  17. To="90" />
  18. </Storyboard>
  19. </BeginStoryboard>
  20. </EventTrigger.Actions>
  21. </EventTrigger>
  22. <EventTrigger RoutedEvent="Mouse.MouseLeave">
  23. <EventTrigger.Actions>
  24. <BeginStoryboard>
  25. <Storyboard>
  26. <DoubleAnimation
  27. Duration="0:0:1"
  28. Storyboard.TargetProperty="MaxHeight" />
  29. </Storyboard>
  30. </BeginStoryboard>
  31. </EventTrigger.Actions>
  32. </EventTrigger>
  33. </Style.Triggers>
  34. </Style>
 
 
 
标签: C#, WPF
 

WPF触发器(Trigger)的更多相关文章

  1. WPF触发器(Trigger、DataTrigger、EventTrigger)

    WPF中有种叫做触发器的东西(记住不是数据库的trigger哦).它的主要作用是根据trigger的不同条件来自动更改外观属性,或者执行动画等操作. WPFtrigger的主要类型有:Trigger. ...

  2. WPF触发器(Trigger) - DataTrigger

    官方文档中对DataTrigger的介绍 Represents a trigger that applies property values or performs actions when the ...

  3. WPF 杂谈——Trigger触发器

    笔者在使用的WPF过程中,见过的触发器有三种:Trigger.DataTrigger.EventTrigger.其中最为常用的要属Trigger.至于触发器的作用就是当某个属性的值发生变化,应该去做某 ...

  4. WPF根据ScrollViewer的滚动条出现与否来设置触发器Trigger

    先看一段代码 <Style.Triggers> <DataTrigger Binding="{Binding RelativeSource={RelativeSource ...

  5. WPF触发器(非数据库中的触发器)

    一.什么是触发器?触发器(Trigger)就是当某种条件满足后即完成相应逻辑功能的一部分程序组成.在当前的WPF中,Trigger一共有三种类型,它们分别是: (1)属性触发器:其对应的类是Trigg ...

  6. WPF 触发器例子

    WPF的触发器很强大,这里简单附上触发器的一个小例子,分别用XMAL和CS代码来实现一个功能,鼠标悬停在button上时改变字体颜色 1.XMAL代码如下: <Window x:Class=&q ...

  7. mysql之触发器trigger

    触发器(trigger):监视某种情况,并触发某种操作. 触发器创建语法四要素:1.监视地点(table) 2.监视事件(insert/update/delete) 3.触发时间(after/befo ...

  8. mysql之触发器trigger 详解

    为了梦想,努力奋斗! 追求卓越,成功就会在不经意间追上你 mysql之触发器trigger 触发器(trigger):监视某种情况,并触发某种操作. 触发器创建语法四要素:1.监视地点(table)  ...

  9. mysql之触发器trigger(1)

    触发器(trigger):监视某种情况,并触发某种操作. 触发器创建语法四要素:1.监视地点(table) 2.监视事件(insert/update/delete) 3.触发时间(after/befo ...

随机推荐

  1. spring动态创建数据源

    在最近的项目业务中,需要在程序的运行过程中,添加新的数据库添链接进来,然后从新数据库链接中读取数据. 网上查阅了资料,发现spring为多数据源提供了一个抽象类AbstractRoutingDataS ...

  2. Python3 tkinter基础 Listbox height 显示行数的上限

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...

  3. 日志统计 尺取法【蓝桥杯2018 C/C++ B组】

    标题:日志统计 小明维护着一个程序员论坛.现在他收集了一份"点赞"日志,日志共有N行.其中每一行的格式是: ts id 表示在ts时刻编号id的帖子收到一个"赞" ...

  4. ssm项目部署到服务器过程

    ssm项目部署到服务器过程 特别篇 由于准备春招,所以希望各位看客方便的话,能去github上面帮我Star一下项目 https://github.com/Draymonders/Campus-Sho ...

  5. SSM到Spring Boot从零开发校园商铺平台

    项目目的 特别 由于准备春招,所以希望各位看客方便的话,能去github上面帮我Star一下项目 https://github.com/Draymonders/Campus-Shop emmm, 已经 ...

  6. BZOJ 4159 [Neerc2009]Business Center

    思路 简单的模拟,答案就是\(min\{(\lfloor\frac{d\times n}{u+d}\rfloor+1)\times(u+d)-d\times n\}\) 代码 #include < ...

  7. UVA 11019 Matrix Matcher(哈希)

    题意 给定一个 \(n\times m\) 的矩阵,在给定一个 \(x\times y\) 的小矩阵,求小矩阵在大矩阵中出现的次数. \(1 \leq n,m \leq 1000\) \(1\leq ...

  8. Images之base image

    Create a base image Most Dockerfiles start from a parent image. If you need to completely control th ...

  9. 【转载】常用 Java 静态代码分析工具的分析与比较

    摘自:http://www.oschina.net/question/129540_23043常用 Java 静态代码分析工具的分析与比较 简介: 本文首先介绍了静态代码分析的基本概念及主要技术,随后 ...

  10. 网站项目所有js css无法引用问题解决方案

    网站页面中的所有js css引用失效,路径确保正确,但是浏览器就是报找不到引用.仔细查找发现问题所在: 报错信息很详细了,就是.NET Framework 版本不同导致.同时也提供了两个解决方案:将. ...