Link to home
Start Free TrialLog in
Avatar of Russ Suter
Russ Suter

asked on

IsMouseOver and IsPressed animations conflict

Forgive my ignorance. I'm still learning xaml.

I have this button:
                <Button Name="CloseButton" DockPanel.Dock="Top" HorizontalAlignment="Right" Style="{StaticResource TitleBarButton}" Click="CloseButton_Click" Tag="Images/Window/close.png">
                </Button>

Open in new window

This is the style definition I have so far:
    <Style x:Key="TitleBarButton" TargetType="Button">
        <Setter Property="Width" Value="34"/>
        <Setter Property="Height" Value="26"/>
        <Setter Property="BorderBrush" Value="Transparent"/>
        <Setter Property="BorderThickness" Value="1,0,1,1"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="Button">
                    <Border x:Name="border" Background="Transparent" BorderBrush="Transparent" BorderThickness="1,0,1,1" >
                        <Image Source="{Binding Tag, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Button}}}" Stretch="None"/>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Trigger.EnterActions>
                                <BeginStoryboard>
                                    <Storyboard>
                                        <ColorAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="Background.Color" To="#FFFFFCF4" Duration="0:0:0.2"/>
                                        <ColorAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="BorderBrush.Color" To="#FFE5C365" Duration="0:0:0.2"/>
                                    </Storyboard>
                                </BeginStoryboard>
                            </Trigger.EnterActions>
                            <Trigger.ExitActions>
                                <BeginStoryboard>
                                    <Storyboard>
                                        <ColorAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="Background.Color" To="Transparent" Duration="0:0:0.2"/>
                                        <ColorAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="BorderBrush.Color" To="Transparent" Duration="0:0:0.2"/>
                                    </Storyboard>
                                </BeginStoryboard>
                            </Trigger.ExitActions>
                        </Trigger>
                        <Trigger Property="IsPressed" Value="True">
                            <Trigger.EnterActions>
                                <BeginStoryboard>
                                    <Storyboard>
                                        <ColorAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="Background.Color" To="#FFFFE8A6" Duration="0:0:0.1"/>
                                        <ColorAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="BorderBrush.Color" To="#FFE5C365" Duration="0:0:0.1"/>
                                    </Storyboard>
                                </BeginStoryboard>
                            </Trigger.EnterActions>
                            <Trigger.ExitActions>
                                <BeginStoryboard>
                                    <Storyboard>
                                        <ColorAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="Background.Color" To="Transparent" Duration="0:0:0.1"/>
                                        <ColorAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="BorderBrush.Color" To="Transparent" Duration="0:0:0.1"/>
                                    </Storyboard>
                                </BeginStoryboard>
                            </Trigger.ExitActions>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

Open in new window

I'm almost there but this weird behavior has me confused. IsMouseOver works fine until IsPressed is activated. IsPressed always works fine. The issue is that once the IsPressed trigger has fired the IsMouseOver exit action doesn't ever seem to get called again. What I need to figure out is how do I get the IsPressed exit action to just refer back to the IsMouseOver action so the color is set correctly?
ASKER CERTIFIED SOLUTION
Avatar of Miguel Oz
Miguel Oz
Flag of Australia image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial