RichTimePickerDialog is a dialog container for a time picker.
@OptIn(ExperimentalMaterial3Api::class)
@Composable
@Preview
fun RichTimeInputSample() {
var showTimePicker by remember { mutableStateOf(false) }
val state = rememberTimePickerState()
val formatter = remember { SimpleDateFormat("hh:mm a", Locale.getDefault()) }
val snackState = remember { SnackbarHostState() }
val snackScope = rememberCoroutineScope()
Box(propagateMinConstraints = false) {
Button(modifier = Modifier.align(Alignment.Center), onClick = { showTimePicker = true }) {
Text("Set Input")
}
SnackbarHost(hostState = snackState)
}
if (showTimePicker) {
RichTimePickerDialog(
onDismissRequest = { showTimePicker = false },
confirmButton = {
TextButton(
enabled = state.isInputValid,
onClick = {
val cal = Calendar.getInstance()
cal.set(Calendar.HOUR_OF_DAY, state.hour)
cal.set(Calendar.MINUTE, state.minute)
cal.isLenient = false
snackScope.launch {
snackState.showSnackbar("Entered time: ${formatter.format(cal.time)}")
}
showTimePicker = false
},
) {
Text("OK")
}
},
dismissButton = { TextButton(onClick = { showTimePicker = false }) { Text("Cancel") } },
) {
TimeInput(state = state, shapes = TimePickerDefaults.shapes())
}
}
}
RichTimePickerSample
@OptIn(ExperimentalMaterial3Api::class)
@Composable
@Preview
fun RichTimePickerSample() {
var showTimePicker by remember { mutableStateOf(false) }
val state = rememberTimePickerState()
val formatter = remember { SimpleDateFormat("hh:mm a", Locale.getDefault()) }
val snackState = remember { SnackbarHostState() }
val snackScope = rememberCoroutineScope()
Box(propagateMinConstraints = false) {
Button(modifier = Modifier.align(Alignment.Center), onClick = { showTimePicker = true }) {
Text("Set Time")
}
SnackbarHost(hostState = snackState)
}
if (showTimePicker) {
RichTimePickerDialog(
onDismissRequest = { showTimePicker = false },
confirmButton = {
TextButton(
enabled = state.isInputValid,
onClick = {
val cal = Calendar.getInstance()
cal.set(Calendar.HOUR_OF_DAY, state.hour)
cal.set(Calendar.MINUTE, state.minute)
cal.isLenient = false
snackScope.launch {
snackState.showSnackbar("Entered time: ${formatter.format(cal.time)}")
}
showTimePicker = false
},
) {
Text("OK")
}
},
dismissButton = { TextButton(onClick = { showTimePicker = false }) { Text("Cancel") } },
) {
TimePicker(state = state, shapes = TimePickerDefaults.shapes())
}
}
}
@OptIn(ExperimentalMaterial3Api::class)
@Composable
@Preview
fun RichTimePickerScrollSample() {
var showTimePicker by remember { mutableStateOf(false) }
val state = rememberTimePickerState()
val formatter = remember { SimpleDateFormat("hh:mm a", Locale.getDefault()) }
val snackState = remember { SnackbarHostState() }
var displayMode by remember { mutableStateOf(TimePickerDisplayMode.Scroll) }
val snackScope = rememberCoroutineScope()
Box(propagateMinConstraints = false) {
Button(modifier = Modifier.align(Alignment.Center), onClick = { showTimePicker = true }) {
Text("Set Time (Switchable, Scroll)")
}
SnackbarHost(hostState = snackState)
}
if (showTimePicker) {
RichTimePickerDialog(
onDismissRequest = { showTimePicker = false },
confirmButton = {
TextButton(
enabled = state.isInputValid,
onClick = {
val cal = Calendar.getInstance()
cal.set(Calendar.HOUR_OF_DAY, state.hour)
cal.set(Calendar.MINUTE, state.minute)
cal.isLenient = false
snackScope.launch {
snackState.showSnackbar("Entered time: ${formatter.format(cal.time)}")
}
showTimePicker = false
},
) {
Text("OK")
}
},
dismissButton = { TextButton(onClick = { showTimePicker = false }) { Text("Cancel") } },
modeToggleButton = {
TimePickerDialogDefaults.ScrollDisplayModeToggle(
onDisplayModeChange = {
displayMode =
if (displayMode == TimePickerDisplayMode.Scroll) {
TimePickerDisplayMode.Input
} else {
TimePickerDisplayMode.Scroll
}
},
displayMode = displayMode,
)
},
) {
if (displayMode == TimePickerDisplayMode.Input) {
TimeInput(state = state, shapes = TimePickerDefaults.shapes())
} else {
TimeScroll(state = state, shapes = TimePickerDefaults.shapes())
}
}
}
}
RichTimePickerSwitchableSample
@OptIn(ExperimentalMaterial3Api::class)
@Composable
@Preview
fun RichTimePickerSwitchableSample() {
var showTimePicker by remember { mutableStateOf(false) }
val state = rememberTimePickerState()
val formatter = remember { SimpleDateFormat("hh:mm a", Locale.getDefault()) }
val snackState = remember { SnackbarHostState() }
var displayMode by remember { mutableStateOf(TimePickerDisplayMode.Picker) }
val snackScope = rememberCoroutineScope()
val configuration = LocalConfiguration.current
Box(propagateMinConstraints = false) {
Button(modifier = Modifier.align(Alignment.Center), onClick = { showTimePicker = true }) {
Text("Set Time (Switchable)")
}
SnackbarHost(hostState = snackState)
}
if (showTimePicker) {
RichTimePickerDialog(
onDismissRequest = { showTimePicker = false },
confirmButton = {
TextButton(
enabled = state.isInputValid,
onClick = {
val cal = Calendar.getInstance()
cal.set(Calendar.HOUR_OF_DAY, state.hour)
cal.set(Calendar.MINUTE, state.minute)
cal.isLenient = false
snackScope.launch {
snackState.showSnackbar("Entered time: ${formatter.format(cal.time)}")
}
showTimePicker = false
},
) {
Text("OK")
}
},
dismissButton = { TextButton(onClick = { showTimePicker = false }) { Text("Cancel") } },
modeToggleButton = {
if (configuration.screenHeightDp.dp > MinHeightForTimePicker) {
TimePickerDialogDefaults.DisplayModeToggle(
onDisplayModeChange = {
displayMode =
if (displayMode == TimePickerDisplayMode.Picker) {
TimePickerDisplayMode.Input
} else {
TimePickerDisplayMode.Picker
}
},
displayMode = displayMode,
)
}
},
) {
if (
displayMode == TimePickerDisplayMode.Picker &&
configuration.screenHeightDp.dp > MinHeightForTimePicker
) {
TimePicker(state = state, shapes = TimePickerDefaults.shapes())
} else {
TimeInput(state = state, shapes = TimePickerDefaults.shapes())
}
}
}
}