部分底部动作条

您可以部分显示底部动作条，然后让用户 全屏或关闭通知。

为此，请向 ModalBottomSheet 传递 SheetState 的实例 skipPartiallyExpanded 设置为 false。

示例

此示例演示了如何使用 sheetState 属性（ 使用 ModalBottomSheet，最初仅显示部分工作表：

@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

代码要点

在此示例中，请注意以下几点：

• showBottomSheet 用于控制应用是否显示底部动作条。
• sheetState 是 SheetState 的实例，其中 skipPartiallyExpanded 为 false。
• ModalBottomSheet 接受一个修饰符来确保填满整个屏幕 完全展开后。
• ModalBottomSheet 将 sheetState 作为其 sheetState 的值 参数。
  • 因此，工作表在首次打开时仅显示部分内容。通过 用户随后可以拖动或滑动屏幕，使其全屏显示或关闭。
• onDismissRequest lambda 用于控制用户尝试 关闭底部动作条。在本例中，此操作仅移除工作表。

结果

当用户首次按下该按钮时，动作条会显示部分内容：

如果用户在工作表上向上滑动，它会填满整个屏幕：

其他资源

• 底部动作条