Ahmet Burak Ilhan
Ahmet Burak Ilhan

Reputation: 273

How to disable swipe on screen ModalBottomSheetLayout in Jetpack Compose

I am working with a ModalBottomSheet in Jetpack Compose and I need to disable the swipe feature. While I found a workaround that partially solves my issue, it introduced a new problem. Specifically, the LazyColumn inside the ModalBottomSheet is no longer scrollable.

Here's the modifier extension I found on the Google issue tracker, which helped to disable vertical scrolling:


fun Modifier.verticalScrollDisabled() =
    pointerInput(Unit) {
        awaitPointerEventScope {
            while (true) {
                awaitPointerEvent(pass = PointerEventPass.Initial).changes.forEach {
                    val offset = it.positionChange()
                    if (abs(offset.y) > 0f) {
                        it.consume()
                    }
                }
            }
        }
    }

This does disable the swipe down to dismiss behavior of the ModalBottomSheet, but at the cost of disabling vertical scrolling in my LazyColumn too. Also I don't think this is best practice :)

Upvotes: 3

Views: 5346

Answers (1)

Vivek Hande
Vivek Hande

Reputation: 999

I found the solution, after spending a lot of time, I gone through the ModalBottomSheetLayout documentation, there is attribute

sheetGesturesEnabled = false

by default its true, when you are implementing ModalBottomSheetLayout then simply pass sheetGesturesEnabled = false, hope you will solved your problem, Happy Coding :)

Sharing sample code

val animationSpec = remember {
        Animatable(0f)
            .run {
                TweenSpec<Float>(durationMillis = 300)
            }
    }

val modalBottomSheetState = rememberModalBottomSheetState(
        initialValue = ModalBottomSheetValue.Hidden,
        animationSpec = animationSpec,
        confirmValueChange = { value ->
            value != ModalBottomSheetValue.Expanded
        },
        skipHalfExpanded = true
    )

 ModalBottomSheetLayout(
        sheetState = modalBottomSheetState,
        sheetElevation = 0.dp,
        sheetGesturesEnabled = false,
        sheetContent = {
            //Your content 
        },
        sheetBackgroundColor = Color.White,
        sheetShape = RoundedCornerShape(topStart = 14.dp, topEnd = 14.dp)
    ) { }

Upvotes: 3

Related Questions