In Jetpack Compose Dialog, what is the process for drawing behind the system status bar?

edit

To draw behind the system status bar in Jetpack Compose Dialog, you can use the SystemUiController API.

Here is the process:

1. In the onCreate method of your activity, create an instance of SystemUiController.

val systemUiController = rememberSystemUiController()

1. Call the setStatusBarColor method of SystemUiController and pass it a transparent color.

systemUiController.setStatusBarColor(Color.Transparent, darkIcons = true)

1. In your dialog code, use the Modifier.statusBarsPadding() modifier to add padding to your content to avoid overlapping with the system status bar.

AlertDialog(
    onDismissRequest = dismiss,
    title = { Text(text = "Title") },
    text = { Text(text = "Content") },
    confirmButton = {
        Button(
            onClick = { /* Handle confirm button click */ },
            modifier = Modifier.statusBarsPadding()
        ) {
            Text("Confirm")
        }
    },
    dismissButton = {
        Button(
            onClick = dismiss,
            modifier = Modifier.statusBarsPadding()
        ) {
            Text("Cancel")
        }
    },
)

By using Modifier.statusBarsPadding(), Jetpack Compose automatically adds padding to your dialog content, ensuring that it is not obscured by the system status bar.