本文摘要:
    1:属性触发器;
    2:数据触发器;
    3:事件触发器;

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


一:属性触发器

    查看代码片段1:

   <Style TargetType="ListBoxItem">
<Setter Property="Opacity" Value="0.5" />
<Setter Property="MaxHeight" Value="75" />
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Trigger.Setters>
<Setter Property="Opacity" Value="1.0" />
</Trigger.Setters>
</Trigger>
</Style.Triggers>
</Style>

表示在ListBoxItem的IsSelected属性变为True的时候,其另外一个属性Opacity的值变为1.0。

1.1单个触发器
    代码片段1就是单个触发器。

1.2多个触发器

    可以为ListBoxItem设置多个触发器。

1.3多条件属性触发器

    多条件触发器就是说,同时满足几个条件的时候才触发行为。
    如代码片段2:

               <MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsFocused" Value="True"></Condition>
<Condition Property="Content" Value="{x:Null}"></Condition>
</MultiTrigger.Conditions>
<Setter Property="ToolTip" Value="content is null!"></Setter>
</MultiTrigger>

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

       <Window.Resources>
<c:Places x:Key="PlacesData"/> <Style TargetType="ListBoxItem">
<Style.Triggers>
<DataTrigger Binding="{Binding Path=State}" Value="WA">
<Setter Property="Foreground" Value="Red" />
</DataTrigger>
<MultiDataTrigger>
<MultiDataTrigger.Conditions>
<Condition Binding="{Binding Path=Name}" Value="Portland" />
<Condition Binding="{Binding Path=State}" Value="OR" />
</MultiDataTrigger.Conditions>
<Setter Property="Background" Value="Cyan" />
</MultiDataTrigger>
</Style.Triggers>
</Style> <DataTemplate DataType="{x:Type c:Place}">
<Canvas Width="160" Height="20">
<TextBlock FontSize="12"
Width="130" Canvas.Left="0" Text="{Binding Path=Name}"/>
<TextBlock FontSize="12" Width="30"
Canvas.Left="130" Text="{Binding Path=State}"/>
</Canvas>
</DataTemplate>
</Window.Resources> <StackPanel>
<TextBlock FontSize="18" Margin="5" FontWeight="Bold"
HorizontalAlignment="Center">Data Trigger Sample</TextBlock>
<ListBox Width="180" HorizontalAlignment="Center" Background="Honeydew"
ItemsSource="{Binding Source={StaticResource PlacesData}}"/>
</StackPanel>

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

2.2多条件触发

    以上的MultiDataTrigger就是一个多条件触发器。


三:事件触发器

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

    <Style TargetType="ListBoxItem">
<Setter Property="Opacity" Value="0.5" />
<Setter Property="MaxHeight" Value="75" />
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Trigger.Setters>
<Setter Property="Opacity" Value="1.0" />
</Trigger.Setters>
</Trigger>
<EventTrigger RoutedEvent="Mouse.MouseEnter">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
Duration="0:0:0.2"
Storyboard.TargetProperty="MaxHeight"
To="90" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
<EventTrigger RoutedEvent="Mouse.MouseLeave">
<EventTrigger.Actions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
Duration="0:0:1"
Storyboard.TargetProperty="MaxHeight" />
</Storyboard>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Style.Triggers>
</Style>

