可以在 ModalBottomSheetLayout 中添加一个 Modifier 并使用 saveableStateHolder 保存当前内容的高度。然后,在内容大小更改时,使用动画平滑地传递新的高度值。例如:
@Composable fun ModalBottomSheetLayoutWithStableHeight( sheetContent: @Composable () -> Unit, sheetState: ModalBottomSheetState, content: @Composable () -> Unit ) { // 用于保存内容高度的状态 val saveableStateHolder = rememberSaveable(sheetState) { SaveableStateHolder { mutableStateOf(getContentHeight()) } }
// 将内容高度与 saveableStateHolder 关联
val contentHeight = with(saveableStateHolder) {
derivedStateOf { getValue().value }
}
ModalBottomSheetLayout(
sheetState = sheetState,
sheetContent = {
sheetContent()
// 在 sheetContent 后面添加一个空的 Spacer,以便在 sheetContent 更改时实现平滑的过渡
// 同时记录内容的当前高度
Spacer(
Modifier
.fillMaxWidth()
.height(contentHeight.value.dp)
.onGloballyPositioned {
// 记录 PanelContent 的高度
val contentHeightPx = it.size.height.toDp().value
saveableStateHolder.getValue().value = contentHeightPx
}
)
},
content = content
)
}
// 获取内容高度的工具方法 @Composable fun getContentHeight(): Float { var contentHeight = 0f Column(Modifier.width(IntrinsicSize.Max)) { CompositionLocalProvider(LocalLayoutDirection provides LayoutDirection.Ltr) { Box( Modifier .onGloballyPositioned { contentHeight = it.size.height.toFloat() } ) { // 这里可以放置正式的内容 } } } return contentHeight } 使用 saveableStateHolder 可以确保将内容大小更改时保持平滑。