Advanced Layout Animations in Compose - Shared Elements

This course explains how Jetpack Compose’s Lookahead layout system supports shared element transitions. It covers transition APIs and animation specifications, modifier behavior, predictive back, and the composition, layout, and drawing phases behind the feature.

Syllabus

Introduction
Basic layout animations
How do layout animations work
Lookahead
Use cases for Lookahead
Shared elements
SharedTransitionLayout
Modifier.sharedElement
Custom animation specs
Modifier.sharedBounds
ResizeMode
Overlay
Modifier.skipToLookaheadSize
Clipping
Modifier ordering
Predictive Back
Shared elements under the hood
Composition Phase
Layout Phase
Drawing Phase
Overlay under the hood
Challenges with overlay
Summary