2

例如,我在应用程序中有带有 Compose LazyColumn 代码的 MyBottomSheetDialogFragment:

class MyBottomSheetDialogFragment : BottomSheetDialogFragment() {
    override fun onCreateView(
        inflater: LayoutInflater,
        container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View {
        return ComposeView(requireContext()).apply {
            setContent {
                Column(horizontalAlignment = Alignment.CenterHorizontally) {
                    Text("Header", color = Color.Black)
                    LazyColumn(
                        Modifier
                            .weight(1f)
                            .fillMaxWidth()) {
                        items(100) {
                            Text("Item $it", Modifier.fillMaxWidth(), Color.Black)
                        }
                    }
                }
            }
        }
    }
}

并使用以下代码显示它:

MyBottomSheetDialogFragment().show(activity.supportFragmentManager, null)

这就是我们所拥有的:

MyBottomSheetDialogFragment 屏幕图像.jpg

现在,如果向下滚动 LazyColumn 列表,则一切正常,但如果向上滚动 LazyColumn 列表,则滚动底部工作表对话框而不是 LazyColumn 列表。

如何在 BottomSheetDialogFragment 中正确实现 LazyColumn?

当我们使用 XML RecyclerView 列表时,要解决此问题,我们必须使用 NestedScrollView 包装 RecyclerView 列表,如此处所述,但是如何使用 Jetpack Compose 修复它?

4

1 回答 1

0

您应该使用 aBottomSheetScaffold并将 the 设置为sheetContent底部工作表内容。不要使用 BottomSheetDialogFragment。

下面是一个 BottomSheetScaffold 的基本结构示例:

    val scaffoldState = rememberBottomSheetScaffoldState(
        bottomSheetState = rememberBottomSheetState(BottomSheetValue.Expanded)
    )

    BottomSheetScaffold(
        modifier = Modifier.navigationBarsPadding(),
        scaffoldState = scaffoldState,
        topBar = {
            // Your topBar
        },
        sheetShape = BottomSheetShape,
        sheetPeekHeight = MaterialTheme.spacing.large,
        sheetContent = {
            // Your sheet content
        }
    ) { innerPadding ->
      // You content
    }

于 2022-02-22T14:59:27.343 回答