android-compose-patterns

Jetpack Compose Patterns

Overview

Native Android (Jetpack Compose) is chosen when a task needs deep Android integration or the app is already native (see native-vs-flutter-decision). Same discipline as Flutter/SwiftUI: small stateless composables, state hoisted out, reusable atomic components.

Core principle: Composables are stateless functions of state. State is hoisted to a ViewModel; composables emit events upward.

Rules

• Stateless composables + state hoisting. A composable takes its state as parameters and exposes callbacks (onXxx) — it does not own app state. The screen-level composable connects a ViewModel to the stateless UI.
• ViewModel owns state and logic, exposed as StateFlow/UiState; the composable collects it with collectAsStateWithLifecycle(). Networking/business rules live in the ViewModel + repository, never in the composable.
• Model UI state as a sealed hierarchy: Loading | Data | Empty | Error — when over it renders every branch. No happy-path-only screens.
• Atomic components: shared library of reusable composables (atoms → molecules → organisms). Reuse before building; grep before adding.
• Material theme, not hardcoded values: MaterialTheme.colorScheme / typography / a spacing tokens object (MaterialTheme.spacing, see mobile-design-system-foundation) — never scattered Color(0xFF...) and magic dp. Support dark theme + dynamic color.
• remember/derivedStateOf to avoid recomputation; hoist remembered state only when it's genuinely local (scroll, text field).
• @Preview reusable composables in their key states, and across the matrix (see below).

Edge-to-edge (enforced from targetSdk 35)

• Call enableEdgeToEdge() before setContent in the activity — the opt-out is gone at targetSdk 35+.
• Consume insets at the Scaffold: use its innerPadding and Modifier.consumeWindowInsets(innerPadding) on the content so a nested scrollable doesn't double-apply it.
• IME padding: apply Modifier.imePadding() once, at the container that should move with the keyboard — applying it a second time further down the tree produces extra empty space.
• android:windowSoftInputMode="adjustResize" in the manifest for screens with text input.
• NavigationSuiteScaffold does not automatically propagate its padding to the content slot — apply insets explicitly inside it, don't assume it's handled.