android-coil-compose

Android Coil Compose

When To Use

• Use this skill when the request is about: coil compose image loading, asyncimage android compose, rememberasyncimagepainter android.
• Primary outcome: Use Coil in Jetpack Compose with AsyncImage, painter variants, sizing, and accessible image loading patterns.
• Reach for this skill when the work is specifically about image loading, placeholders, error states, sizing, or list performance in Compose.
• Read references/patterns.md for the AsyncImage vs painter vs subcomposition decision guide.
• Read references/scenarios.md for list-performance and screenshot-stable validation paths.
• Handoff skills when the scope expands:
• android-compose-foundations
• android-compose-performance

Workflow

1. Identify whether the UI needs a simple image surface, low-level painter access, or custom slot-based loading states.
2. Prefer AsyncImage first, then drop down to painter APIs only when the component truly needs them.
3. Constrain size, placeholders, and content description so the image behavior is both performant and accessible; for painter APIs, supply an explicit size resolver when needed.
4. Check list rendering, state churn, and visual fallbacks before considering the implementation done, and confirm that remote data or decoder modules are actually present when the source type needs them.
5. Hand off general Compose layout or broader performance issues to the neighboring skills after the image pipeline is stable.

Guardrails

• Prefer AsyncImage for most Compose surfaces.
• Keep image requests sized to the rendered UI surface when possible.
• Provide meaningful accessibility behavior: descriptive contentDescription for informative images, null for decorative ones.
• Avoid subcomposition-heavy image patterns in scroll-heavy lists unless the UX truly needs them.
• If you need painter state directly, remember that rememberAsyncImagePainter does not infer on-screen size by itself.

Anti-Patterns

• Loading full-size remote assets into tiny list items.
• Using SubcomposeAsyncImage everywhere when a simple placeholder is enough.
• Treating image loading failures as silent no-ops with no error fallback.
• Forgetting accessibility semantics on actionable or informative images.