当对话框中显示时，如何防止 jetpack compose 脚手架占据屏幕的整个高度

Question

我有一个 Android 活动，它Base.Theme.AppCompat.Light.Dialog在平板电脑上作为主题，因此显示在对话框中。

当我使用 XML 布局时，我可以设置布局的最小高度和换行内容，这样它就会

• 当没有内容或内容很少时，至少为 x dp 高。
• 当内容高于最小高度时内容就高
• 当内容不适合屏幕高度时，与屏幕一样高，在这种情况下我可以滚动

使用 Jetpack Compose 的脚手架，我正在努力重现这种行为。即使没有内容，对话框的高度也始终与屏幕允许的一样高。

我尝试了以下修饰符作为脚手架的参数：

• Modifier.wrapContentHeight()- 对话框仍然与屏幕一样高
• Modifier.defaultMinSize(minHeight = 250.dp)- 对话框仍然与屏幕一样高
• Modifier.height(height = 250.dp)- 现在它变小了，但它固定为该大小，当内容更多时不会增长
• Modifier.requiredHeightIn(min = 250.dp, max = getMyScreenHeightinDp())- 对话框仍然与屏幕一样高

由于您可以使用修改器降低脚手架的高度，.height(...)我认为也应该可以重新创建包装内容行为。但如何呢？

Answer 1

使用requiredHeightIn确实有效，如下面的代码所示。在此列表中，高度从 150.dp 到 400.dp 不等。如果您只提供 10 件商品，则为 150.dp。当您添加更多项目时，它的高度会增加，但最多只能达到 400.dp。

然而，有一个问题。导航抽屉从屏幕左侧滑出，而不是从对话框左侧滑出。有办法解决这个问题。您可以用自己的自定义抽屉替换导航抽屉。我这样做过一次并且可以做到。

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        startActivity(intent)

        setContent {

            Dialog(
                onDismissRequest = {  },
                properties = DialogProperties(dismissOnClickOutside = false)
            ) {
                val scaffoldState = rememberScaffoldState()
                val scope = rememberCoroutineScope()
                Scaffold(
                    modifier = Modifier.requiredHeightIn(min = 150.dp, max = 400.dp),
                    scaffoldState = scaffoldState,
                    drawerContent = { Text("Drawer content") },
                    topBar = {
                        TopAppBar(
                            title = { Text("Simple Scaffold Screen") },
                            navigationIcon = {
                                IconButton(
                                    onClick = {
                                        scope.launch { scaffoldState.drawerState.open() }
                                    }
                                ) {
                                    Icon(Icons.Filled.Menu, contentDescription = "Localized description")
                                }
                            }
                        )
                    },
                    floatingActionButtonPosition = FabPosition.End,
                    floatingActionButton = {
                        ExtendedFloatingActionButton(
                            text = { Text("Inc") },
                            onClick = { /* fab click handler */ }
                        )
                    },
                    content = { innerPadding ->
                        LazyColumn(contentPadding = innerPadding) {
                            items(count = 100) {
                                Text(it.toString())

                            }
                        }
                    }
                )
            }
        }
    }
}