日期与时间 (Pickers)

源：Compose 日期选择器

M3 提供了原生的 DatePicker 和 TimePicker 组件。

1. 日期选择器 (DatePicker)

通常放在 DatePickerDialog 中使用。

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun DatePickerSample() {
    var openDialog by remember { mutableStateOf(false) }
    
    // 状态容器，默认选中当前日期
    val datePickerState = rememberDatePickerState()

    if (openDialog) {
        DatePickerDialog(
            onDismissRequest = { openDialog = false },
            confirmButton = {
                TextButton(
                    onClick = {
                        openDialog = false
                        // 获取选中的时间戳 (Long?)
                        Log.d("Date", "Selected: ${datePickerState.selectedDateMillis}")
                    }
                ) {
                    Text("确定")
                }
            },
            dismissButton = {
                TextButton(onClick = { openDialog = false }) { Text("取消") }
            }
        ) {
            DatePicker(state = datePickerState)
        }
    }
}

范围选择

如果需要选择一段时间（开始-结束），请使用 DateRangePicker 和 rememberDateRangePickerState。

2. 时间选择器 (TimePicker)

支持表盘模式 (Dial) 和数字输入模式 (Input)。

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun TimePickerSample() {
    var showTimePicker by remember { mutableStateOf(false) }
    
    // 默认当前时间
    val timePickerState = rememberTimePickerState(
        initialHour = 12,
        initialMinute = 30,
        is24Hour = true
    )

    if (showTimePicker) {
        // 自定义 Dialog 容器
        AlertDialog(
            onDismissRequest = { showTimePicker = false },
            confirmButton = {
                TextButton(onClick = {
                    showTimePicker = false
                    Log.d("Time", "${timePickerState.hour}:${timePickerState.minute}")
                }) { Text("OK") }
            },
            text = {
                TimePicker(state = timePickerState)
            }
        )
    }
}