我试图有一种方法来显示来自我应用程序中任何地方的BottomSheet,为此我使用BottomSheetScaffold
和一个LiveData对象,该对象保存当前可组合函数,该函数被观察为状态:
val sheetContent by MusicHub.state.bottomSheet.getContent().observeAsState()
BottomSheetScaffold(
modifier = Modifier
.fillMaxSize(),
scaffoldState = bottomSheetScaffoldState,
sheetPeekHeight = 0.dp,
sheetContent = sheetContent!!
)
我在我的应用程序中使用BottomSheet作为上下文菜单。例如,当我在我的应用程序中点击播放列表时,它会设置BottomSheet的内容并像这样显示:
PlaylistItem(
// ...
onLongClick = {
// Set the LiveData composable
MusicHub.state.bottomSheet.setContent {
PlaylistContextMenuTest(playlist!!, viewModel)
}
// Expand BottomSheet
scope.launch {
MusicHub.state.bottomSheet.expand()
}
}
)
一般来说,这有效,但是第一次扩展BottomSheet时,它会显示一瞬间,然后再次消失在底部。这是一个小的GIF:
我的猜测是,不知何故,底板的大小还没有重新计算,因此,它只在下一次重组工作。来自web dev的我会说这是一个典型的requestAnimationFrame案例,但是我不太知道如何在compose中解决这个问题。
编辑:
播放列表上下文菜单测试代码:
@Composable
fun PlaylistContextMenuTest(playlist: Playlist, viewModel: LibraryViewModel = activityViewModel()){
val scrollState = rememberScrollState()
Column(
modifier = Modifier
.fillMaxWidth()
.navigationBarsPadding()
// TODO: Replace that with a percentage of the screen height
.heightIn(max = 384.dp)
.verticalScroll(scrollState),
content = {
ContextMenu {
repeat(4){
addOption(R.drawable.ic_delete_black_24dp, "Delete"){
Timber.d("Delete Playlist")
viewModel.deletePlaylist(playlist)
}
}
}
}
)
}
完整的ContextMenu源代码:(https://pastebin.com/sg4ed96L)
此问题已通过jetpack compose的新版本解决。我不确定它是beta 8还是beta 9,但现在一切都按预期运行。
你似乎是对的。它似乎第一次重新计算BottomSheet的高度。
由于这在第二次尝试时不会更改,因此将显示。
这个答案对你有帮助吗?
对于BottomSheetScaffold来说,这似乎很好,但对于ModalBottomSheetLayout来说却不是这样(正如你在链接答案的评论中看到的那样,我一直在寻找的东西)。
编辑:伴奏者的导航素材也值得一看。
我使用< code>BottomSheetScaffold来设置一个带有< code>topBar和一些< code>sheetContent的视图。 当底部工作表完全展开时,它将与 (也称为操作栏或应用栏)重叠。有没有办法确保它不会重叠?
我正在尝试使用Compose设计一个布局,其中包括: 顶部应用栏 正文(内容) 底部应用栏 单击时表示菜单的底页(模式底页) -------顶应用栏------- -主要内容- ------底部压条----- ----模型底板--- Compose提供了3个组件: 脚手架 底板脚手架 模态底板布局 脚手架没有底板属性 BottomSheetScaffold没有BottomAppBar属性 Moda
我已经开始学习jetpack compose。我想在单击图标按钮时显示底部工作表。但是我得到了错误@Composable调用只能发生在@Composable函数的上下文中,我如何实现这个逻辑。 这是代码 但是我得到了错误@Composable调用只能发生在@Composable函数的上下文中,我如何实现这个逻辑
在Jetpack compose 1.0.0-beta01中,我这样调用BottomSheetScaffold: ...并获得以下错误: java.lang.IllegalArgumentException:初始值必须具有关联的锚点。 有什么解决办法吗?
This tip is a bit of a hack, but still a neat idea. Use at your own risk. ;-) 这项技巧有点普通,但是仍然是个不错的思想,如果要使用的话,自担风险。;-) Traditionally, programming templates into your applications goes as follows: First,
BottomBar有4个目的地:ScreenA,ScreenB,ScreenC和ScreenD。 在ScreenA上按下按钮(不是底部栏项)时,我想使用参数转到ScreenB。 导航图 底部栏 到目前为止,单击ScreenA上的按钮会将我导航到ScreenB,但参数值始终为0,因为我永远不会传递在lambda中传递的参数。我使用的是compose_version='1.2.0-alpha04'和"