Tuesday, September 11, 2007

Combining DataTriggers and Property Triggers in WPF

How to combine property-triggers and data-triggers in WPF is not quite clear from the documentation.

Property-trigger that changes the color of a buttons background

A property-trigger is a trigger that works with the visisble element properties of WPF. Button has among others an IsMouseOver-property.

<Style TargetType="{x:Type Button}">
 <Setter Property="Button.Background" Value="AliceBlue" />
  <Trigger Property="IsMouseOver" Value="True">
   <Setter Property="Button.Background" Value="Yellow" />

Data-trigger that changes the color of a buttons background

A data-trigger is a trigger that works with the properties of my own objects. My user object below has a Name and a Role property.

public class User {
    private string name;
    private string role;

    public string Name {
        get { return name; }
        set { name = value; }

    public string Role {
        get { return role; }
        set { role = value; }

<Style TargetType="{x:Type Button}">
  <DataTrigger Binding="{Binding Path=Role}" Value="Admin">
   <Setter Property="Button.Background" Value="Red" />

A combined property-trigger and a data-trigger that changes the color of a buttons background

If I want to combine the two triggers above to check if the role is admin and the mouse is over there is no straightforward way to do this, so I have to resort to this.

<Style TargetType="{x:Type Button}">
    <!-- This binding refers to the actual WPF element. -->
    <Condition Binding="{Binding RelativeSource={RelativeSource Self}, Path=IsMouseOver}" Value="True"/>
    <Condition Binding="{Binding Path=Role}" Value="Admin"/>
   <Setter Property="Button.Background" Value="Orange" />


Anonymous said...

Absolute Gold.

Anonymous said...


Alex Ilyin said...

Very helpful indeed

Tanner said...

I didn't understand a good use for a multitrigger until i saw your post here. I was able to take your sample source and translate it into something that I can use.

Thanks for taking the time to share some info for MultiTriggers!

Pali said...

Thanks mate...this is really helpful. This saved me lot of time.

Anders Janmyr said...

@Pali, I'm glad it is still helping people.

Anonymous said...

Still helping people!
Cheers for this example!

Anders Janmyr said...

@Edgar, Cheers!

Imaver said...

Very helpful post, and also nice implementation - easy to use and very straightforward

Thanks a lot!

Anders Janmyr said...

@Imaver I'm glad it helped!

Mak said...

Many thanks Anders

Anders Janmyr said...

@Mak, glad to help!

csharpsimplified said...

Thanks man!!
This helped me.

David Haglund said...

Tackar tackar! :)

Anders Janmyr said...

@David, kul att det hjälpte dig!

Anonymous said...

Thanks bro, this was just what I needed!

Kelly said...

Seriously brilliant. Thank you.

Anders Janmyr said...

@Kelly, you're welcome.

Anonymous said...

Thanks!!! Really Helpful.. I was stuck into this.

feral said...

Nice thanks I woulda been scratching my head for a while!

Anders Janmyr said...

@feral, You are welcome, I'm glad it helped you.

Torben Jonas said...

Yeeeeeeeees a solution for my current problem! Searched for about two hours to find this article but now everything works. Thanks a lot! :)

Anders Janmyr said...

@Torben, you're welcome :)

Anonymous said...

Thanks mate

Anonymous said...

One more trigger type from Dr WPF - EventTrigger - http://drwpf.com/blog/2009/05/12/itemscontrol-l-is-for-lookless/#IntroToTriggers


Anonymous said...

Thanks it worked

Anders Janmyr said...

You're welcome.

Anonymous said...

Short and clear, straight to the point. Thanks!

Rene Bottern said...

Brilliantly simple!

CuteD34th said...

Thanks! This really helped me out.
Simple and straightforward explanation!

Anders Janmyr said...

@Rene, @CuteD34th. You are welcome, I'm glad it helped you.

David said...

Just wanted to say, this post helped me after 6 hours of searching on the internet. Thanks!

Anders Janmyr said...

@David, I'm glad it helped you. You're welcome!