Home > Mobile >  How to prevent swipe one direction of Lazy Column/Row in Jetpack Compose?
How to prevent swipe one direction of Lazy Column/Row in Jetpack Compose?

Time:09-10

For example i have a lazy Column;

Box(
    modifier = Modifier.fillMaxSize(),
    contentAlignment = Alignment.Center
) {
    LazyColumn(Modifier.height(100.dp).border(2.dp, Color.Red)) {
        items(20){
            Text(text = "Swipe")
        }
    }
}

View;

enter image description here

I want to swipe only down not up. How can i achieve this?

CodePudding user response:

You can create a NestedScrollConnection and consume the upward scroll in there. Something like this:

val nestedScrollConnection = remember {
    object : NestedScrollConnection {
        override fun onPreScroll(available: Offset, source: NestedScrollSource): Offset {
            val delta = available.y
            return if (delta < 0) {
                Offset.Zero
            } else {
                Offset(available.x, available.y)
            }
        }
    }
}

Then just assign it to your LazyColumn modifier:

LazyColumn(Modifier.height(100.dp).border(2.dp, Color.Red).nestedScroll(nestedScrollConnection)) {
        items(20){
            Text(text = "Swipe")
        }
    }

Flip the if condition in the onPreScroll method if you want to block scroll in the other direction.

  • Related