compose-graphics

Create a RuntimeShader with your AGSL source, then attach it via Modifier.graphicsLayer with RenderEffect.createRuntimeShaderEffect. Always gate on Build.VERSION.SDK_INT >= 33 and provide a fallback such as a static gradient for Android 12 and below.

MotionScheme.expressive uses springs with more overshoot and longer settle for hero moments, FABs, and primary CTAs, while standard is calmer and suits chrome, lists, and navigation. Scope expressive to roughly 1-3% of the UI to avoid a chaotic feel.

No, RuntimeShader requires Android 13 (API 33) or higher. On older versions, render the content unmodified or use alternatives like Modifier.blur or a static gradient overlay instead of crashing.

Use spatial specs (springs) for physical properties like position, size, and scale, and effects specs (tweens) for opacity, color, and elevation. A spring on alpha can overshoot into invalid ranges and looks broken.

Common causes are allocating new Path objects inside DrawScope every frame and reading volatile state directly in Canvas. Reuse a remembered Path with rewind, wrap volatile reads in derivedStateOf, and keep draws under roughly 200 per frame.

Fold effects that always run together into a single shader pass, since each chained graphicsLayer adds a full render pass. Chain at most two passes when effects need independent runtime toggling.