Unable to make the dialog display full screen in Android Compose

Question

I tried to make a full-screen dialog using Jetpack Compose using this code:

@Preview
@Composable
fun test() {

    val showDialog = remember { mutableStateOf(value = false) }

    Box(
        contentAlignment = Alignment.Center,
        modifier = Modifier.fillMaxSize().background(color = Color.White)
    ) {
        Box(
            contentAlignment = Alignment.Center,
            modifier = Modifier
                .size(size = 100.dp)
                .background(color = Color.Red)
                .clickable(
                    onClick = { showDialog.value = true },
                    indication = null,
                    interactionSource = remember { MutableInteractionSource() }
                )
        ) {
            Text(text = "Dialog Button")
        }

    }

    val properties = DialogProperties(
        usePlatformDefaultWidth = false
    )

    if (showDialog.value) {
        Dialog(
            onDismissRequest = { /*TODO*/ },
            properties = properties,
        ) {
            Box(
                modifier = Modifier.fillMaxSize().background(color = Color.Blue)
            )
        }
    }

}

The running result of the above code: Before clicking the "dialog" button: image After clicking the "dialog" button: image. You can see in the images that the blue dialog cannot fill the entire screen, and there are gaps on the left and right sides of the dialog.

I have already set usePlatformDefaultWidth to false, but it didn't work.