Style、ControlTemplate 和 DataTemplate 触发器的更多相关文章

  1. ControlTemplate,ItemsPanelTemplate,DataTemplate(wpf)

    在WPF中有三大模板ControlTemplate,ItemsPanelTemplate,DataTemplate.其中ControlTemplate和ItemsPanelTemplate是控件模板, ...

  2. 背水一战 Windows 10 (6) - 控件 UI: 字体的自动继承的特性, Style, ControlTemplate

    [源码下载] 背水一战 Windows 10 (6) - 控件 UI: 字体的自动继承的特性, Style, ControlTemplate 作者:webabcd 介绍背水一战 Windows 10 ...

  3. 重新想象 Windows 8 Store Apps (15) - 控件 UI: 字体继承, Style, ControlTemplate, SystemResource, VisualState, VisualStateManager

    原文:重新想象 Windows 8 Store Apps (15) - 控件 UI: 字体继承, Style, ControlTemplate, SystemResource, VisualState ...

  4. 背水一战 Windows 10 (76) - 控件(控件基类): Control - 基础知识, 焦点相关, 运行时获取 ControlTemplate 和 DataTemplate 中的元素

    [源码下载] 背水一战 Windows 10 (76) - 控件(控件基类): Control - 基础知识, 焦点相关, 运行时获取 ControlTemplate 和 DataTemplate 中 ...

  5. wpf中在style的template寻找ControlTemplate和DataTemplate的控件

    一.WPF中的两棵树 WPF中每个控件的Template都是由ControlTemplate构成,ControlTemplate包含了构成该控件的各种子控件,这些子控件就构成了VisualTree:而 ...

  6. WPF : ControlTemplate和DataTemplate的区别

    ControlTemplate用于描述控件本身. 使用TemplateBinding来绑定控件自身的属性, 比如{TemplateBinding Background}DataTemplate用于描述 ...

  7. 控件 UI: 字体的自动继承的特性, Style, ControlTemplate

    字体的自动继承的特性 Style 样式 ControlTemplate 控件模板 示例1.演示字体的自动继承的特性Controls/UI/FontInherit.xaml <Page x:Cla ...

  8. WPF中ControlTemplate和DataTemplate的区别

    下面代码很好的解释了它们之间的区别: <Window x:Class="WPFTestMe.Window12" xmlns="http://schemas.micr ...

  9. WPF的ControlTemplate和DataTemplate简介

    首先理清几个概念,Template.ControlTemplate.ContentTemplate.DataTemplate.ContentControl 这几个东西名字都差不多,意思感觉也接近,初次 ...

随机推荐

  1. python 字符串的I/O 操作

    想使用操作类文件对象的程序来操作文本或二进制字符串 使用io.StringIO() 和io.BytesIO() 类来创建类文件对象操作字符串数据 >>> s = io.StringI ...

  2. Linux命令: 查找文件中的字符串

    ①cat filename | grep 'string' ②编辑模式查找,/string, 依次敲入下面的命令 vim filename e i ESC /string 从光标位置开始往后查找第一个 ...

  3. MyEclipse 相关设置

    1. MyElipse复制项目后,修改项目的发布名称的方式.右击你的项目,选择 properties -- > MyElipse -- > web,然后修改名称即可. 2. IDE查看源代 ...

  4. Linux基础命令---head

    head 显示文件开头的几行,默认显示10行,可以使用选项-n来指定行数.此命令的适用范围:RedHat.RHEL.Ubuntu.CentOS.SUSE.openSUSE.Fedora. 1.语法   ...

  5. linux服务器---安装swat

    安装swat swat是一个图形化的samba管理软件,可以帮助不熟悉的人去灵活的配置samba服务, 1.安装swat [root@localhost wj]#yum install -y samb ...

  6. 基于webview的Hybrid app和React Native及html5

    基于webview的Hybrid app和React Native及html5 React Native 结合了 Web 应用和 Native 应用的优势,可以使用 JavaScript 来开发 iO ...

  7. AI+教育落地,百度大脑如何让校园更智能?

    人工智能作为影响社会底层技术革命逐渐向传统行业渗透,“AI+”已经替代“互联网+”成为创业创新的新引擎,出人意料的是,在AI在教育业的率先落地并且相当火爆. 现在,人工智能教育已成为从业者心目中的“教 ...

  8. 基础知识 - Golang 中的格式化输入输出

    ------------------------------------------------------------ [格式化输出] // 格式化输出:将 arg 列表中的 arg 转换为字符串输 ...

  9. 20145330 《网络对抗》 Web基础

    20145330 <网络对抗> Web基础 1.实践内容 (1)Web前端HTML (2)Web前端javascipt (3)Web后端:MySQL基础:正常安装.启动MySQL,建库.创 ...

  10. FTP-Linux中ftp服务器搭建

    一.FTP工作原理 (1)FTP使用端口 [root@localhost ~]# cat /etc/services | grep ftp ftp-data 20/tcp #数据链路:端口20 ftp ...