ARTICLE

Triggers in WPF

Posted by Sapna Articles | WPF using VB.NET October 21, 2010
This tutorial shows how to implement different types of triggers in WPF Application.
 
Reader Level:

Trigger is a feature that allows a user to dynamically change the appearance and behavior of a control in an application without having to create a new control in WPF. It sets properties of controls or starts its actions when a property value changes or when an event is raised.

Mouseover effects are a very common application of triggers. Triggers can fully be expressed using XAML, eliminating the need to write code for many simple effects.

There are three types of triggers in WPF:

Property Triggers -
   It run when the value of a dependency property changes. Property triggers are used to monitor a DependencyProperty's value. Here we applies a glow effect to a button when the mouse pointer is over the button (IsMouseOver=true).


Property Trigger Code

<Window x:Class="WpfApplication1.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="300" Width="300">
    <Canvas>
        <Canvas.Resources>
            <Style TargetType="{x:Type Button}">
                <Style.Triggers>
                    <Trigger Property="IsMouseOver" Value="true">
                        <Setter Property="BitmapEffect">
                            <Setter.Value>
                                <OuterGlowBitmapEffect GlowColor="Gold" GlowSize="10" />
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </Canvas.Resources>
        <Button Canvas.Left="29" Canvas.Top="29" Width="75" Height="42">Click Me</Button>
    </Canvas>
</
Window>

Output


P-trigger1.gif   

After Mouse Over 

P-trigger2.gif


Data Triggers - 
  DataTrigger represents a trigger that applies property values or performs actions when the bound data meets a specified condition. It run when the value of any .NET property changes, using data binding.


Data Trigger Code

<StackPanel>
        <StackPanel Orientation="Horizontal">
            <StackPanel.Style>
                <Style TargetType="{x:Type StackPanel}">
                    <Style.Triggers>
                       <DataTrigger Binding="{Binding Path=IsChecked, ElementName=RadioButton3}" Value="True">
                            <Setter Property="IsEnabled" Value="False"/>
                        </DataTrigger>
                        <DataTrigger Binding="{Binding Path=IsChecked, ElementName=RadioButton4}" Value="True">
                            <Setter Property="IsEnabled" Value="False"/>
                        </DataTrigger>
                    </Style.Triggers>
                </Style
           
</StackPanel.Style>
            <RadioButton Name="RadioButton1"/>
            <RadioButton Name="RadioButton2"/>
            <RadioButton Name="RadioButton3"/>
            <RadioButton Name="RadioButton4"/>
        </StackPanel>
        <Button Content="Data Trigger" Click="Button_Click"/>
        <x:Code>
            <![CDATA[
                   private void Button_Click(object sender, RoutedEventArgse)
                    {
                        RadioButton2.IsChecked = true;
                    }
                ]]>
        </x:Code>
</
StackPanel

Output

D-trigger.gif


Event Triggers -    Event triggers watch for events. When an event happens, such as a Click event, an event trigger responds by raising an animation related action.

Event Trigger Code

<StackPanel>
        <ToggleButton Name = "button">
            <ToggleButton.Template>
                <ControlTemplate TargetType="ToggleButton">
                    <TextBlock> Click Me Here!!</TextBlock>
                </ControlTemplate>
            </ToggleButton.Template>
        </ToggleButton>
        <Popup IsOpen="{Binding IsChecked, ElementName=button}">
            <Border Background="LightYellow">
                <TextBlock> I'M the popup</TextBlock>
            </Border>
        </Popup>

    </StackPanel>

Output

E-trigger.gif

Conclusion


Here we discussed about different types of Trigger implementations in WPF.

Login to add your contents and source code to this article
share this article :
post comment
 
6 Months Free & No Setup Fees ASP.NET Hosting!
Become a Sponsor
PREMIUM SPONSORS
  • ceTE software specializes in components for dynamic PDF generation and manipulation. The DynamicPDF™ product line allows you to dynamically generate PDF documents, merge PDF documents and new content to existing PDF documents from within your applications. Visit DynamicPDF here
    Finally – a virtual platform that delivers next-generation Windows Server 2008 Hyper-V virtualization technology from a managed hosting partner you can truly depend on. Visit www.maximumasp.com/max for a FREE 30 day trial. Hurry offer ends soon. Climb aboard the MaxV platform and take advantage of High Availability, Intelligent Monitoring, Recurrent Backups, and Scalability – with no hassle or hidden fees. As a managed hosting partner focused solely on Microsoft technologies since 2000, MaximumASP is uniquely qualified to provide the superior support that our business is built on. Unparalleled expertise with Microsoft technologies lead to working directly with Microsoft as first to offer IIS 7 and SQL 2008 betas in a hosted environment; partnering in the Go Live Program for Hyper-V; and product co-launches built on WS 2008 with Hyper-V technology.
6 Months Free & No Setup Fees ASP.NET Hosting!
Become a Sponsor