Jetpack Compose BottomSheetScaffold：平滑关闭

Question

我将 Jetpack Compose 与 BottomSheetScaffold 结合使用。为了能够在可组合项内部和外部显示和隐藏底部工作表，我使用了一个showBottomSheet: MutableState<Boolean>变量。然后可组合项内的窥视高度确定如下：

val baseBottomSheetPeekHeight by remember { mutableStateOf(60.dp) }
val bottomSheetPeekHeight = if (showBottomSheet.value) baseBottomSheetPeekHeight else 0.dp

后来，在 中BottomSheetScaffold，我使用这样的变量：

BottomSheetScaffold(
  ...
  sheetPeekHeight = bottomSheetPeekHeight,
  ...
)

（完整的重现项目在这里：https://github.com/dbrgn/compose-repro）

这通常按预期工作，我可以设置showBottomSheet.value为false隐藏底部工作表。然而，隐藏看起来很糟糕，因为并非所有子可组合项都同时隐藏。

由于 GIF 转换，在上面的动画中有点难以看到，但是当关闭底部工作表查看窗格时，在底部工作表消失之前，其他内容（位于其下方）会短暂可见。

有没有办法避免这种笨拙的隐藏行为？或者更好的是，有没有一种方法可以平滑地设置窗格隐藏的动画？

Answer 1

在我的平滑关闭 BottomSheetScaffold 的例子中，我曾经：scaffoldState.bottomSheetState.animateTo(Collapsed, tween(duration)) --（什么时候duration是你想要的任何 Int）。扩展也是如此： scaffoldState.bottomSheetState.animateTo(Expanded, tween(duration))

如果你查看collapse()或expand()函数的源代码，你会发现那里只调用了animateTo(Expanded)和animateTo(Collapsed)。您可以根据需要自定义 animateTo()。

请参阅animateTo()文档。