State of Compose 2023 results are in! Click here to learn more

← Back to Wear Material Core

Switch

Component
in
Wear Material Core
. Since 1.3.0-alpha02

Overview

Code Examples

Switch provides an animated switch for use in material APIs.

@param modifier Modifier to be applied to the switch. This can be used to provide a content description for accessibility. @param checked Boolean flag indicating whether this switch is currently toggled on. @param enabled Boolean flag indicating the enabled state of the Switch (affects the color). @param onCheckedChange Callback to be invoked when Switch is clicked. If null, then this is passive and relies entirely on a higher-level component to control the state. @param interactionSource When also providing onCheckedChange, the MutableInteractionSource representing the stream of Interactions for the "toggleable" tap area - can be used to customise the appearance / behavior of the Switch. @param trackFillColor Composable lambda from which the fill color of the track will be obtained. @param trackStrokeColor Composable lambda from which the stroke color of the track will be obtained. @param thumbColor Composable lambda from which the thumb color will be obtained. @param thumbIconColor Composable lambda from which the icon color will be obtained. @param trackWidth Width of the track. @param trackHeight Height of the track. @param drawThumb Lambda function to draw the thumb of the switch. The lambda is invoked with trackFillColor as the icon color, along with the thumbColor, and the progress. @param progressAnimationSpec Animation spec to animate the progress. @param width Width of the switch. @param height Height of the switch.

Overloads

Switch

@RestrictTo(RestrictTo.Scope.LIBRARY_GROUP)
@Composable
fun Switch(
    modifier: Modifier,
    checked: Boolean,
    enabled: Boolean,
    onCheckedChange: ((Boolean) -> Unit)?,
    interactionSource: MutableInteractionSource,
    trackFillColor: @Composable (enabled: Boolean, checked: Boolean) -> State<Color>,
    trackStrokeColor: @Composable (enabled: Boolean, checked: Boolean) -> State<Color>,
    thumbColor: @Composable (enabled: Boolean, checked: Boolean) -> State<Color>,
    thumbIconColor: @Composable (enabled: Boolean, checked: Boolean) -> State<Color>,
    trackWidth: Dp,
    trackHeight: Dp,
    drawThumb: FunctionDrawThumb,
    progressAnimationSpec: TweenSpec<Float>,
    width: Dp,
    height: Dp,
)

Parameters

NameDescription
modifierModifier to be applied to the switch. This can be used to provide a content description for accessibility.
checkedBoolean flag indicating whether this switch is currently toggled on.
enabledBoolean flag indicating the enabled state of the Switch (affects the color).
onCheckedChangeCallback to be invoked when Switch is clicked. If null, then this is passive and relies entirely on a higher-level component to control the state.
interactionSourceWhen also providing onCheckedChange, the MutableInteractionSource representing the stream of Interactions for the "toggleable" tap area - can be used to customise the appearance / behavior of the Switch.
trackFillColorComposable lambda from which the fill color of the track will be obtained.
trackStrokeColorComposable lambda from which the stroke color of the track will be obtained.
thumbColorComposable lambda from which the thumb color will be obtained.
thumbIconColorComposable lambda from which the icon color will be obtained.
trackWidthWidth of the track.
trackHeightHeight of the track.
drawThumbLambda function to draw the thumb of the switch. The lambda is invoked with trackFillColor as the icon color, along with the thumbColor, and the progress.
progressAnimationSpecAnimation spec to animate the progress.
widthWidth of the switch.
heightHeight of the switch