CODEWITHSUNDEEP
androidmobileandroid-jetpack-composemodalbottomsheet
6rchid
6rchid

Reputation: 1303

ModalBottomSheet Intercepts when LazyColumn Scrolling Stops

I have a simple LazyColumn in a ModalBottomSheet. The issue is that when the LazyColumn scrolling comes to a stop the ModalBottomsSheet briefly takes scroll control for a second before LazyColumn regains control. The bottom sheet should only be draggable on the handle or when scrolling reaches the top.

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun SheetTest() {
    ModalBottomSheet(
        sheetState = rememberModalBottomSheetState(
            skipPartiallyExpanded = true,
            confirmValueChange = { it != SheetValue.Hidden } // Disabled dismiss for testing
        ),
        onDismissRequest = {},
        containerColor = Color.Blue
    ) {
        LazyColumn(modifier = Modifier.fillMaxSize()) {
            items(
                items = dummyPlaces // Random strings
            ) { text ->
                Text(
                    text = text,
                    fontSize = 48.sp,
                    color = Color.Green
                )
            }
        }
    }
}

I'm still a new at Compose but was wondering if there's way to fix this using NestedScrollConnection? I've tried nestedScroll(rememberNestedScrollInteropConnection()) but that wasn't useful.

I'm just surprised that nobody's asked about this considering how common this Composable setup is, or I just suck at finding answers. But any help would be appreciated! Here's a video demo - this is not a great user experience.

Upvotes: 4

Views: 185

Answers (1)

petereneric
petereneric

Reputation: 152

My case: I had the same scrolling issue with the exact same setup: LazyColumn inside a ModalBottomSheet

How to fix it: I was able to fix it by updating Compose Material 3 to 1.4.0-alpha06, since this undesired behavior obviously has been fixed in this version.

So within my libs.versions.toml file I changed this line:

material3Android = "1.3.1"

to this line:

material3Android = "1.4.0-alpha06"

--> After doing so please sync the project

A reference to the current version can be found in the official android developers docs.

If this works for you as well let me know and consider marking this answer as correct or vote for it, making it easier for others to find this solution.

Upvotes: 1

Related Questions