Windows Phone Expression Blend - How to Reverse a Storyboard/Animation

Question

Edit: I solved it using a ToggleButton and its CheckedStates: more info here

I have a storyboard that when I press a button a usercontrol slides into view. I would like to be able to press the same button again and the animation reverses and the usercontrol slides away.

Here is the storyboard code:

     <Storyboard x:Name="SettingsScrollUp" AutoReverse="False">
        <DoubleAnimation Duration="0:0:1" To="-189" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="btn_Import" d:IsOptimized="True">
            <DoubleAnimation.EasingFunction>
                <QuarticEase EasingMode="EaseOut"/>
            </DoubleAnimation.EasingFunction>
        </DoubleAnimation>
        <DoubleAnimation Duration="0:0:1" To="-189" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="btn_Settings" d:IsOptimized="True">
            <DoubleAnimation.EasingFunction>
                <QuarticEase EasingMode="EaseOut"/>
            </DoubleAnimation.EasingFunction>
        </DoubleAnimation>
        <DoubleAnimation Duration="0:0:1" To="-189" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="SettingsPopup" d:IsOptimized="True">
            <DoubleAnimation.EasingFunction>
                <QuarticEase EasingMode="EaseOut"/>
            </DoubleAnimation.EasingFunction>
        </DoubleAnimation>
        <DoubleAnimation Duration="0:0:1" To="0" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="btn_Import" d:IsOptimized="True">
            <DoubleAnimation.EasingFunction>
                <QuinticEase EasingMode="EaseOut"/>
            </DoubleAnimation.EasingFunction>
        </DoubleAnimation>
    </Storyboard>

Answer 1

I solved this using a toggle button instead and triggering the animations from the Checked and UnChecked events. More information here.