Property Trigger in WPF

There are three types of trigger in WPF named Property Trigger, Data Trigger and Event trigger. All of the triggers are inherited by TriggerBase class. Here is a partial class diagram of TriggerBase class.

With the help of trigger, we can set the property changes declaratively when other property changes, data changes or event happened.

Property trigger is probably the most commonly used trigger. It monitor the value of the specified property. Data trigger is quite similar to property trigger and execute when property has some specified value. Event trigger is different then both property and data trigger. Instead of monitoring the value of the property, this trigger execute when some specified event is raised. One typical example of event trigger is animation. If we want to perform some animation at the time of loading the application, then we start that animation with event trigger and select load as an event trigger.

Here is a simple example of Property Trigger.

  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="Property Trigger Demo" Height="300" Width="400">

  5:     <Window.Resources>

  6:         <Style TargetType="{x:Type TabItem}">

  7:             <Style.Triggers>

  8:                 <Trigger Property="IsFocused" Value="True">

  9:                     <Setter Property="FontWeight" Value="Bold"/>

 10:                     <Setter Property="Foreground" Value="Blue"/>

 11:                 </Trigger>

 12:             </Style.Triggers>

 13:         </Style>

 14:     </Window.Resources>

 15:     

 16:     <Grid>                

 17:         <TabControl>

 18:             <TabItem Header="Visual C++"></TabItem>

 19:             <TabItem Header="Visual C#"></TabItem>

 20:             <TabItem Header="Visual Basic"></TabItem>

 21:             <TabItem Header="F#"></TabItem>

 22:         </TabControl>

 23:     </Grid>

 24: </Window>

 25: 
Here we are going to define property trigger on tab item. We select two properties when tab item has focus i.e. change the font color and make the font bold. Here is the output of this program when we select second tab.



About these ads