Ansicht am unteren Rand

Sie können ein Unterlegblatt teilweise anzeigen und den Nutzer dann entscheiden lassen, ob es den Vollbildmodus aktivieren oder schließen möchte.

Dazu übergeben Sie ModalBottomSheet eine Instanz von SheetState, bei der skipPartiallyExpanded auf false festgelegt ist.

Beispiel

In diesem Beispiel wird gezeigt, wie Sie mit der Eigenschaft sheetState von ModalBottomSheet das Tabellenblatt anfangs nur teilweise anzeigen lassen:

@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)
                )
            }
        }
    }
}
BottomSheet.kt

Wichtige Punkte zum Code

Beachten Sie in diesem Beispiel Folgendes:

• Mit showBottomSheet wird festgelegt, ob das untere Steuerfeld in der App angezeigt wird.
• sheetState ist eine Instanz von SheetState, bei der skipPartiallyExpanded falsch ist.
• ModalBottomSheet nimmt einen Modifikator an, der dafür sorgt, dass das Element im Vollbildmodus den gesamten Bildschirm einnimmt.
• ModalBottomSheet nimmt sheetState als Wert für den Parameter sheetState an.
  • Daher wird das Tabellenblatt beim ersten Öffnen nur teilweise angezeigt. Der Nutzer kann sie dann ziehen oder wischen, um sie im Vollbildmodus zu öffnen oder zu schließen.
• Mit dem Lambda-Ausdruck onDismissRequest wird festgelegt, was passiert, wenn der Nutzer versucht, das untere Steuerfeld zu schließen. In diesem Fall wird nur das Tabellenblatt entfernt.

Ergebnisse

Wenn der Nutzer die Schaltfläche zum ersten Mal drückt, wird das Tabellenblatt teilweise angezeigt:

Wenn der Nutzer auf dem Tabellenblatt nach oben wischt, füllt es den Bildschirm aus:

Zusätzliche Ressourcen

• Untere Blätter