Posted by: Zeeshan Amjad | August 21, 2009

Data Trigger in WPF


Data trigger is just like the property trigger. Data trigger monitors the value of some property and execute when some it meets with some specific value. It is important to not that data trigger can check the normal CLR properties. In other words it is not necessary to make those properties as a dependency properties. It means it can even check the value of non visual data element.

Here is one example of data trigger. We have a student class and this class contains the student name and grade information. Here is simple implementation of this class.

  1:     public class Student
  2:     {
  3:         public Student()
  4:         {
  5:         }
  6: 
  7:         public Student(String name, String grade)
  8:         {
  9:             StudentName = name;
 10:             Grade = grade;
 11:         }
 12: 
 13:         public String StudentName
 14:         { set; get; }
 15: 
 16:         public String Grade
 17:         { set; get; }
 18:     }
 19: 

In XAML we created one list control and bind the the list view with it. Here is a sample XAML code to bind properties with list control.

  1: <ListView Name="lstView">
  2: 	<ListView.View>
  3: 		<GridView>
  4: 			<GridViewColumn Width="180" Header="Student Name" DisplayMemberBinding="{Binding Path = StudentName}"></GridViewColumn>
  5: 			<GridViewColumn Width="180" Header="Grade" DisplayMemberBinding="{Binding Path = Grade}"></GridViewColumn>
  6: 		</GridView>
  7: 	</ListView.View>
  8: </ListView>
  9: 

Now if we want to change the color of the row if student fail, then we can do it with data trigger. Here is simple XAML code to apply perform this.

  1: <Style TargetType="{x:Type ListViewItem}">
  2: 	<Style.Triggers>
  3: 		<DataTrigger Binding="{Binding Grade}" Value="Fail">
  4: 			<Setter Property="Background" Value="Red"/>
  5: 			<Setter Property="Foreground" Value="White"/>
  6: 		</DataTrigger>
  7: 	</Style.Triggers>
  8: </Style>
  9: 

Here is complete XAML code of the program.

  1: <Window x:Class="TypeConvertor.Window1"
  2:     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  3:     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4:     Title="Data Trigger Demo" Height="300" Width="400" Loaded="Window_Loaded">
  5:     
  6:     <Window.Resources>
  7:         <Style TargetType="{x:Type ListViewItem}">
  8:             <Style.Triggers>
  9:                 <DataTrigger Binding="{Binding Grade}" Value="Fail">
 10:                     <Setter Property="Background" Value="Red"/>
 11:                     <Setter Property="Foreground" Value="White"/>
 12:                 </DataTrigger>
 13:             </Style.Triggers>
 14:         </Style>
 15:     </Window.Resources>
 16:     
 17:     <Grid>                
 18:         <ListView Name="lstView">
 19:             <ListView.View>
 20:                 <GridView>
 21:                     <GridViewColumn Width="180" Header="Student Name" DisplayMemberBinding="{Binding Path = StudentName}"></GridViewColumn>
 22:                     <GridViewColumn Width="180" Header="Grade" DisplayMemberBinding="{Binding Path = Grade}"></GridViewColumn>
 23:                 </GridView>
 24:             </ListView.View>
 25:         </ListView>
 26:     </Grid>
 27: </Window>
 28: 

And this is complete C# code to define student class and insert data into list control.

  1: using System;
  2: using System.Windows;
  3: using System.Windows.Controls;
  4: 
  5: namespace TypeConvertor
  6: {
  7:     /// <summary>
  8:     /// Interaction logic for Window1.xaml
  9:     /// </summary>
 10:     public partial class Window1 : Window
 11:     {
 12:         public Window1()
 13:         {
 14:             InitializeComponent();
 15:         }
 16: 
 17:         private void Window_Loaded(object sender, RoutedEventArgs e)
 18:         {
 19:             lstView.Items.Add(new Student("Alex", "Fail"));
 20:             lstView.Items.Add(new Student("Bob", "Pass"));
 21:             lstView.Items.Add(new Student("Smith", "Pass"));
 22:             lstView.Items.Add(new Student("Bill", "Pass"));
 23:             lstView.Items.Add(new Student("Tom", "Fail"));
 24:             lstView.Items.Add(new Student("Brandon", "Pass"));
 25:         }
 26:     }
 27: 
 28:     public class Student
 29:     {
 30:         public Student()
 31:         {
 32:         }
 33: 
 34:         public Student(String name, String grade)
 35:         {
 36:             StudentName = name;
 37:             Grade = grade;
 38:         }
 39: 
 40:         public String StudentName
 41:         { set; get; }
 42: 
 43:         public String Grade
 44:         { set; get; }
 45:     }
 46: }
 47: 

Here is the output of this program.

Trigger_02

Advertisements

Responses

  1. […] already saw few example of data trigger here and here. But sometimes we want to execute the negative condition. Such as trigger should execute […]


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Categories

%d bloggers like this: