Accessibility dialog - Jetpack Compose

In Jetpack Compose, you can create dialogs usingĀ AlertDialog. You should always add a close button by specifying the dismissButton property. The focus of assistive technologies is automatically trapped inside the dialog while it's visible.

var showDialog by remember { mutableStateOf(false) }  
Box {  
    Button(onClick = { showDialog = true }) {  
        Text("Show Appt Dialog")  
    }  
  
    if (showDialog) {  
        AlertDialog(  
            onDismissRequest = { showDialog = false },  
            confirmButton = {  
                TextButton(onClick = { showDialog = false }) {  
                    Text("Proceed")  
                }  
            },  
            dismissButton = {  // Do not forget to add dismissButton
                TextButton(onClick = { showDialog = false }) {  
                    Text("Cancel")  
                }  
            },  
            title = {  
                Text(text = "Confirm Appt membership?")  
            },  
        )  
    }  
}