Checkbox

The Checkbox component has a checked or unchecked state, allowing users to select or deselect an option. It is customizable in appearance and behavior to fit different use cases and design requirements.

Usage

Basic example

// A simple checkbox already checked
Checkbox(
    checked = true,
    onCheckedChange = { checked -> /* Handle checked state change */ },
)

// A simple checkbox not checked
Checkbox(
    checked = false,
    onCheckedChange = { checked -> /* Handle checked state change */ },
)

Checkbox with text

Checkbox(
    text = "This is checkbox",
    checked = true,
    onCheckedChange = { checked -> /* Handle checked state change */ },
)

Checkbox with custom style

Checkbox(
    text = "This is a customized checkbox",
    checked = true,
    textStyle = MaterialTheme.typography.titleLarge,
    colors = CheckboxDefaults.colors(
        contentColor = MaterialTheme.colorScheme.primary,
        checkedColor = Color.LightGray,
        checkmarkColor = Color.Red,
    ),
    contentPadding = 8.dp,
)