Compose UI is a function of state. When state changes, Compose re-runs the affected composables — this is called recomposition.
State that survives recomposition
@Composable
fun Counter() {
var count by remember { mutableStateOf(0) }
Button(onClick = { count++ }) {
Text("Clicked $count times")
}
}
mutableStateOf creates observable state; remember keeps it across recompositions. Without remember, the value would reset every redraw.
Surviving configuration changes
Use rememberSaveable to keep state across screen rotation too.
var name by rememberSaveable { mutableStateOf("") }
Common mistake: Never store state in a plain
var outside remember — it will be lost on the next recomposition.Summary
State drives Compose UI. Use mutableStateOf + remember (or rememberSaveable for rotation) so values persist and changes trigger recomposition.