[ Web Proxy ]
URL:
Viewing: https://developer.android.com/develop/ui/compose/components/bottom-sheets-partial [Back]  [Original]
Partial bottom sheet  |  Jetpack Compose  |  Android Developers Skip to main content
Android Developers [Android Developers]
Essentials Design & Plan Develop Google Play Blog
Search:
Android Studio
Overview Tutorial Samples Docs Quick Guides
Android Developers [Android Developers]

Partial bottom sheet Stay organized with collections Save and categorize content based on your preferences.

You can partially show a bottom sheet and then let the user either make it full screen or dismiss it.

To do so, pass your ModalBottomSheet an instance of SheetState with skipPartiallyExpanded set to false.

Note: ModalBottomSheet is experimental. File any issues on the issue tracker.

Example

This example demonstrates how you can use the sheetState property of ModalBottomSheet to display the sheet only partially at first:

@Composable
fun PartialBottomSheet() {
    var showBottomSheet by remember { mutableStateOf(false) }
    val sheetState = rememberModalBottomSheetState(
        skipPartiallyExpanded = false,
    )

    Column(
        modifier = Modifier.fillMaxWidth(),
        horizontalAlignment = Alignment.CenterHorizontally,
    ) {
        Button(
            onClick = { showBottomSheet = true }
        ) {
            Text("Display partial bottom sheet")
        }

        if (showBottomSheet) {
            ModalBottomSheet(
                modifier = Modifier.fillMaxHeight(),
                sheetState = sheetState,
                onDismissRequest = { showBottomSheet = false }
            ) {
                Text(
                    "Swipe up to open sheet. Swipe down to dismiss.",
                    modifier = Modifier.padding(16.dp)
                )
            }
        }
    }
}

Key points about the code

In this example, note the following:

Results

When the user first presses the button, the sheet displays partially:

A bottom sheet that initially only fills part of the screen. The user can swipe to fill the screen with it, or dismiss it [A bottom sheet that initially only fills part of the screen. The user can swipe to fill the screen with it, or dismiss it] Figure 1. Partially displayed bottom sheet.

If the user swipes up on the sheet, it fills the screen:

A bottom sheet that the user has expanded to fill the screen. [A bottom sheet that the user has expanded to fill the screen.] Figure 2. Full-screen bottom sheet. Note: If you set skipPartiallyExpanded to true, the sheet opens immediately to full screen.

Additional resources

Content and code samples on this page are subject to the licenses described in the Content License. Java and OpenJDK are trademarks or registered trademarks of Oracle and/or its affiliates.

Last updated 2026-08-14 UTC.

[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2026-08-14 UTC."],[],[]]
Web Proxy Viewer  |  New URL  |  Original Page