Compose Animation Flashcards
UI › Compose UI
- What does animateFloatAsState return, and when does it animate?
- It returns a State<Float> whose value smoothly animates whenever the target value you pass in changes. Reading the State in composition triggers recomposition as the value updates.
- What are the default enter and exit transitions of AnimatedVisibility?
- Enter defaults to fadeIn plus expandIn, and exit defaults to fadeOut plus shrinkOut. You override them via the enter and exit parameters, combining transitions with the plus operator.
- How does Crossfade differ from AnimatedContent?
- Crossfade only fades the old content out while fading the new in. AnimatedContent is more general: it animates between target states with a configurable transitionSpec and can size-transform, sliding or scaling content.
- When should you use updateTransition / rememberTransition instead of multiple animate*AsState calls?
- When several values must animate together driven by one target state. The Transition coordinates child animations (animateDp, animateColor, etc.), keeps them in sync, and is inspectable in tooling.
- What is Animatable and why is it considered low-level?
- Animatable holds a single animatable value and is driven imperatively from a coroutine via animateTo (animated) and snapTo (instant). You manage the launch/cancellation yourself, so it suits gestures and complex sequencing.
- How do you drive an animation from a drag gesture in Compose?
- Hold an Animatable, and inside pointerInput call snapTo to follow the finger during drag, then on release launch animateTo (often with a spring or decay) to settle or fling. snapTo cancels any in-flight animation.
- Why use rememberInfiniteTransition for a loading spinner instead of a loop with Animatable?
- InfiniteTransition is built for continuously repeating animations using infiniteRepeatable specs, runs efficiently, and stops automatically when it leaves composition, without you managing a coroutine loop.
- What does the animateContentSize() modifier do, and where must it sit in the chain?
- It animates a composable between its old and new measured sizes when content changes. Place it before (above) size modifiers like padding so the reported size includes them; order in the modifier chain matters.
- Contrast spring and tween animation specs.
- tween is duration-based with an easing curve (default 300ms). spring is physics-based with no fixed duration, parameterised by dampingRatio and stiffness, and can pick up the current velocity for natural, interruptible motion.