如何在Jetpack Compose中将BottomSheetScaffold展开到指定高度

以下方案针对Jetpack Compose不同版本的BottomSheetScaffold生效，可实现不受内容长度影响、始终展开到指定高度的效果：

方案1：适配Material 2版本 #

核心逻辑是重写BottomSheetState的锚点计算规则，强制将展开状态的锚点值绑定为你需要的固定高度：

@Composable
fun rememberFixedHeightBottomSheetState(
    fixedExpandHeight: Dp,
    initialValue: BottomSheetValue = BottomSheetValue.Collapsed,
    confirmStateChange: (BottomSheetValue) -> Boolean = { true }
): BottomSheetState {
    val density = LocalDensity.current
    val expandHeightPx = with(density) { fixedExpandHeight.toPx() }
    return remember(initialValue, confirmStateChange, expandHeightPx) {
        BottomSheetState(
            initialValue = initialValue,
            confirmStateChange = confirmStateChange,
            anchors = mapOf(
                0f to BottomSheetValue.Collapsed,
                expandHeightPx to BottomSheetValue.Expanded
            )
        )
    }
}

使用时替换默认的rememberBottomSheetState，传入你需要的固定展开高度即可，示例如下：

val fixedSheetState = rememberFixedHeightBottomSheetState(fixedExpandHeight = 300.dp)
BottomSheetScaffold(
    scaffoldState = rememberBottomSheetScaffoldState(bottomSheetState = fixedSheetState),
    sheetPeekHeight = 56.dp, // 折叠态高度可自定义
    sheetContent = {
        // 根布局高度和展开高度保持一致，内部长列表加滚动即可
        LazyColumn(modifier = Modifier
            .fillMaxWidth()
            .height(300.dp)
        ) {
            items(100) {
                Text(text = "列表项$it", modifier = Modifier.padding(16.dp))
            }
        }
    }
) {
    // 主页面内容
}

方案2：适配Material 3版本 #

Material 3的BottomSheetScaffold原生提供了高度限制参数，无需自定义锚点，直接配置sheetMaxHeight即可：

val sheetState = rememberStandardBottomSheetState(
    initialValue = SheetValue.Expanded,
    skipHiddenState = true
)
BottomSheetScaffold(
    sheetState = sheetState,
    sheetMaxHeight = 300.dp, // 直接设置固定展开高度
    sheetContent = {
        LazyColumn(modifier = Modifier.fillMaxWidth()) {
            items(100) {
                Text(text = "列表项$it", modifier = Modifier.padding(16.dp))
            }
        }
    }
) {
    // 主页面内容
}

注意事项 #

• 固定展开高度建议大于设置的sheetPeekHeight，避免折叠态和展开态出现逻辑冲突
• 若内部内容总高度超过你设置的固定展开高度，务必给内容组件添加滚动属性，避免内容被截断

内容的提问来源于stack exchange，提问作者Cyril