Animation de boutons WPF à l'intérieur d'un style

Question

Je suis actuellement en train d'essayer d'animer des boutons sur mes formulaires en utilisant WPF - cela fait partie d'un cours universitaire, il s'agit donc de démontrer des connaissances plutôt que de bien paraître.

On nous a montré comment animer par bouton, mais comme je veux que l'animation soit la même sur tous les boutons, j'utilise un style - quelque chose qu'on ne nous a pas enseigné et pour lequel trouver la documentation est comme trouver des preuves de Big Foot, IMO.

Mon code est jusqu'à présent ceci:

<Style TargetType="{x:Type Button}" x:Key="ButtonAnimation"> 
      <Style.Triggers> 
       <EventTrigger RoutedEvent="Button.Click"> 
        <EventTrigger.Actions> 
        <BeginStoryboard> 
         <Storyboard> 
          <DoubleAnimation Storyboard.TargetProperty="Angle" 
               To="360" Duration="0:0:1" 
               FillBehavior="Stop" /> 
         </Storyboard> 
        </BeginStoryboard> 
        <BeginStoryboard> 
         <Storyboard> 
          <DoubleAnimation Storyboard.TargetProperty="ScaleY" 
               To="0.1" Duration="0:0:0.5" 
               FillBehavior="Stop" AutoReverse="True" /> 
         </Storyboard> 
        </BeginStoryboard> 
        <BeginStoryboard> 
         <Storyboard> 
          <DoubleAnimation Storyboard.TargetProperty="ScaleX" 
               To="0.1" Duration="0:0:0.5" 
               FillBehavior="Stop" AutoReverse="True" /> 
         </Storyboard> 
        </BeginStoryboard> 
        </EventTrigger.Actions> 
       </EventTrigger> 
      </Style.Triggers> 
     </Style> 
    </Window.Resources>  

Le TargetProperty = « » valeurs sont incorrectes, et pour la vie de moi, je ne trouve nulle part en ligne qui montre ce qui devrait être là. Les valeurs actuellement présentes sont ce que vous auriez si l'animation était appliquée à chaque bouton plutôt que dans un style.

Comment puis-je faire fonctionner ceci? Quelle est la propriété TargetProperty correcte?

Answer 1

Je pense que ce ...

Storyboard.TargetProperty="Angle" 

... doit être ...

Storyboard.TargetProperty="(Button.RenderTransform).(RotateTransform.Angle)" 

Et les autres:

Storyboard.TargetProperty="(Button.RenderTransform).(ScaleTransform.ScaleY)" 
Storyboard.TargetProperty="(Button.RenderTransform).(ScaleTransform.ScaleX)" 

Vous pourriez avoir à remplacer RenderTransform avec LayoutTransform, en fonction de ce que vous utilisez dans votre balisage.

Cependant, cela ne fonctionnera que si vous avez seulement l'un des deux Transforms, à savoir RotateTransformouScaleTransform. Si vous les avez dans un TransformGroup, les choses deviennent encore plus compliquées. Si vous avez défini le RotateTransform comme le premier enfant et le ScaleTransform comme le deuxième enfant du TransformGroup, alors cela devrait fonctionner (non testé):

(Button.RenderTransform).(TransformGroup.Children)[0].(RotateTransform.Angle) 
(Button.RenderTransform).(TransformGroup.Children)[1].(ScaleTransform.X) 
(Button.RenderTransform).(TransformGroup.Children)[1].(ScaleTransform.Y) 

Cependant, vous devez être prudent lorsque vous modifiez l'ordre du Transforme ou supprime l'un d'entre eux car cela va briser vos animations ...

Bonne chance!