WPF Styles: Triggers

Posted on 2/13/2007 @ 6:20 PM in #Silverlight and WPF by | Feedback | 15594 views

Thus far in my blog posts on WPF Styles, you have seen

 - Setters allow you to set a Property's value, in my Styles in XAML blogpost.
 - EventSetters allow you to connect a handler to an event, in my WPF EventSetters in styles blogpost.

But, What if,

- You wished to tap into an "Event", i.e. "something happened", but instead of a method/handler, you want certain setters set.
- You wished to tap into an "Event", i.e. "something happened", but you want certain setters and/or event setters to be set?
- Or heck, why "something happened", why not "some data changed", or "a combination of somethings happened"? And as a trigger to that "something(s) happened", you want "setters and event setters to be set"?

In short, I wish to connect any combination of (event(s) or data(s)) to any set of (event(s) or data(s)). Do WPF styles let me do that? The answer is "HECK YEAH!".

Styles let you do exactly that, using a concept called "Triggers". The class "Style" has a property called "Triggers", which is of type TriggerCollection. TriggerCollection accepts items of type "TriggerBase". If you examine the class hierarchy, you can see, there are 5 classes that inherit from "TriggerBase" as shown below:

So, there are 5 kinda triggers available to you, Trigger, EventTrigger, DataTriger, MultiDataTrigger and MultiTrigger.

Let us first look at "Trigger".

Let us say, you are trying to solve a simple simple problem, of being able to create a "MouseOver" effect for a button. You want the font to turn Bold, if I mouse over. This is a problem that can be very easily solved using Triggers. You are creating a Trigger, to react to "Mouse Over Happened", and you want a setter to be set that will make the font Bold. Okay, the following XAML does exactly that -

<Style TargetType="{x:Type Button}">
<
Style.Triggers>
<
Trigger Property="IsMouseOver" Value="true">
<
Setter Property="FontWeight" Value="Bold"/>
</
Trigger>
</
Style.Triggers>
</
Style>

Great, now create a button -

<Button Margin="20,20,20,20" >Mouse Over Me</Button>

.. and run the app !! Whad'ya see?

Mouse not over -

Mouse Over -

Nice eh?

Similarly,

DataTrigger, lets you react to certain data in a business object you may have. You will need to use your WPF DataBinding concepts to use a DataTrigger.

MultiTrigger lets you create a trigger based upon multiple things happening at the same time.

MultiDataTrigger, lets you create create a trigger based on multiple data related conditions.

and EventTrigger, lets you create a trigger in response to a specific event happening.

So, with a combination of Setters, EventSetters, and the various Triggers, you can now match anything (event(s) or data(s)), with anything (event(s) or data(s)).

This is heckuva more powerful than simple "stylesheet". w00t!!

Sound off but keep it civil:

Older comments..


On 12/31/2008 11:39:30 PM Rob said ..
Thanks, just threw that in!