Skip to content

Conversation

@Aghajari
Copy link
Contributor

Proposed Changes

This PR introduces a new optional parameter bottomOverlayContent to ModalBottomSheet, enabling developers to place persistent UI (e.g., action buttons) that is fixed at the bottom of the sheet during expansion, while animating out with the sheet when dismissed.

Many modal bottom sheets include critical actions (like "Confirm" or "Send") that should remain visible and accessible at the bottom, even as users scroll through long content. Currently, such content scrolls out of view or requires complex workarounds using Box and manual offset tracking. This is why I decided to copy part of the ModalBottomSheet code and modify it in my own project. After extensively testing this change in a production app with over 40 million users, where it has been live for a few months with zero reported issues, I’m now contributing it back via this PR.

ThebottomOverlayContent is implemented via a custom Layout inside a BoxScope, aligned to Alignment.BottomCenter. It measures its children with constraints limited by sheetMaxWidth, computes the content’s intrinsic size, and derives the initial anchor position from SheetState (preferring PartiallyExpanded, falling back to a fraction of Hidden). Using the draggable offset, it calculates a vertical translation that keeps the content pinned to the sheet’s bottom during expansion. On collapse, this offset increases smoothly, causing the content to slide out from the bottom in sync with the sheet’s dismissal animation.

Testing

Test: Manually and in production

Sample:

ModalBottomSheet(
    onDismissRequest = { /* ... */ },
    bottomOverlayContent = {
        Button(
            onClick = { /* Confirm */ },
            modifier = Modifier
                .fillMaxWidth()
                .padding(16.dp),
        ) {
            Text("Confirm")
        }
    },
) {
    LazyColumn { /* Long scrollable content */ }
}

UI tests have not been added for this change, please let me know if they are required for acceptance.

@Aghajari Aghajari requested a review from dlam as a code owner November 15, 2025 20:28
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant