Posted by: Zeeshan Amjad | August 25, 2009

Multi Data Trigger in WPF


We can apply logical operators in data triggers too. To perform logical AND operation we used multi data trigger. In multi data trigger we can specify more than one conditions and trigger executes if all of the conditions are true.

Let’s take a look at our previous example of stat and cities. Suppose we want to change the background color of row in a list box only if the city is not only the capital of the state but also the largest city in the state. In this case we are going to use Multi Data trigger.

Here is a simple C# code to make city information class.

  1:     public class CityInfo
  2:     {
  3:         public CityInfo()
  4:         {
  5:         }
  6: 
  7:         public CityInfo(String state, String city,
  8:             bool isCapital, bool isLargest)
  9:         {
 10:             State = state;
 11:             City = city;
 12:             IsCapital = isCapital;
 13:             IsLargest = isLargest;
 14:         }
 15: 
 16:         public String State
 17:         { set; get; }
 18: 
 19:         public String City
 20:         { set; get; }
 21: 
 22:         public bool IsCapital
 23:         { set; get; }
 24: 
 25:         public bool IsLargest
 26:         { set; get; }
 27:     }
 28: 

And here is a simple code to insert the data of some cities at the time of loading the application.

  1:         private void Window_Loaded(object sender, RoutedEventArgs e)
  2:         {
  3:             lstView.Items.Add(new CityInfo("California", "Los Angeles", false, true));
  4:             lstView.Items.Add(new CityInfo("California", "San Francisco", false, false));
  5:             lstView.Items.Add(new CityInfo("California", "sacramento", true, false));
  6:             lstView.Items.Add(new CityInfo("California", "San Diego", false, false));            
  7:             lstView.Items.Add(new CityInfo("Massachusetts", "Boston", true, true));
  8:         }
  9: 

Now we are going to apply the multi data trigger on the list control and change the background color of list only if the city is capital of the state and also the largest city of the state. Here is a XAML code for this.

  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:                 <MultiDataTrigger>
 10:                     <MultiDataTrigger.Conditions>
 11:                         <Condition Binding="{Binding IsCapital}" Value="true"/>
 12:                         <Condition Binding="{Binding IsLargest}" Value="true"/>
 13:                     </MultiDataTrigger.Conditions>                    
 14:                     <Setter Property="Background" Value="Green"/>
 15:                     <Setter Property="Foreground" Value="White"/>
 16:                 </MultiDataTrigger>
 17:             </Style.Triggers>
 18:         </Style>
 19:     </Window.Resources>
 20:     
 21:     <Grid>                
 22:         <ListView Name="lstView">
 23:             <ListView.View>
 24:                 <GridView>
 25:                     <GridViewColumn Width="180" Header="State" DisplayMemberBinding="{Binding Path = State}"/>
 26:                     <GridViewColumn Width="180" Header="City" DisplayMemberBinding="{Binding Path = City}"/>
 27:                 </GridView>
 28:             </ListView.View>
 29:         </ListView>
 30:     </Grid>
 31: </Window>
 32: 

Here is the output of this program.

Logical_Trigger_02

Advertisements

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: