Question

I have extracted this piece of code from my project, because I was trying to find a mistake I made which keeps my BeginStoryboard from stopping itself. I simplified code as much as possible and still I don’t see a problem. What do you think it could be?

<Window Width="640" Height="480" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
<StackPanel>
    <Button Content="Start" Name="Button" Width="200">
        <Button.Triggers>
            <EventTrigger RoutedEvent="Button.Click">
                <BeginStoryboard Name="Storyboard">
                    <Storyboard>
                        <DoubleAnimation By="150" Duration="0:0:5" Storyboard.TargetName="Button" Storyboard.TargetProperty="Width"/>
                        <StringAnimationUsingKeyFrames Storyboard.TargetName="Button" Storyboard.TargetProperty="Content">
                            <DiscreteStringKeyFrame KeyTime="0:0:5" Value="Did you click? Because I obviously didn't stop..."/>
                        </StringAnimationUsingKeyFrames>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </Button.Triggers>
    </Button>
    <Button Content="Stop">
        <Button.Triggers>
            <EventTrigger RoutedEvent="Button.Click">
                <StopStoryboard BeginStoryboardName="Storyboard"/>
            </EventTrigger>
        </Button.Triggers>
    </Button>
</StackPanel>
</Window>

Try the code yourself, first Button triggers the storyboard, second one is supposed to stop it, but nothing happens, so animation in first Button goes on happily.

Answer 1

Your BeginStoryboard is in a different naming scope, so the StopStoryboard doesn’t see it.

You need to put both triggers in the same collection, like the MSDN example.