WPF Stop Storyboard on Visibility Changed

Question

Tengo un UserControl con un guión gráfico y quiero detener la animación cuando cambia la visibilidad del control.

Creé un Trigger para pausar la animación y comenzarla dependiendo del estado, pero sigo obteniendo una ArgumentException.

Aquí es el XAML:

<UserControl.Triggers> 
    <EventTrigger RoutedEvent="FrameworkElement.Loaded"> 
     <BeginStoryboard x:Name="ProgressAnimation_BeginStoryboard" Storyboard="{StaticResource ProgressAnimation}"/> 
    </EventTrigger> 
    <Trigger Property="Control.Visibility" Value="Collapsed"> 
     <PauseStoryboard BeginStoryboardName="ProgressAnimation_BeginStoryboard" /> 
    </Trigger> 
    <Trigger Property="Control.Visibility" Value="Visible"> 
     <ResumeStoryboard BeginStoryboardName="ProgressAnimation_BeginStoryboard" /> 
    </Trigger> 
</UserControl.Triggers> 

y aquí es la excepción:

El valor "System.Windows.Media.Animation.PauseStoryboard" no es del tipo "System.Windows. SetterBase "y no se puede usar en esta colección genérica. Nombre del parámetro: valor

¿Cómo puedo hacer esto en XAML?

Gracias, Raul

Answer 1

Tome un vistazo a este sample from MSDN:

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 
<StackPanel> 
    <Rectangle Name="TargetRect" Width="200" Height="200" Fill="Blue"/> 
    <Button Name="Begin">BeginStoryboard</Button> 
    <Button Name="Pause">PauseStoryboard</Button> 
    <Button Name="Resume">ResumeStoryboard</Button> 
    <StackPanel.Triggers> 
    <EventTrigger SourceName="Begin" RoutedEvent="Button.Click"> 
    <BeginStoryboard Name="ColorStoryboard"> 
    <Storyboard TargetName="TargetRect"> 
     <ColorAnimation Storyboard.TargetProperty="Fill.Color" To="Red" Duration="0:0:3" RepeatBehavior="Forever" AutoReverse="True"/> 
    </Storyboard> 
    </BeginStoryboard> 
    </EventTrigger> 
    <EventTrigger SourceName="Pause" RoutedEvent="Button.Click"> 
    <PauseStoryboard BeginStoryboardName="ColorStoryboard"/> 
    </EventTrigger> 
    <EventTrigger SourceName="Resume" RoutedEvent="Button.Click"> 
    <ResumeStoryboard BeginStoryboardName="ColorStoryboard"/> 
    </EventTrigger> 
    </StackPanel.Triggers> 
</StackPanel> 
</Page> 

La única diferencia que veo es que están utilizando EventTrigger aquí, pero debe comportarse de la misma, al menos en mi experiencia.

Answer 2

Puede hacerlo utilizando una plantilla de control:

<ControlTemplate> 
    ... Control stuff here 

    <ControlTemplate.Triggers> 
     <Trigger Property="Visibility" Value="Visible"> 
      <Trigger.EnterActions> 
       <BeginStoryboard Storyboard="{StaticResource AnimationStoryboard}" x:Name="AnimationBeginStoryboard"/> 
      </Trigger.EnterActions> 
      <Trigger.ExitActions> 
       <RemoveStoryboard BeginStoryboardName="AnimationBeginStoryboard"/> 
      </Trigger.ExitActions> 
     </Trigger> 
    </ControlTemplate.Triggers> 

</ControlTemplate>