Les animations peuvent ajouter des repères visuels pour informer les utilisateurs de ce qui se passe dans votre application. Ils sont particulièrement utiles lorsque l'interface utilisateur change d'état (par exemple lorsque de nouveaux contenus se chargent ou que de nouvelles actions deviennent disponibles). Les animations permettent également d'améliorer l'aspect général de l'application, pour la rendre plus élégante.
Android inclut différentes API d'animation en fonction du type d'animation souhaité. Cette documentation présente les différentes façons d'ajouter du mouvement à votre UI.
Pour mieux comprendre quand utiliser des animations, consultez également le guide Material Design sur le mouvement.
Animer des bitmaps
Figure 1 : Un drawable animé.
Pour animer un graphique bitmap tel qu'une icône ou une illustration, utilisez les API d'animation de drawable. En général, ces animations sont définies de manière statique avec une ressource de dessin, mais vous pouvez également définir le comportement de l'animation au moment de l'exécution.
Par exemple, une bonne façon de communiquer à l'utilisateur que deux actions sont liées consiste à animer un bouton de lecture qui se transforme en bouton de pause lorsqu'il est appuyé.
Pour en savoir plus, consultez Animer des images Drawable.
Animer la visibilité et le mouvement de l'UI
Figure 2. Une animation subtile lorsqu'une boîte de dialogue s'affiche et disparaît rend le changement d'UI moins choquant.
Lorsque vous devez modifier la visibilité ou la position des vues dans votre mise en page, il est préférable d'inclure des animations subtiles pour aider l'utilisateur à comprendre comment l'UI évolue.
Pour déplacer, afficher ou masquer des vues dans la mise en page actuelle, vous pouvez utiliser le système d'animation de propriétés fourni par le package android.animation
, disponible dans Android 3.0 (niveau d'API 11) et versions ultérieures. Ces API mettent à jour les propriétés de vos objets View
sur une période donnée, en redessinant continuellement la vue à mesure que les propriétés changent. Par exemple, lorsque vous modifiez les propriétés de position, la vue se déplace sur l'écran. Lorsque vous modifiez la propriété alpha, la vue apparaît ou disparaît progressivement.
Pour créer ces animations de la manière la plus simple possible, activez les animations sur votre mise en page. Ainsi, lorsqu'une vue change de visibilité, une animation s'applique automatiquement. Pour en savoir plus, consultez Animer automatiquement les mises à jour de la mise en page.
Pour apprendre à créer des animations à l'aide du système d'animation des propriétés, consultez Présentation de l'animation des propriétés. Vous pouvez également consulter les pages suivantes pour créer des animations courantes :
Mouvement basé sur la physique
Figure 3. Animation créée avec ObjectAnimator.
Figure 4. Animation créée avec des API basées sur la physique.
Dans la mesure du possible, appliquez des lois physiques réalistes à vos animations pour qu'elles aient l'air naturelles. Par exemple, ils doivent maintenir leur élan lorsque leur cible change et effectuer des transitions fluides lors de tout changement.
Pour fournir ces comportements, la bibliothèque d'assistance Android inclut des API d'animation basées sur la physique qui s'appuient sur les lois de la physique pour contrôler le déroulement de vos animations.
Voici deux animations courantes basées sur la physique :
Les animations non basées sur la physique, telles que celles créées avec les API ObjectAnimator
, sont assez statiques et ont une durée fixe. Si la valeur cible change, vous devez annuler l'animation au moment du changement de valeur cible, reconfigurer l'animation avec une nouvelle valeur comme nouvelle valeur de départ et ajouter la nouvelle valeur cible. Visuellement, ce processus crée un arrêt brusque de l'animation et un mouvement décousu par la suite, comme illustré à la figure 3.
Les animations créées avec des API d'animation basées sur la physique, telles que DynamicAnimation
, sont régies par la force. La modification de la valeur cible entraîne une modification de la force. La nouvelle force s'applique à la vitesse existante, ce qui permet une transition continue vers la nouvelle cible. Ce processus permet d'obtenir une animation plus naturelle, comme illustré à la figure 4.
Animer les changements de mise en page
Figure 5. Pour afficher plus de détails, vous pouvez modifier la mise en page ou démarrer une nouvelle activité.
Sur Android 4.4 (niveau d'API 19) ou version ultérieure, vous pouvez utiliser le framework de transition pour créer des animations lorsque vous échangez la mise en page dans l'activité ou le fragment en cours. Il vous suffit de spécifier la mise en page de départ et d'arrivée, ainsi que le type d'animation que vous souhaitez utiliser. Le système détermine ensuite l'animation à exécuter entre les deux mises en page et l'exécute. Vous pouvez l'utiliser pour remplacer l'intégralité de l'UI ou pour déplacer ou remplacer uniquement certaines vues.
Par exemple, lorsque l'utilisateur appuie sur un élément pour en savoir plus, vous pouvez remplacer la mise en page par les détails de l'élément, en appliquant une transition comme celle illustrée à la figure 5.
La mise en page de début et de fin sont chacune stockées dans un Scene
, bien que la scène de début soit généralement déterminée automatiquement à partir de la mise en page actuelle. Vous créez un Transition
pour indiquer au système le type d'animation souhaité, puis vous appelez TransitionManager.go()
. Le système exécute alors l'animation pour inverser les mises en page.
Pour en savoir plus, consultez Animer les changements de mise en page à l'aide d'une transition. Pour obtenir un exemple de code, consultez BasicTransition.
Animer les transitions entre les activités
Sur Android 5.0 (niveau d'API 21) ou version ultérieure, vous pouvez également créer des animations qui effectuent une transition entre vos activités. Il s'appuie sur le même framework de transition que celui décrit dans la section précédente, mais il vous permet de créer des animations entre des mises en page dans des activités distinctes.
Vous pouvez appliquer des animations simples, comme faire glisser la nouvelle activité depuis le côté ou la faire apparaître progressivement. Vous pouvez également créer des animations qui effectuent une transition entre les vues partagées dans chaque activité. Par exemple, lorsque l'utilisateur appuie sur un élément pour en savoir plus, vous pouvez passer à une nouvelle activité avec une animation qui agrandit cet élément de manière fluide pour qu'il remplisse l'écran, comme l'animation illustrée à la figure 5.
Comme d'habitude, vous appelez startActivity()
, mais vous lui transmettez un ensemble d'options fournies par ActivityOptions.makeSceneTransitionAnimation()
.
Ce groupe d'options peut inclure les vues partagées entre les activités afin que le framework de transition puisse les connecter pendant l'animation.
Pour obtenir des ressources supplémentaires, consultez les pages suivantes :