Android Animations and Transitions with Jetpack Compose

Explore animation APIs provided by Jetpack Compose to create a smooth and intuitive user experience in a declarative way. Animations add a polished look to your app, which gives it a higher-quality look and feel. 

Course Description

In this course, you will learn how to use different animation APIs in Jetpack Compose. First, you’ll get a high-level overview of various animation APIs available to use with Compose UI toolkit such as high-level and low-level animations. Next, you’ll dive into the details of those APIs and explore AnimatedVisibility, AnimatedContent, animateContentSize, Crossfade, updateTransition, infiniteRepeatable, animate*AsState, Animation, AnimationState, and Animatable. Once you get familiar with the fundamentals, you’ll learn how to use them in a real-world application (a complete application built with Android architecture components including Room database, Hilt dependency injection, DataStore, and ViewModel and following Android development best practices). You will also learn how to use the Lottie library to add beautiful and nicely crafted animations to your Jetpack Compose UI. Last but not least, you will learn important tips and best practices to optimize your Compose animations. By the end of the course, you will have a strong grasp of Jetpack Compose’s animation capabilities and techniques and be able to confidently use various animation APIs and techniques including list animations, gesture animations, and transitions.

By the end of the course you will have mastered:
  • High-level animations including animate*AsState, AnimatedContent, Crossfade, and updateTransition.
  • Low-level animations like animate, AnimationState, and Animatable.
  • Use simple high-level animations to animate components
  • Use low-level animations to animate components
  • Customise animations by providing a custom AnimationSpec to animation APIs 
  • Animate list items in Jetpack Compose 
  • Implement gesture-based animations using pointerInput modifier and Animatable
  • Make use of transition APIs in Jetpack Compose to animate between two or more states
  • Make infinite transitions
  • Use Lottie to add polished pre-designed animations to Jetpack Compose UI
  • Animate navigation between screens
Drag to resize

Meet the instructor

Drag to resize

Mehdi Haghgoo

Content Author & Course Instructor

I am Mehdi Haghgoo, a software developer and instructor. I love Android programming and keep a close eye on the latest trends in the Android industry. Learning about the latest technologies and sharing my knowledge with others through teaching is one of the most enjoyable things in my life.