---
title: "SplitCheckboxButton"
description: "The Wear Material `SplitCheckboxButton` offers slots and a specific layout for a label and
secondaryLabel. The secondaryLabel is optional. The items are laid out with a column containing
the two label slots and a Checkbox at the end."
type: "component"
---

<div class='type'>Composable Component</div>



The Wear Material `SplitCheckboxButton` offers slots and a specific layout for a label and
secondaryLabel. The secondaryLabel is optional. The items are laid out with a column containing
the two label slots and a Checkbox at the end.

<a id='references'></a>

<div class='sourceset sourceset-android'>Android</div>


```kotlin
@Composable
public fun SplitCheckboxButton(
    checked: Boolean,
    onCheckedChange: (Boolean) -> Unit,
    toggleContentDescription: String?,
    onContainerClick: () -> Unit,
    modifier: Modifier = Modifier,
    enabled: Boolean = true,
    shape: Shape = CheckboxButtonDefaults.splitCheckboxButtonShape,
    colors: SplitCheckboxButtonColors = CheckboxButtonDefaults.splitCheckboxButtonColors(),
    toggleInteractionSource: MutableInteractionSource? = null,
    containerInteractionSource: MutableInteractionSource? = null,
    transformation: SurfaceTransformation? = null,
    containerClickLabel: String? = null,
    contentPadding: PaddingValues = CheckboxButtonDefaults.ContentPadding,
    secondaryLabel: @Composable (RowScope.() -> Unit)? = null,
    label: @Composable RowScope.() -> Unit,
)
```


#### Parameters

| | |
| --- | --- |
| checked | Boolean flag indicating whether this button is currently checked. |
| onCheckedChange | Callback to be invoked when this buttons checked status is changed. |
| toggleContentDescription | The content description for the checkbox control part of the component. |
| onContainerClick | Click listener called when the user clicks the main body of the button, the area behind the labels. |
| modifier | Modifier to be applied to the button. |
| enabled | Controls the enabled state of the button. When `false`, this button will not be clickable. |
| shape | Defines the button's shape. It is strongly recommended to use the default as this shape is a key characteristic of the Wear Material Theme. |
| colors | `SplitCheckboxButtonColors` that will be used to resolve the background and content color for this button in different states. |
| toggleInteractionSource | an optional hoisted `MutableInteractionSource` for observing and emitting `Interaction`s for this button's "toggleable" tap area. You can use this to change the button's appearance or preview the button in different states. Note that if `null` is provided, interactions will still happen internally. |
| containerInteractionSource | an optional hoisted `MutableInteractionSource` for observing and emitting `Interaction`s for this button's main body "clickable" tap area. You can use this to change the button's appearance or preview the button in different states. Note that if `null` is provided, interactions will still happen internally. |
| transformation | Transformation to be used when button appears inside a container that needs to dynamically change its content separately from the background. |
| containerClickLabel | Optional click label on the main body of the button for accessibility. |
| contentPadding | The spacing values to apply internally between the container and the content. |
| secondaryLabel | A slot for providing the button's secondary label. The contents are expected to be "start" aligned. |
| label | A slot for providing the button's main label. The contents are expected to be text which is "start" aligned. |






## Code Examples
### SplitCheckboxButtonSample
```kotlin
@Preview
@Composable
fun SplitCheckboxButtonSample() {
    var checked by remember { mutableStateOf(true) }
    SplitCheckboxButton(
        label = { Text("Split Checkbox Button", maxLines = 3, overflow = TextOverflow.Ellipsis) },
        checked = checked,
        onCheckedChange = { checked = it },
        toggleContentDescription = "Split Checkbox Button Sample",
        onContainerClick = {
            /* Do something */
        },
        containerClickLabel = "click",
        enabled = true,
    )
}
```