Ajouter une animation qui sera passée après une modification d’état

Vous pouvez ajouter une animation à un état qui sera lue une fois que le contrôle passe à cet état. Par exemple, un bouton change de couleur lorsque vous placez le curseur de la souris dessus, ce qui est le résultat de la transition à l’état MouseOver. Si vous ajoutez une animation à l’état MouseOver, telle que le pivotage du bouton, cette animation s’exécutera après que le bouton change de couleur.

Pour ajouter une animation à un état

1. Passez en mode Espace d'animation. Cette opération déplace le panneau Objets et chronologie sous la planche graphique pour fournir davantage d’espace pour afficher la chronologie.

2. Sous États, sélectionnez l’état auquel vous souhaitez ajouter une animation.

3. Dans le panneau Objets et chronologie, cliquez sur Afficher la chronologie .

   

   Remarque :
   Lorsque Base est sélectionnée sous États, Afficher la chronologie  n’apparaît pas parce que vous n’êtes pas en mode enregistrement de l’état.

4. Si l’apparence du contrôle dans cet état est différente de son apparence par défaut (lorsque Base est sélectionnée), une image clé est déjà définie à la marque 0 seconde.

   

5. Pour ajouter d’autres animations, placez le curseur de lecture à un autre endroit de la chronologie, puis modifiez un objet sur la planche graphique.

   Par exemple, pour faire pivoter une carte à jouer déplacez le curseur de lecture  sur la marque 1 seconde, sélectionnez l’objet LayoutRoot dans le panneau Objets et chronologie, puis sous Transformer dans le panneau Propriétés, sélectionnez l’onglet Faire pivoter et définissez la propriété Angle sur 360.

   

6. Affichez votre animation en cliquant sur Lecture .

7. Appuyez sur la touche F5 pour tester votre application de l’état.

   Conseil :
   Si vous ne souhaitez pas que votre contrôle revienne à 0 degré lorsque l’état change à nouveau, vous pouvez définir le temps de transition sur 0 seconde pour cet état lorsqu’il passe à tous les autres états. Pour la procédure à suivre, voir Modifier la durée de transition entre les changements d’états.

Étapes suivantes

• Vous pouvez diffuser votre animation de l’état plusieurs fois ou en boucle ou l’inverser lorsqu’elle atteint la dernière image clé. Pour plus d’informations, voir Modifier une table de montage séquentiel pour la répétition ou l’inversion à la fin de son cycle.

• Vous pouvez ajuster la vitesse d’animation entre les images clés pour créer une animation plus naturelle. Pour plus d’informations, voir Changer l’interpolation d’animation entre les images clés.

• Si vous modifiez un modèle de contrôle système, vous pouvez appuyer sur la touche F5 pour voir les modifications dans votre application. Si vous travaillez avec un contrôle utilisateur, vous pouvez voir l’animation modifiée en action en faisant réagir votre contrôle utilisateur aux clics de souris. Pour plus d’informations, voir Modifier des états en réponse à l’interaction de l’utilisateur.