Material 3 Radio Buttons in Jetpack Compose

Get started with Material 3 radio buttons in Jetpack Compose to create user-friendly interfaces for selecting a single option from a list.

Explore Radio Button Styles

Learn to implement a Material 3 radio button for single-option selection.

Standard Radio Button

Displays a list of radio buttons for selecting one option.

@Composable
fun RadioButtonSingleSelection(modifier: Modifier = Modifier) {
    val radioOptions = listOf("Calls", "Missed", "Friends")
    val (selectedOption, onOptionSelected) = remember { mutableStateOf(radioOptions[0]) }
    Column(modifier.selectableGroup()) {
        radioOptions.forEach { text ->
            Row(
                Modifier
                    .fillMaxWidth()
                    .height(56.dp)
                    .selectable(
                        selected = (text == selectedOption),
                        onClick = { onOptionSelected(text) },
                        role = Role.RadioButton
                    )
                    .padding(horizontal = 16.dp),
                verticalAlignment = Alignment.CenterVertically
            ) {
                RadioButton(
                    selected = (text == selectedOption),
                    onClick = null
                )
                Text(
                    text = text,
                    style = MaterialTheme.typography.bodyLarge,
                    modifier = Modifier.padding(start = 16.dp)
                )
            }
        }
    }
}
  

Use a Standard Radio Button when you want to select a single option from a list.

Examples:

• Choose a filter in a call log
• Select a preference in a settings form
• Pick a single option in a survey

---

Radio Button Properties

Understand the key properties used in the radio button example.

Property	Usage
selected*	Required: Indicates if the radio button is selected
onClick	Handles click events (null for accessibility)
enabled	Controls if the radio button is interactive
interactionSource	Observes interaction states (pressed, hovered, focused)