WPF Multiple Triggers

Question

I have conflicting storyboards between isPressed and isMouseOver. Both change the background of a button to different colors. But isMouseOver storyboard is overriding isPressed storyboard. How do i overcome this? I heard of multiple triggers but could you guys give me a code solution. I'm new to WPF.

<ControlTemplate.Triggers>
    <Trigger Property="IsMouseOver" Value="True">
        <Trigger.EnterActions>
            <BeginStoryboard Storyboard="{StaticResource ToolsButtonMouseOver}"/>
        </Trigger.EnterActions>
        <Trigger.ExitActions>
            <BeginStoryboard x:Name="ToolsButtonMouseNotOver_BeginStoryboard" Storyboard="{StaticResource ToolsButtonMouseNotOver}"/>
        </Trigger.ExitActions>
    </Trigger>
    <Trigger Property="IsPressed" Value="True">
        <Trigger.ExitActions>
            <BeginStoryboard x:Name="ToolsButtonNotPressedStoryboard_BeginStoryboard1" Storyboard="{StaticResource ToolsButtonNotPressedStoryboard}"/>
        </Trigger.ExitActions>
        <Trigger.EnterActions>
            <BeginStoryboard x:Name="ToolsButtonNotPressedStoryboard_BeginStoryboard" Storyboard="{StaticResource ToolsButtonPressedStoryboard}"/>
        </Trigger.EnterActions>
    </Trigger>
</ControlTemplate.Triggers>

Where are the triggers? Is `IsMouseOver` trigger declared after `IsPressed`? Did you try swapping places? If this does not work try using [visual states](https://msdn.microsoft.com/en-us/library/ms753328(v=vs.100).aspx) — dkozl, Dec 31 '15 at 10:06
Ive added the code with triggers. Mouse over works. But once i press button, isPress works, mouseover no longer works — RStyle, Dec 31 '15 at 11:25
Have you considered using a MultiBinding instead? Then you could express conditions for when a databinding to take effect. — Scott Nimrod, Dec 31 '15 at 12:16

score 10 · Answer 1 · answered Dec 31 '15 at 11:38

You should have multitrigger when it is IsMouseOver and IsPressed. Also note that the order of the triggers matter as well. If the plain IsMouseOver is after the multitrigger it will be the active condition when you are hovering and pressing down. Using foreground for the demonstration because it is simplest way to demonstrate the effect.

<Button Content="Click Me">
    <Button.Style>
        <Style TargetType="{x:Type Button}">
            <Setter Property="Foreground" Value="Black"/>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Foreground" Value="SpringGreen"/>
                </Trigger>
                <MultiTrigger>
                    <MultiTrigger.Conditions>
                        <Condition Property="IsMouseOver" Value="True"/>
                        <Condition Property="IsPressed" Value="True"/>
                    </MultiTrigger.Conditions>
                    <Setter Property="Foreground" Value="Blue"/>
                </MultiTrigger>
            </Style.Triggers>
        </Style>
    </Button.Style>
</Button>

score 0 · Answer 2 · edited May 23 '17 at 12:08

Consider using a MultiDataTrigger.

This will enable you to express specific conditions in order for one of your triggers to be invoked. Thus, this could provide mutual exclusive behavior between your triggers.

Example:

<MultiDataTrigger>
    <MultiDataTrigger.Conditions>
        <Condition Binding="{Binding Path=SomePath}" Value="SomeValue"/>
        <Condition Binding="{Binding Path=SomeOtherPath, Converter={StaticResource SomeConverter}}" Value="SomeOtherValue"/>
    </MultiDataTrigger.Conditions>
    <MultiDataTrigger.EnterActions>
        <BeginStoryboard Storyboard="{StaticResource MyStoryboard}"/>
    </MultiDataTrigger.EnterActions>
</MultiDataTrigger>

WPF Multiple Triggers

2 Answers2