edgeSwipeToDismiss

Modifier in Wear Material Compose

Handles swipe to dismiss from the edge of the viewport.

Used when the content of the [BasicSwipeToDismissBox] is handling all the gestures of the viewport, which prevents [BasicSwipeToDismissBox] from handling the swipe-to-dismiss gesture. Examples of this scenario are horizontal paging, such as 2-d scrolling a Map or swiping horizontally between pages.

Use of [Modifier.edgeSwipeToDismiss] defines a zone on the left side of the viewport of width [edgeWidth] in which the swipe-right gesture is intercepted. Other touch events are ignored - vertical scroll, click, long click, etc.

Currently Edge swipe, like swipe to dismiss, is only supported on the left part of the viewport regardless of layout direction as content is swiped away from left to right.

Requires that the element to which this modifier is applied exists within a [BasicSwipeToDismissBox] which is using the same [SwipeToDismissBoxState] instance.

Requires that the element to which this modifier is applied notifies the nested scroll system about the scrolling events that are happening on the element. For example, using a [NestedScrollDispatcher].

Example of a modifier usage with SwipeToDismiss

Last updated: 2025-02-05 12:19

Installation

dependencies {
   implementation("androidx.wear.compose:compose-material:1.5.0-alpha09")
}

Overloads

@Suppress("DEPRECATION")
@Deprecated(
    "SwipeToDismiss has been migrated to androidx.wear.compose.foundation. " +
        "Please import Modifier.edgeSwipeToDismiss from androidx.wear.compose.foundation instead.",
    replaceWith =
        ReplaceWith(
            "androidx.wear.compose.foundation.edgeSwipeToDismiss(",
            "swipeToDismissBoxState, edgeWidth)"
        )
)
fun Modifier.edgeSwipeToDismiss(
    swipeToDismissBoxState: SwipeToDismissBoxState,
    edgeWidth: Dp = SwipeToDismissBoxDefaults.EdgeWidth
): Modifier

Parameters

name	description
swipeToDismissBoxState	A state of SwipeToDismissBox. Used to trigger swipe gestures on SwipeToDismissBox
edgeWidth	A width of edge, where swipe should be recognised

Code Example

EdgeSwipeForSwipeToDismiss

@Composable
fun EdgeSwipeForSwipeToDismiss(navigateBack: () -> Unit) {
    val state = rememberSwipeToDismissBoxState()

    // When using Modifier.edgeSwipeToDismiss, it is required that the element on which the
    // modifier applies exists within a SwipeToDismissBox which shares the same state.
    SwipeToDismissBox(state = state, onDismissed = navigateBack) { isBackground ->
        val horizontalScrollState = rememberScrollState(0)
        if (isBackground) {
            Box(modifier = Modifier.fillMaxSize().background(MaterialTheme.colors.secondaryVariant))
        } else {
            Box(modifier = Modifier.fillMaxSize()) {
                Text(
                    modifier =
                        Modifier.align(Alignment.Center)
                            .edgeSwipeToDismiss(state)
                            .horizontalScroll(horizontalScrollState),
                    text =
                        "This text can be scrolled horizontally - to dismiss, swipe " +
                            "right from the left edge of the screen (called Edge Swiping)",
                )
            }
        }
    }
}