Animation dans Compose
Restez organisé à l'aide des collections
Enregistrez et classez les contenus selon vos préférences.
Découvrez comment animer les valeurs d'état, utiliser des transitions, animer les changements de visibilité ou de taille et les fondus enchaînés à l'aide des API Compose Animation.
Points essentiels
- L'API
animate*AsState
est utile pour animer une seule valeur en fonction d'un changement d'état.
- Pour animer plusieurs valeurs simultanément, créez une transition avec la fonction
updateTransition
.
- Vous pouvez déclarer chaque valeur d'animation avec une fonction d'extension sur l'objet de transition.
- Pour personnaliser le comportement de l'animation, spécifiez le paramètre
transitionSpec
.
AnimatedVisibility
est utile pour animer l'apparition et la disparition.
- Personnalisez le comportement de l'animation en spécifiant des paramètres d'entrée et de sortie.
- Pour animer les changements de taille des éléments, utilisez le modificateur
animateContentSize
.
- Pour animer les modifications lorsque vous remplacez des parties de votre UI, utilisez le composable
Crossfade
.
Collections contenant ce guide
Ce guide fait partie de ces collections de guides rapides sélectionnées qui couvrent des objectifs de développement Android plus larges:
Principes de base de Compose
Cette série de vidéos présente différentes API Compose, et vous montre rapidement ce qui est disponible et comment les utiliser.
Afficher les images
Découvrez des techniques pour utiliser des visuels lumineux et attrayants afin de donner à votre application Android une belle apparence.
Le contenu et les exemples de code de cette page sont soumis aux licences décrites dans la Licence de contenu. Java et OpenJDK sont des marques ou des marques déposées d'Oracle et/ou de ses sociétés affiliées.
Dernière mise à jour le 2025/02/06 (UTC).
[[["Facile à comprendre","easyToUnderstand","thumb-up"],["J'ai pu résoudre mon problème","solvedMyProblem","thumb-up"],["Autre","otherUp","thumb-up"]],[["Il n'y a pas l'information dont j'ai besoin","missingTheInformationINeed","thumb-down"],["Trop compliqué/Trop d'étapes","tooComplicatedTooManySteps","thumb-down"],["Obsolète","outOfDate","thumb-down"],["Problème de traduction","translationIssue","thumb-down"],["Mauvais exemple/Erreur de code","samplesCodeIssue","thumb-down"],["Autre","otherDown","thumb-down"]],["Dernière mise à jour le 2025/02/06 (UTC)."],[],[],null,["# Animation in Compose\n\n\u003cbr /\u003e\n\nSee how to animate state values, using transitions, animating visibility or size\nchanges and crossfades by using the Compose animation APIs. \n\nKey points\n----------\n\n- The [`animate*AsState`](/reference/kotlin/androidx/compose/animation/core/package-summary#animateDpAsState(androidx.compose.ui.unit.Dp,androidx.compose.animation.core.AnimationSpec,kotlin.String,kotlin.Function1)) API is useful for animating a single value based on a state change.\n- To animate multiple values at the same time, create a transition with the [`updateTransition`](/reference/kotlin/androidx/compose/animation/core/package-summary#updateTransition(kotlin.Any,kotlin.String)) function.\n - You can declare each animation value with an extension function on the transition object.\n- To customize the animation behavior, specify the `transitionSpec` parameter.\n- [`AnimatedVisibility`](/reference/kotlin/androidx/compose/animation/package-summary#(androidx.compose.animation.core.Transition).AnimatedVisibility(kotlin.Function1,androidx.compose.ui.Modifier,androidx.compose.animation.EnterTransition,androidx.compose.animation.ExitTransition,kotlin.Function1)) is useful for animating appearance and disappearance.\n- Customize animation behavior by specifying parameters for enter and exit.\n- To animate size changes of elements, use the [`animateContentSize`](/reference/kotlin/androidx/compose/animation/package-summary#(androidx.compose.ui.Modifier).animateContentSize(androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function2)) modifier.\n- To animate changes when you swap out portions of your UI, use the [`Crossfade`](/reference/kotlin/androidx/compose/animation/package-summary#(androidx.compose.animation.core.Transition).Crossfade(androidx.compose.ui.Modifier,androidx.compose.animation.core.FiniteAnimationSpec,kotlin.Function1,kotlin.Function1)) composable.\n\nCollections that contain this guide\n-----------------------------------\n\nThis guide is part of these curated Quick Guide collections that cover\nbroader Android development goals: \n\n### Compose basics\n\nThis series of videos introduces various Compose APIs, quickly showing you what's available and how to use them. \n[Quick guide collection](/develop/ui/compose/quick-guides/collections/compose-basics) \n\n### Display images\n\nDiscover techniques for using bright, engaging visuals to give your Android app a beautiful look and feel. \n[Quick guide collection](/develop/ui/compose/quick-guides/collections/display-images) \n\nHave questions or feedback\n--------------------------\n\nGo to our frequently asked questions page and learn about quick guides or reach out and let us know your thoughts. \n[Go to FAQ](/quick-guides/faq) [Leave feedback](https://issuetracker.google.com/issues/new?component=1573691&template=1993320)"]]