toggleable

Modifier in Compose Foundation

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.

Last updated: 2024-10-14 12:17

Installation

dependencies {
   implementation("androidx.compose.foundation:foundation:1.8.0-alpha03")
}

Overloads

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

Parameters

name	description
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.

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

Parameters

name	description
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 Example

ToggleableSample

@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()
    )
}