BottomSheet and Dialog Guide for Compose - ModalBottomSheet (2026)

Dialogs and bottom sheets are essential UI patterns. Master ModalBottomSheet, AlertDialog, and DatePicker for flexible modal interactions in Compose. Building ModalBottomSheet Create dismissible bottom sheets with content: var showBottomSheet by remember { mutableStateOf ( false ) } if ( showBottomSheet ) { ModalBottomSheet ( onDismissRequest = { showBottomSheet = false }, modifier = Modifier . fillMaxHeight ( 0.8f ) ) { Column ( modifier = Modifier . padding ( 16 . dp )) { Text ( "Select an option" , style = MaterialTheme . typography . headlineSmall ) Spacer ( modifier = Modifier . height ( 16 . dp )) listOf ( "Option 1" , "Option 2" , "Option 3" ). forEach { option -> TextButton ( onClick = { onOptionSelected ( option ) showBottomSheet = false }, modifier = Modifier . fillMaxWidth () ) { Text ( option ) } } } } } Button ( onClick = { showBottomSheet = true }) { Text ( "Open Sheet" ) } AlertDialog Implementation For simple confirmations, use AlertDialog: var showDialog by remember {