SwipeToDismissBox

Composable Component

Wear Material 3 SwipeToDismissBox that handles the swipe-to-dismiss gesture. Takes a single slot for the background (only displayed during the swipe gesture) and the foreground content.

Android

@Composable
public fun SwipeToDismissBox(
    state: SwipeToDismissBoxState,
    modifier: Modifier = Modifier,
    backgroundScrimColor: Color = MaterialTheme.colorScheme.background,
    contentScrimColor: Color = MaterialTheme.colorScheme.background,
    backgroundKey: Any = SwipeToDismissKeys.Background,
    contentKey: Any = SwipeToDismissKeys.Content,
    userSwipeEnabled: Boolean = true,
    content: @Composable BoxScope.(isBackground: Boolean) -> Unit,
)

Parameters


state	State containing information about ongoing swipe or animation.
modifier	`Modifier` for this component.
backgroundScrimColor	`Color` for background scrim.
contentScrimColor	`Color` used for the scrim over the content composable during the swipe gesture.
backgroundKey	`key` which identifies the content currently composed in the `content` block when isBackground == true. Provide the backgroundKey if your background content will be displayed as a foreground after the swipe animation ends (as is common when `SwipeToDismissBox` is used for the navigation). This allows remembered state to be correctly moved between background and foreground.
contentKey	`key` which identifies the content currently composed in the `content` block when isBackground == false. See `backgroundKey`.
userSwipeEnabled	Whether the swipe gesture is enabled. (e.g. when there is no background screen, set userSwipeEnabled = false)
content	Slot for content, with the isBackground parameter enabling content to be displayed behind the foreground content - the background is normally hidden, is shown behind a scrim during the swipe gesture, and is shown without scrim once the finger passes the swipe-to-dismiss threshold.

Android

@Composable
public fun SwipeToDismissBox(
    onDismissed: () -> Unit,
    modifier: Modifier = Modifier,
    state: SwipeToDismissBoxState = rememberSwipeToDismissBoxState(),
    backgroundScrimColor: Color = MaterialTheme.colorScheme.background,
    contentScrimColor: Color = MaterialTheme.colorScheme.background,
    backgroundKey: Any = SwipeToDismissKeys.Background,
    contentKey: Any = SwipeToDismissKeys.Content,
    userSwipeEnabled: Boolean = true,
    content: @Composable BoxScope.(isBackground: Boolean) -> Unit,
)

Parameters


onDismissed	Executes when the swipe to dismiss has completed.
modifier	`Modifier` for this component.
state	State containing information about ongoing swipe or animation.
backgroundScrimColor	`Color` for background scrim.
contentScrimColor	`Color` used for the scrim over the content composable during the swipe gesture.
backgroundKey	`key` which identifies the content currently composed in the `content` block when isBackground == true. Provide the backgroundKey if your background content will be displayed as a foreground after the swipe animation ends (as is common when `SwipeToDismissBox` is used for the navigation). This allows remembered state to be correctly moved between background and foreground.
contentKey	`key` which identifies the content currently composed in the `content` block when isBackground == false. See `backgroundKey`.
userSwipeEnabled	Whether the swipe gesture is enabled. (e.g. when there is no background screen, set userSwipeEnabled = false)
content	Slot for content, with the isBackground parameter enabling content to be displayed behind the foreground content - the background is normally hidden, is shown behind a scrim during the swipe gesture, and is shown without scrim once the finger passes the swipe-to-dismiss threshold.