CODEWITHSUNDEEP
c#wpfxamlwpf-animation
Tomas
Tomas

Reputation: 1222

Smooth ExitAction in WPF Trigger using Storyboard

I have a WPF aplication and here I want to override the ugly default WPF styles. I have created the Styles.xaml dictionary and here I have almost finished with styles, but there are some problems with animation and smooth transition between different visual states (triggers).

One of my challenges was that I don't want to have any C# event handlers or other C# code bound to styles.

Here I provide some code on my trigger:

<MultiTrigger>
    <MultiTrigger.Conditions>
        <Condition Property="IsEnabled" Value="True" />
        <Condition Property="IsMouseOver" Value="True" />
        <Condition Property="IsPressed" Value="False" />
    </MultiTrigger.Conditions>
    <MultiTrigger.EnterActions>
        <BeginStoryboard Name="MouseOverStoryboard">
            <Storyboard Duration="0:0:0.25" SlipBehavior="Grow">
                <ColorAnimation Storyboard.TargetName="InnerBorder" 
                                Storyboard.TargetProperty="Background.(SolidColorBrush.Color)" 
                                To="{StaticResource White}" 
                                BeginTime="0:0:0" Duration="0:0:0.25" />
                <DoubleAnimation Storyboard.TargetName="InnerBorder" 
                                 Storyboard.TargetProperty="Opacity" 
                                 To="0.3" 
                                 BeginTime="0:0:0" Duration="0:0:0.25" />
            </Storyboard>
        </BeginStoryboard>
    </MultiTrigger.EnterActions>
    <MultiTrigger.ExitActions>
        <RemoveStoryboard BeginStoryboardName="MouseOverStoryboard" />
    </MultiTrigger.ExitActions>
</MultiTrigger>

To make animation smooth I added EnterAction and put Storyboard here with timings, so entering animation is smooth and looking well.

My first question was about how to get back to default color when my BeginStoryboard was executed, but then I realised I can use RemoveStoryboard.

Now I really don't know I my ideas are out - how to make smooth exit animation? Shouldn't I use RemoveStoryboard?

Please provide suggestions. Thanks.

P. S. I'm not using VisualStateManager, because of lack of states and I don't want to implement my own controls for that.

Upvotes: 1

Views: 1469

Answers (1)

BionicCode
BionicCode

Reputation: 28988

How about adding a new animation object that starts when the enter action animation duration elapsed. Or how about using the ExitAction property of your Trigger by adding a Storyboard that reverts your EnterAction. Or you could try to set the Fillbehavior property to 'Stop...

Another option is to use an EventSetter to catch RoutedEvents like MouseEnter and MouseLeave.

Upvotes: 1

Related Questions