Android Compose中的全屏对话框没有占满整个屏幕高度

Question

Dialog(
  properties = DialogProperties(usePlatformDefaultWidth = false),
  onDismissRequest = {viewModel.showDialog.value = false}
){
  Column(modifier = Modifier.width(LocalConfiguration.current.screenWidthDp.dp)
    .height(LocalConfiguration.current.screenHeightDp.dp).background(color = Color.Black.copy(alpha = 1f))) {

  }
}

运行此代码会导致全屏对话框，但高度不完全匹配屏幕高度。

有没有办法使对话框占据整个屏幕尺寸的宽度和高度？

请查看下面的截图：

- Ali_Waris

---

你是如何在模态框弹出时移除系统导航按钮的？我遇到了这个问题：https://dev59.com/fMz6oIgBc1ULPQZFz1oM?noredirect=1#comment131465024_74465492 - HaMiD Sani

Answer 1

如果你看一下screenHeightDp的定义。

当前屏幕可用空间的高度，以dp为单位，对应于屏幕高度资源限定符。

显然，它不包括窗口插图占据的区域，例如状态栏、导航栏和切口。

因此，这里有一个解决问题的方法。它尝试从WindowManager获取整个屏幕大小，并通过Modifier.requiredSize()提供它们。请注意，使用requiredSize忽略父级约束很重要，否则它将无法工作。更多信息请参见https://dev59.com/4VEG5IYBdhLWcg3wdOFK#65779227。

    Dialog(
        properties = DialogProperties(usePlatformDefaultWidth = false),
        onDismissRequest = onDismiss
    ) {
        val context = LocalContext.current
        val windowManager =
            remember { context.getSystemService(Context.WINDOW_SERVICE) as WindowManager }

        val metrics = DisplayMetrics().apply {
            windowManager.defaultDisplay.getRealMetrics(this)
        }
        val (width, height) = with(LocalDensity.current) {
            Pair(metrics.widthPixels.toDp(), metrics.heightPixels.toDp())
        }
        Column(
            modifier = Modifier
                .requiredSize(width, height)
                .background(color = Color.Green)
        ) {
           // ...
        }
    }

- Gasol

---

这个方法对于高度来说是有效的，但是对于宽度来说并不完全充满。 - mrzbn

@mrzbn 为了实现这一点，您需要将 https://developer.android.com/reference/kotlin/androidx/compose/ui/window/DialogProperties#usePlatformDefaultWidth() 设置为 false。 - undefined

Answer 2

如果想让对话框填满整个屏幕，可以使用 Modifier.fillMaxSize() 或者同时使用 Modifier.fillMaxWidth() 和 Modifier.fillMaxHeight()。

- Chandresh Parmar

---

尝试过了，没有帮助 :( - Ali_Waris

Answer 3

在 androidx.navigation:navigation-compose:2.5.3 中，DialogProperties 的属性 decorFitsSystemWindows 被添加，并且默认值为 true。结合使用 usePlatformDefaultWidth = false 和 Modifier.fillMaxSize()，应该可以解决你的问题。

以下是一个示例：

dialog(
    "your route",
    dialogProperties: DialogProperties = DialogProperties(
       usePlatformDefaultWidth = false,
       decorFitsSystemWindows = true // passing this as parameter isn't mandatory but I added is for clarification purposes
    )
) {
   Column(Modifier.fillMaxSize() {
      // your screen here       
   }
}

- Macksly