Animación de visibilidad de panel de WPF

Question

Tengo un panel de distribución con un botón que, al hacer clic, hace que desaparezca el panel de distribución. Quiero animar el formulario de transición visible a oculto, pero no he podido.

miré alrededor por un tiempo y chocó en algo que se parece a esto:

<StackPanel Margin="80,60,60,80" Background="Gray"> 
      <StackPanel.Triggers > 

       <EventTrigger > 
        <EventTrigger.Actions> 
         <BeginStoryboard> 
          <Storyboard TargetProperty="Visibility"> 

           <DoubleAnimation Duration="0:0:5:0" From="Visible" To="Hidden"/> 

          </Storyboard> 
         </BeginStoryboard> 
        </EventTrigger.Actions> 
       </EventTrigger> 

      </StackPanel.Triggers> 
      <Button Name="buttonTop" Content="TOP" Margin="40,40,40,40" Click="buttonTop_Click" Width="131" /> 
     </StackPanel> 

que por supuesto, no es 100% todavía. ¿Algunas ideas?

Gracias

Answer 1

Puede utilizar

<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ItemsHost" 
           Storyboard.TargetProperty="Visibility"> 
    <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="{x:Static Visibility.Visible}"/> 
</ObjectAnimationUsingKeyFrames> 

Esto es más o menos un regulador en un guión gráfico, donde KeyTime describe el momento en que el valor debe establecerse. Así que el guión completo sería así:

<BeginStoryboard> 
    <Storyboard> 
     <DoubleAnimation Storyboard.TargetProperty="Opacity" 
         To="0" Duration="0:0:5.0"/> 
     <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility"> 
      <DiscreteObjectKeyFrame KeyTime="0:0:5.0" Value="{x:Static Visibility.Hidden}"/> 
     </ObjectAnimationUsingKeyFrames> 
    </Storyboard> 
</BeginStoryboard> 

edición: ¿Cómo hacer que el gatillo del guión gráfico cuando se hace clic en el botón:

<Button Content="Button" HorizontalAlignment="Left" Margin="337,221,0,0" VerticalAlignment="Top" Width="75"> 
    <Button.Triggers> 
     <EventTrigger RoutedEvent="Button.Click"> 
      <BeginStoryboard> 
       <Storyboard> 
        <DoubleAnimation Storyboard.TargetProperty="Opacity" 
       To="0" Duration="0:0:5.0"/> 
        <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility"> 
         <DiscreteObjectKeyFrame KeyTime="0:0:5.0" Value="{x:Static Visibility.Hidden}"/> 
        </ObjectAnimationUsingKeyFrames> 
       </Storyboard> 
      </BeginStoryboard> 
     </EventTrigger> 
    </Button.Triggers> 
</Button> 

Answer 2

Visibiltiy es un valor discreto - es encendido o apagado, por lo que anima todavía dará lugar a una repentina desaparición gradual en lugar de un desvanecimiento. En su lugar podría animar la Opacity del StackPanel de 1 a 0, y luego animar la Visibilty a Hidden (o Collapsed) después de eso.