How to remove an WPF animation defined in a style? - wpf

Question

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?

Answer 1

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 ...