Looking at Triggers with Styles and Control Templates - Triggers
(Page 2 of 4 )
So far, we’ve se en styles as a collection of Setter elements. When a style is applied, the settings described in the Setter elements are applied unconditionally (unless overridden by per-instance settings). On the other hand, triggers are a way to wrap one or more Setter elements in a condition so that, if the condition is true, the corresponding Setter elements are executed, and when the condition becomes false, the property value reverts to its pre-trigger value.
WPF comes with three kinds of things that you can check in a trigger condition: a dependency property, a .NET property, and an event. The first two directly change values based on a condition, as I described, while the last, an event trigger, is activated when an event happens and then starts (or stops) an animation that causes properties to change.
Property Triggers
The simplest form of a trigger is a property trigger, which watches for a dependency property to have a certain value. For example, if we wanted to light up a button in yellow as the user moves the mouse over it, we can do so by watching for the IsMouseOver property to have a value of True, as in Example 5-24.
Example 5-24. A simple property trigger
<Style TargetType="{x:Type Button}">
...
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True" >
<Setter Property="Background" Value="Yellow" />
</Trigger>
</Style.Triggers>
</Style>
Triggers are grouped together under the Style.Triggers element. In this case, we’ve added a Trigger element to the button style. When the IsMouseOverproperty of our button is true, theBackgroundvalue of the button will be set to yellow, as shown in Figure 5-8.
You’ll notice in Figure 5-8 that only the button where the mouse is currently hovering has its background set to yellow, even though other buttons have clearly been under the mouse. There’s no need to worry about setting a property back when the trigger is no longer true—e.g., watching forIsMouseOverto beFalse. The WPF dependency-property system watches for the property trigger to become inactive and reverts to the previous value.
Figure 5-8. A Property trigger in action
Property triggers can be set to watch any of the dependency properties on the control to which your style is targeted and to set any of the dependency properties on the control while the condition is true. In fact, you can use a single trigger to set multiple properties if you like, as in Example 5-25.
Example 5-25. Setting multiple properties with a single trigger
<Style TargetType="{x:Type Button}">
...
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True" >
<Setter Property="Background" Value="Yellow" />
<Setter Property="FontStyle" Value="Italic" />
</Trigger>
</Style.Triggers>
</Style>
In Example 5-25, we’re setting the background to yellow and the font style to italic when the mouse is over a button.
One property that you’re not allowed to set in a trigger is theStyleproperty itself. If you try, you’ll get the following error:
AStyleobject is not allowed to affect the Style property of the object to which it applies.
This makes sense. Since it’s theStyle that’s setting the property, and that participates in “unsetting” it when the trigger is no longer true, what sense would it make to change the veryStylethat’s providing this orchestration? This would be somewhat like switching out your skis after you’ve launched yourself off of a jump but before you’ve landed.
Next: Multiple Triggers >>
More XML Articles
More By O'Reilly Media
|
 This article is excerpted from chapter five of the book Programming Windows Presentation Foundation, written by Chris Sells and Ian Griffiths (O'Reilly; ISBN: 0596101139). Check it out today at your favorite bookstore. Buy this book now.
|
|
/ 4 
