Comment animer ScaleY lorsque l'élément devient visible

Question

Je souhaite que l'élément d'interface utilisateur WPF semble se développer verticalement lorsque sa propriété de visibilité passe à "Visible". Je ne veux pas coder en dur la hauteur dans l'animation car je souhaite appliquer cette animation à n'importe quel élément de l'interface utilisateur en tant que style. Donc, j'essaie d'utiliser ScaleY mais je n'ai pas de chance. Voici le XAML pour le style et la zone de liste:

<Style x:Key="VerticalGrow" TargetType="ListBox"> 
    <Style.Triggers> 
     <Trigger Property="Visibility" Value="Visible"> 
      <Trigger.EnterActions> 
       <BeginStoryboard> 
        <Storyboard> 
         <DoubleAnimation Storyboard.TargetProperty="TransformGroup.ScaleTransform.ScaleY" BeginTime="0:0:0.5" From="0" To="1" Duration="0:0:0.5" /> 
        </Storyboard> 
       </BeginStoryboard> 
      </Trigger.EnterActions> 
     </Trigger> 
    </Style.Triggers> 
</Style> 


<ListBox Grid.Row="2" MaxHeight="60" MinHeight="60" Visibility="{Binding MyViewModel.ListBoxVisibility}" IsSynchronizedWithCurrentItem="False" ItemsSource="{Binding MyViewModel.ListBoxItems}" Style="{DynamicResource VerticalGrow}" IsTabStop="True"> 
</ListBox> 

je reçois une exception d'exécution se plaignant que:

« Impossible de convertir la valeur dans l'attribut « Style » pour objet de type « System.Windows.Style Impossible de résoudre toutes les références de propriété dans le chemin de propriété 'TransformGroup.RenderTransform.ScaleTransform.ScaleY' Vérifiez que les objets applicables prennent en charge les propriétés Erreur sur l'objet 'System.Windows.Controls.ListBox' dans le fichier de marquage 'MyApp; component/mainwindow .xaml 'Ligne 69 Position 399. "}

Answer 1

ListBox n'a pas de propriété TransformGroup. Je pense que vous souhaitez définir RenderTransform ou LayoutTransform sur ScaleTransform, puis l'animer.

<Style x:Key="VerticalGrow" TargetType="ListBox"> 
    <Setter Property="RenderTransform"> 
     <Setter.Value> 
      <ScaleTransform/> 
     </Setter.Value> 
    </Setter> 
    <Style.Triggers> 
     <Trigger Property="Visibility" Value="Visible"> 
      <Trigger.EnterActions> 
       <BeginStoryboard> 
        <Storyboard> 
         <DoubleAnimation 
          Storyboard.TargetProperty="RenderTransform.ScaleY" 
          BeginTime="0:0:0.5" From="0" To="1" Duration="0:0:0.5" /> 
        </Storyboard> 
       </BeginStoryboard> 
      </Trigger.EnterActions> 
     </Trigger> 
    </Style.Triggers> 
</Style>