---
title: "toggleable"
description: "Configure component to make it toggleable via input and accessibility events

This version has no [MutableInteractionSource] or [Indication] parameters, the default indication
from [LocalIndication] will be used. To specify [MutableInteractionSource] or [Indication], use
the other overload.

If you are only creating this toggleable modifier inside composition, consider using the other
overload and explicitly passing `LocalIndication.current` for improved performance. For more
information see the documentation on the other overload."
type: "modifier"
---

<div class='type'>Compose Modifier</div>

<a id='references'></a>
<div class='sourceset sourceset-common'>Common</div>


> **Deprecated** Replaced with new overload that only supports IndicationNodeFactory instances inside LocalIndication, and does not use composed

```kotlin
fun Modifier.toggleable(
    value: Boolean,
    enabled: Boolean = true,
    role: Role? = null,
    onValueChange: (Boolean) -> Unit,
) =
    composed(
        inspectorInfo =
            debugInspectorInfo {
                name = "toggleable"
                properties["value"] = value
                properties["enabled"] = enabled
                properties["role"] = role
                properties["onValueChange"] = onValueChange
            }
    ) {
        val localIndication = LocalIndication.current
        val interactionSource =
            if (localIndication is IndicationNodeFactory) {
                null
            } else {
                remember { MutableInteractionSource() }
            }
        Modifier.toggleable(
            value = value,
            interactionSource = interactionSource,
            indication = localIndication,
            enabled = enabled,
            role = role,
            onValueChange = onValueChange,
        )
    }
```


Configure component to make it toggleable via input and accessibility events

This version has no `MutableInteractionSource` or `Indication` parameters, the default indication
from `LocalIndication` will be used. To specify `MutableInteractionSource` or `Indication`, use
the other overload.

If you are only creating this toggleable modifier inside composition, consider using the other
overload and explicitly passing `LocalIndication.current` for improved performance. For more
information see the documentation on the other overload.

#### Parameters

| | |
| --- | --- |
| value | whether Toggleable is on or off |
| enabled | whether or not this `toggleable` will handle input events and appear enabled for semantics purposes |
| role | the type of user interface element. Accessibility services might use this to describe the element or do customizations |
| onValueChange | callback to be invoked when toggleable is clicked, therefore the change of the state in requested. |




<div class='sourceset sourceset-common'>Common</div>


```kotlin
fun Modifier.toggleable(
    value: Boolean,
    enabled: Boolean = true,
    role: Role? = null,
    interactionSource: MutableInteractionSource? = null,
    onValueChange: (Boolean) -> Unit,
): Modifier
```


Configure component to make it toggleable via input and accessibility events

This overload will use the `Indication` from `LocalIndication`. Use the other overload to
explicitly provide an `Indication` instance. Note that this overload only supports
`IndicationNodeFactory` instances provided through `LocalIndication` - it is strongly recommended
to migrate to `IndicationNodeFactory`, but you can use the other overload if you still need to
support `Indication` instances that are not `IndicationNodeFactory`.

If `interactionSource` is `null`, an internal `MutableInteractionSource` will be lazily created
only when needed. This reduces the performance cost of toggleable during composition, as creating
the `indication` can be delayed until there is an incoming
`androidx.compose.foundation.interaction.Interaction`. If you are only passing a remembered
`MutableInteractionSource` and you are never using it outside of toggleable, it is recommended to
instead provide `null` to enable lazy creation. If you need the `Indication` to be created
eagerly, provide a remembered `MutableInteractionSource`.

#### Parameters

| | |
| --- | --- |
| value | whether Toggleable is on or off |
| enabled | whether or not this `toggleable` will handle input events and appear enabled for semantics purposes |
| role | the type of user interface element. Accessibility services might use this to describe the element or do customizations |
| interactionSource | `MutableInteractionSource` that will be used to dispatch `PressInteraction.Press` when this toggleable is pressed. If `null`, an internal `MutableInteractionSource` will be created if needed. |
| onValueChange | callback to be invoked when toggleable is clicked, therefore the change of the state in requested. |




<div class='sourceset sourceset-common'>Common</div>


```kotlin
fun Modifier.toggleable(
    value: Boolean,
    interactionSource: MutableInteractionSource?,
    indication: Indication?,
    enabled: Boolean = true,
    role: Role? = null,
    onValueChange: (Boolean) -> Unit,
) =
    clickableWithIndicationIfNeeded(
        interactionSource = interactionSource,
        indication = indication,
    ) { intSource, indicationNodeFactory ->
        ToggleableElement(
            value = value,
            interactionSource = intSource,
            indicationNodeFactory = indicationNodeFactory,
            useLocalIndication = false,
            enabled = enabled,
            role = role,
            onValueChange = onValueChange,
        )
    }
```


Configure component to make it toggleable via input and accessibility events.

If `interactionSource` is `null`, and `indication` is an `IndicationNodeFactory`, an internal
`MutableInteractionSource` will be lazily created along with the `indication` only when needed.
This reduces the performance cost of toggleable during composition, as creating the `indication`
can be delayed until there is an incoming `androidx.compose.foundation.interaction.Interaction`.
If you are only passing a remembered `MutableInteractionSource` and you are never using it
outside of toggleable, it is recommended to instead provide `null` to enable lazy creation. If
you need `indication` to be created eagerly, provide a remembered `MutableInteractionSource`.

If `indication` is _not_ an `IndicationNodeFactory`, and instead implements the deprecated
`Indication.rememberUpdatedInstance` method, you should explicitly pass a remembered
`MutableInteractionSource` as a parameter for `interactionSource` instead of `null`, as this
cannot be lazily created inside toggleable.

#### Parameters

| | |
| --- | --- |
| value | whether Toggleable is on or off |
| interactionSource | `MutableInteractionSource` that will be used to dispatch `PressInteraction.Press` when this toggleable is pressed. If `null`, an internal `MutableInteractionSource` will be created if needed. |
| indication | indication to be shown when modified element is pressed. Be default, indication from `LocalIndication` will be used. Pass `null` to show no indication, or current value from `LocalIndication` to show theme default |
| enabled | whether or not this `toggleable` will handle input events and appear enabled for semantics purposes |
| role | the type of user interface element. Accessibility services might use this to describe the element or do customizations |
| onValueChange | callback to be invoked when toggleable is clicked, therefore the change of the state in requested. |




## Code Examples
### ToggleableSample
```kotlin
@Composable
fun ToggleableSample() {
    var checked by remember { mutableStateOf(false) }
    // content that you want to make toggleable
    Text(
        modifier = Modifier.toggleable(value = checked, onValueChange = { checked = it }),
        text = checked.toString(),
    )
}
```

