Bart Roozendaal
Bart Roozendaal

Reputation: 845

How to remove an WPF animation defined in a style?

I have a problem with removing the animation of a property in WPF. When the storyboards are started using a DataTrigger I cannot remove the animation from the property as one would in other cases. No matter what I try or where: the OrientationProperty is locked to the endvalue of the animation. You can see this in this example because you cannot rotate the ScatterViewItem after the storyboard has finished.

This is the XAML:

<s:SurfaceWindow x:Class="SurfaceApplication1.SurfaceWindow1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:s="http://schemas.microsoft.com/surface/2008"
    x:Name="_this"
    Title="SurfaceApplication1"
    >
    <s:SurfaceWindow.Resources>
        <ImageBrush x:Key="WindowBackground" Stretch="None" Opacity="0.6" ImageSource="pack://application:,,,/Resources/WindowBackground.jpg"/>

        <Storyboard x:Key="flipForward" Completed="FlipCompleted">
            <DoubleAnimation By="180" 
                         FillBehavior="HoldEnd"
                         Duration="0:0:0.5"
                         Storyboard.TargetProperty="(s:ScatterViewItem.Orientation)" />
        </Storyboard>

        <Storyboard x:Key="flipBackward" Completed="FlipCompleted">
            <DoubleAnimation By="-180"
                         FillBehavior="HoldEnd"
                         Duration="0:0:0.5"
                         Storyboard.TargetProperty="(s:ScatterViewItem.Orientation)" />
        </Storyboard>
    </s:SurfaceWindow.Resources>


    <Grid Background="{StaticResource WindowBackground}" >
        <s:ScatterView>
            <s:ScatterViewItem x:Name="_item" Orientation="0">
                <s:ScatterViewItem.Style>
                    <Style TargetType="{x:Type s:ScatterViewItem}" BasedOn="{StaticResource {x:Type s:ScatterViewItem}}">
                        <Style.Triggers>
                            <DataTrigger Binding="{Binding ElementName=_button,Path=IsChecked}" Value="True">
                                <DataTrigger.EnterActions>
                                    <BeginStoryboard>
                                        <StaticResource ResourceKey="flipForward" />
                                    </BeginStoryboard>
                                </DataTrigger.EnterActions>
                                <DataTrigger.ExitActions>
                                    <BeginStoryboard>
                                        <StaticResource ResourceKey="flipBackward" />
                                    </BeginStoryboard>
                                </DataTrigger.ExitActions>
                            </DataTrigger>
                        </Style.Triggers>
                    </Style>
                </s:ScatterViewItem.Style>

                <StackPanel>
                    <s:SurfaceToggleButton Margin="20" x:Name="_button">Click Me!</s:SurfaceToggleButton>
                </StackPanel>

            </s:ScatterViewItem>
        </s:ScatterView>
    </Grid>
</s:SurfaceWindow>

And this is the relevant code behind:

    private void FlipCompleted(object sender, EventArgs e)
    {
        _item.BeginAnimation(ScatterViewItem.OrientationProperty, null); // Doesn't work
        ((sender as ClockGroup).Timeline as Storyboard).Remove(_item); // Doesn't work either
        ((sender as ClockGroup).Timeline as Storyboard).Remove(); // Neither does this
    }

Does anyone has a hint on how to remove the animation from the OrientationProperty?

Upvotes: 3

Views: 3128

Answers (1)

bitbonk
bitbonk

Reputation: 49599

Just like you adde a storyboard with BeginStoryboard you can also remove onve with RemoveStoryboard in XAML.

 <DataTrigger.EnterActions>
     <RemoveStoryboard BeginStoryboardName="flipBackward" />
 </DataTrigger.EnterActions>

I am suprised however that BeginAnimation(ScatterViewItem.OrientationProperty, null); didn't do the trick. IMHO it should have ...

Upvotes: 2

Related Questions