Jetpack Compose Basics

June 02, 2026 1 min read

Jetpack Compose is Android's modern UI toolkit. Instead of XML, you describe the UI as Kotlin functions that re-run automatically when data changes ("declarative UI").

A composable function

@Composable
fun Greeting(name: String) {
    Text(text = "Hello, $name")
}

// Host it in an Activity:
setContent {
    MaterialTheme { Greeting("Android") }
}

State drives the UI

When state changes, Compose recomposes (re-draws) only what depends on it.

@Composable
fun Counter() {
    var count by remember { mutableStateOf(0) }
    Button(onClick = { count++ }) {
        Text("Clicked $count times")
    }
}

Layout basics

  • Column stacks children vertically, Row horizontally, Box overlaps them.
  • Modifier adjusts size, padding, click, background: Modifier.padding(16.dp).fillMaxWidth().
Tip: New projects should usually start with Compose — it is where Android UI is heading.

Summary

Compose builds UI from Kotlin functions that react to state. You learned composables, state with remember, and basic layout.