Full screen dialog in Android Compose does not take full screen height

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))) {

  }
}

Running this code results in a dialog with fullscreen, but the height does not fully match the screen height.

Is there any way to make the dialog take full width and height of the screen size?

Please find the screenshot below:

Answer 1

If you take a took at how screenHeightDp is defined.

The current height of the available screen space, in dp units, corresponding to screen height resource qualifier.

Apparently, It excludes the area occupied by window insets, such as the status bar, navigation bar, and cutouts.

So here is a solution I managed to solve the problem. It try to get entire screen size from WindowManager. and feed them via Modifier.requiredSize(). Note that it is important to ignore parent constraints by using requiredSize, otherwise it won't work. More info at https://stackoverflow.com/a/65779227/157675 .

    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)
        ) {
           // ...
        }
    }

Answer 2

For making the dialog fill the full screen either use Modifier.fillMaxSize() or use Modifier.fillMaxWidth() along with Modifier.fillMaxHeight().