Перезапуск анимации WPF

Question

У меня есть следующий WPF XAML, который пытается анимировать видимость 2 прямоугольников в зависимости от свойства IsChecked флажка. Таким образом, флажок означает, что появляется синее поле, а красное поле исчезает через секунду, значение «Не отмечено» означает, что появляется красное поле, а синее поле исчезает, а значение «Не определено» означает, что ни одно из них не видно. Я использую раскадровки, но мне чего-то не хватает. Это работает для первого триггера, но некоторые анимированные свойства застряли.

  <DataTemplate x:Key="dt">
                <DockPanel>
                    <CheckBox x:Name="ckToggle" Content="Toggle" DockPanel.Dock="Top" IsThreeState="True"/>
                    <StackPanel Orientation="Horizontal">
                        <Rectangle x:Name="a" Visibility="Hidden" Width="100" Height="100" Fill = "Red"/>
                        <Rectangle x:Name="b" Visibility="Hidden" Width="100" Height="100" Fill = "Blue"/>
                    </StackPanel>
                </DockPanel>

                <DataTemplate.Triggers>

                    <DataTrigger Binding="{Binding ElementName=ckToggle, Path=IsChecked}" Value="True">
                         <DataTrigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="a" Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame KeyTime="00:00:01" Value="{x:Static Visibility.Visible}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </BeginStoryboard>
                            <BeginStoryboard>
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="b" Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame KeyTime="00:00:00" Value="{x:Static Visibility.Visible}"/>
                                        <DiscreteObjectKeyFrame KeyTime="00:00:01" Value="{x:Static Visibility.Hidden}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions> 
                         <DataTrigger.ExitActions>
                        </DataTrigger.ExitActions> 

                    </DataTrigger>

                    <DataTrigger Binding="{Binding ElementName=ckToggle, Path=IsChecked}" Value="False">
                           <DataTrigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="b" Storyboard.TargetProperty="Visibility"  >
                                        <DiscreteObjectKeyFrame KeyTime="00:00:01" Value="{x:Static Visibility.Visible}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </BeginStoryboard>
                            <BeginStoryboard>
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="a" Storyboard.TargetProperty="Visibility">
                                         <DiscreteObjectKeyFrame KeyTime="00:00:00" Value="{x:Static Visibility.Visible}"/>
                                            <DiscreteObjectKeyFrame KeyTime="00:00:01" Value="{x:Static Visibility.Hidden}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions> 
                         <DataTrigger.ExitActions>
                        </DataTrigger.ExitActions> 
                    </DataTrigger>
                </DataTemplate.Triggers>
            </DataTemplate>

     <ContentControl ContentTemplate="{StaticResource dt}"/>

Если кто-то может помочь, спасибо Bryan

Answer 1

Проблема, которую вы имеете, является свойством раскадровки wpf.Это тот случай, когда вы начинаете раскадровку, она никогда не остановится, пока вы не скажете об этом.Итак, первая раскадровка, которую вы называете, все еще работает, когда вы вызываете вторую, и у вас возникают проблемы.Выход из этого заключается в следующем: сначала объедините две раскадровки для каждого триггера в один (вы можете поместить несколько анимаций в одну раскадровку, вам не нужно это делать, но это облегчает задачу ...).Теперь добавьте имя для каждого из двух оставшихся вызовов BeginStoryboard и добавьте вызовы StopStoryboard с одинаковыми именами для каждого dataTrigger в блоке exitActions.Я получил следующий код, который (надеюсь) работает так, как вы хотите:

<Window x:Class="Test.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:Test"
    Title="MainWindow" Height="350" Width="525">
<Window.Resources>
    <DataTemplate x:Key="dt">
        <DockPanel>
            <CheckBox x:Name="ckToggle" Content="Toggle" DockPanel.Dock="Top" IsThreeState="True"/>
            <StackPanel Orientation="Horizontal">
                <Rectangle x:Name="a" Visibility="Hidden" Width="100" Height="100" Fill = "Red"/>
                <Rectangle x:Name="b" Visibility="Hidden" Width="100" Height="100" Fill = "Blue"/>
            </StackPanel>
        </DockPanel>
        <DataTemplate.Triggers>
            <DataTrigger Binding="{Binding ElementName=ckToggle, Path=IsChecked}" Value="True">
                <DataTrigger.EnterActions>
                    <BeginStoryboard Name="st1">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="a" Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="00:00:01" Value="{x:Static Visibility.Visible}"/>
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="b" Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="00:00:00" Value="{x:Static Visibility.Visible}"/>
                                <DiscreteObjectKeyFrame KeyTime="00:00:01" Value="{x:Static Visibility.Hidden}"/>
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </BeginStoryboard>
                </DataTrigger.EnterActions>
                <DataTrigger.ExitActions>
                    <StopStoryboard BeginStoryboardName="st1"/>
                </DataTrigger.ExitActions>
            </DataTrigger>
            <DataTrigger Binding="{Binding ElementName=ckToggle, Path=IsChecked}" Value="False">
                <DataTrigger.EnterActions>
                    <BeginStoryboard Name="st2">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="b" Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="00:00:01" Value="{x:Static Visibility.Visible}"/>
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="a" Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="00:00:00" Value="{x:Static Visibility.Visible}"/>
                                <DiscreteObjectKeyFrame KeyTime="00:00:01" Value="{x:Static Visibility.Hidden}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </BeginStoryboard>
                </DataTrigger.EnterActions>
                <DataTrigger.ExitActions>
                    <StopStoryboard BeginStoryboardName="st2"/>
                </DataTrigger.ExitActions>
            </DataTrigger>
        </DataTemplate.Triggers>
    </DataTemplate>
</Window.Resources>
<ContentControl ContentTemplate="{StaticResource dt}"/></Window>