How to disable scrolling in LazyColumn and Column

Question

I want to disable scrolling in my LazyColumn or Column.

Modifier.scrollable(state = rememberScrollState(), enabled = false, orientation = Orientation.Vertical)

or

Modifier.verticalScroll(...)

doesnt work.

Here is my Code:

Column(
        modifier = Modifier
            .fillMaxSize()
        ) {
        Box(
            modifier = Modifier
                .padding(15.dp)
                .height(60.dp)
                .clip(RoundedCornerShape(30))
        ) {
            TitleSection(text = stringResource(id = R.string...))
        }
            LazyColumn(
                contentPadding = PaddingValues(start = 7.5.dp, end = 7.5.dp, bottom = 100.dp),
                modifier = Modifier
                    .fillMaxHeight()
            ) {
                items(categoryItemContents.size) { items ->
                    CategoryItem(categoryItemContents[items], navController = navController)
                }
            }
    }

Does this answer your question? [How to disable and enable scrolling in LazyColumn/LazyRow in Jetpack Compose?](https://stackoverflow.com/questions/66502096/how-to-disable-and-enable-scrolling-in-lazycolumn-lazyrow-in-jetpack-compose) — Phil Dukhov, Dec 10 '21 at 15:53
Welcome on StackOverflow. See [How do I ask a good question](https://stackoverflow.com/help/how-to-ask). This sounds like you're trying to disable scrolling by adding `Modifier.scrollable` to `LazyColumn`. It doesn't work like this, new modifier is adding a new scroll view, you can't modify an existing one with the new modifier. Your code will work if it's the only scrollable modifier applied to `Column`. If I didn't guessed correcly, please edit your question by adding a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) — Phil Dukhov, Dec 10 '21 at 15:56
I updated my question. How can I edit the existing scrollable modifier? Looks like I have to use `LazyListState`, but with this solution [How to disable and enable scrolling in LazyColumn/LazyRow in Jetpack Compose?](https://stackoverflow.com/questions/66502096/how-to-disable-and-enable-scrolling-in-lazycolumn-lazyrow-in-jetpack-compose) the `LazyListState` is of type Unit. — TightPhysics, Dec 13 '21 at 20:06
If you follow [my answer](https://stackoverflow.com/a/69328009/3585796), you don't need `LazyListState`. — Phil Dukhov, Dec 14 '21 at 01:21

score 1 · Answer 1 · answered Dec 10 '21 at 16:19

A simple approach is to place the LazyColumn inside a Box that contains another Box. The nested Box can be composed to intercept scrolling, thus preventing the LazyColumn from receiving any scrolling events. To enable scrolling, just prevent the nested Box from being added. As for disabling scrolling in a Column, that is the default. Columns by default don't have scrolling:

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        startActivity(intent)

        setContent {
            var scrollingEnabled by remember { mutableStateOf(true) }

            Column() {
                Row(verticalAlignment = Alignment.CenterVertically) {
                    Text("Scrolling Enabled")

                    Switch(
                        checked = scrollingEnabled,
                        onCheckedChange = { scrollingEnabled = it }
                    )
                }

                Box(modifier = Modifier.fillMaxSize()) {
                    LazyColumn(Modifier.fillMaxWidth(), state = rememberLazyListState()) {
                        items((1..100).toList()) {
                            Text("$it")
                        }
                    }

                    if (!scrollingEnabled) {
                        Box(modifier = Modifier.fillMaxSize().verticalScroll(rememberScrollState())) {}
                    }
                }
            }
        }
    }
}

score 1 · Answer 2 · answered Dec 03 '22 at 19:29

1

With the LazyColumn you can use the userScrollEnabled parameter to disable the scrolling.

LazyColumn(
    state = state,
    userScrollEnabled = false
){
   //items
}

Note that you can still scroll programmatically using the state even when it is disabled.

answered Dec 03 '22 at 19:29

Gabriele Mariotti

320,139
94
887
841

How to disable scrolling in LazyColumn and Column

2 Answers2