WPF остановка и обратная анимация раскадровки при запуске новой анимации

Question

У меня есть 2 DataTrigger, который анимирует цвет фона кнопки (с обратным), эта часть отлично работает.

Проблема заключается в том, что при срабатывании 2 триггеров в моменты перекрытия первый срабатывающий триггер не отменяет цвет, когда второй триггер останавливает его, чтобы он менял цвет до того, что было цветом при остановке предыдущей анимации.

Что мне делать?

Это пример кода:

<DataTrigger Binding="{Binding IsUp}" Value="True"> 
    <DataTrigger.EnterActions> 
     <StopStoryboard BeginStoryboardName="isDownStoryBoard"/> 
      <BeginStoryboard Name="isUpStoryBoard"> 
       <Storyboard> 
        <ColorAnimation Storyboard.TargetProperty="Background.GradientStops[0].Color" To="#b4e391" Duration="0:0:1" AutoReverse="True" RepeatBehavior="2x" /> 
        <ColorAnimation Storyboard.TargetProperty="Background.GradientStops[1].Color" To="#61c419" Duration="0:0:1" AutoReverse="True" RepeatBehavior="2x" /> 
        <ColorAnimation Storyboard.TargetProperty="Background.GradientStops[2].Color" To="#b4e391" Duration="0:0:1" AutoReverse="True" RepeatBehavior="2x" /> 
        <ColorAnimation Storyboard.TargetProperty="Background.GradientStops[3].Color" To="#b4e391" Duration="0:0:1" AutoReverse="True" RepeatBehavior="2x" />       
      </Storyboard>                                  
     </BeginStoryboard>                                  
    </DataTrigger.EnterActions>                                             
</DataTrigger>                                     

<DataTrigger Binding="{Binding IsDown}" Value="True">                           
    <DataTrigger.EnterActions> 
     <StopStoryboard BeginStoryboardName="isUpStoryBoard"/> 
      <BeginStoryboard Name="isDownStoryBoard">                                  
       <Storyboard>                                  
        <ColorAnimation Storyboard.TargetProperty="Background.GradientStops[0].Color" To="#efc5ca" Duration="0:0:1" AutoReverse="True" RepeatBehavior="2x" /> 
        <ColorAnimation Storyboard.TargetProperty="Background.GradientStops[1].Color" To="#d24b5a" Duration="0:0:1" AutoReverse="True" RepeatBehavior="2x" /> 
        <ColorAnimation Storyboard.TargetProperty="Background.GradientStops[2].Color" To="#ba2737" Duration="0:0:1" AutoReverse="True" RepeatBehavior="2x" /> 
        <ColorAnimation Storyboard.TargetProperty="Background.GradientStops[3].Color" To="#f18e99" Duration="0:0:1" AutoReverse="True" RepeatBehavior="2x" /> 
      </Storyboard> 
     </BeginStoryboard> 
    </DataTrigger.EnterActions>  
</DataTrigger> 

Answer 1

Существует StopStoryboard Class, что вы можете использовать, чтобы остановить запущенный Storyboard с, но нет ReverseStoryboard класса. Тем не менее, вы можете просто создать еще один Storyboard, который работает в обратном направлении к исходному, который вы начинаете, когда вы останавливаете исходный. Вы можете использовать StopStoryboard класс как это (от связанной страницы на MSDN):

<!-- Begin the Storyboard --> 
<EventTrigger RoutedEvent="Button.Click" SourceName="BeginButton"> 
    <BeginStoryboard Name="MyBeginStoryboard"> 
    <Storyboard > 
     <DoubleAnimation 
     Storyboard.TargetName="myRectangle" 
     Storyboard.TargetProperty="Width" 
     Duration="0:0:5" From="100" To="500" /> 
    </Storyboard> 
    </BeginStoryboard> 
</EventTrigger> 

... 

<!-- Stop the Storyboard --> 
<EventTrigger RoutedEvent="Button.Click" SourceName="StopButton"> 
    <StopStoryboard BeginStoryboardName="MyBeginStoryboard" /> 
</EventTrigger> 

Кроме того, обратитесь к Timeline.FillBehavior Property, что вы можете установить на Storyboard который Возвращает или задает значение, указывающее, как Timeline ведет себя после того, как он достигнет конца своего активного периода. Вы можете установить его на перечисление FillBehavior.HoldEnd, чтобы получить Storyboard, чтобы сохранить его последнее значение, когда оно закончится.