WPF Triggers in VB.NET

This tutorial shows how to implement different types of triggers in WPF Application.
  • 3673

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.

Categories

More Articles

© 2019 DotNetHeaven. All rights reserved.