Jetpack Compose 并没有直接提供 DatePicker 组件。然而，你可以通过使用 Material Compose 组件创建一个自定义的 DatePicker 对话框。

下面是一个如何创建 DatePicker 对话框的简单示例：

首先，我们创建一个 DatePickerDialog Composable 函数。这个函数接收三个参数：一个布尔值表示对话框是否可见，一个关闭对话框的函数，以及一个日期选择后的回调函数。对话框本身是一个 Dialog 组件，我们在其中放置了一个 Surface 来提供阴影效果，并在 Surface 中放置了一个 Column 来容纳日期选择器和操作按钮。

1.导入依赖：

implementation 'com.jakewharton.threetenabp:threetenabp:1.3.1'复制

 2.小项目

@Preview
@RequiresApi(Build.VERSION_CODES.O)
@Composable
fun MyScreen1(){
    var isDatePickerDialogVisible by remember{ mutableStateOf(false) }
    var seledate by remember { mutableStateOf("Show Date Picker Dialog") }
    Column {
        Button(onClick =  {isDatePickerDialogVisible =true}) {
            Text(text = seledate)
        }
        if(isDatePickerDialogVisible){
            DatePickerDialog(visible = isDatePickerDialogVisible, onClose = { isDatePickerDialogVisible=false }, onDateSelected ={
                date ->
                println("selected date:$date")
                isDatePickerDialogVisible=false
                seledate="$date"
            } )
        }
    }
}

@RequiresApi(Build.VERSION_CODES.O)
@Composable
fun DatePickerDialog(visible:Boolean,onClose:() ->Unit,onDateSelected:(LocalDate)->Unit){
    if(visible){
        Dialog(onDismissRequest = onClose){
            //DatePicker 包装在Surface中以提供阴影效果
            Surface(
                shape = RoundedCornerShape(8.dp),
                color = MaterialTheme.colors.surface
            ){
                Column {
                    val currentDate=remember{ mutableStateOf(LocalDate.now())}
                    val year =currentDate.value.year
                    val month=currentDate.value.monthValue
                    val day = currentDate.value.dayOfMonth

                    DateSelector(year,month,day){selectedDate ->
                        currentDate.value= selectedDate
                    }
                    Row(modifier = Modifier
                        .fillMaxWidth()
                        .padding(horizontal = 8.dp, vertical = 16.dp), horizontalArrangement = Arrangement.End){
                        Button(onClick =  onClose ) {
                            Text(text = "取消")
                        }
                        Spacer(modifier = Modifier.width(8.dp))
                        Button(onClick = {
                            onDateSelected(currentDate.value)
                            onClose()
                        }) {
                            Text(text = "确定")
                        }
                    }
                }

            }
        }
    }
}

@RequiresApi(Build.VERSION_CODES.O)
@Composable
fun DateSelector(year: Int, month: Int, day: Int, onDateSelected: (LocalDate) -> Unit) {
    var selectedYear by remember { mutableStateOf(year.toFloat()) }
    var selectedMonth by remember{ mutableStateOf(month.toFloat()) }
    var selectedDay by remember { mutableStateOf(day.toFloat()) }
    Column {
        Text(text = "Year")
        Slider(value=selectedYear, onValueChange = {selectedYear= it}, valueRange = 1900f..2099f, steps = 200)
        Text(text = "Month")
        Slider(value=selectedMonth, onValueChange = {selectedMonth=it}, valueRange = 1f..12f, steps = 11)
        Text(text = "Day")
        Slider(value = selectedDay, onValueChange = {selectedDay =it}, valueRange = 1f..31f, steps = 30)
        Button(onClick = {
            onDateSelected(LocalDate.of(selectedYear.toInt(),selectedMonth.toInt(),selectedDay.toInt()))
        }){
            Text(text = "selelct Date")
        }
    }
}
复制

LocalDate.of() 是 Java 8 新引入的时间 API 中的方法，用于创建一个新的日期实例。它接收三个参数：年、月、日，都是整型值。

例如，LocalDate.of(2023, 7, 10) 将会创建一个表示 2023 年 7 月 10 日的 LocalDate 实例。

在你的代码中，你正在尝试使用选定的年份、月份和日期来创建一个 LocalDate 实例。如果你使用的是 ThreeTenABP 库，你应该使用 org.threeten.bp.LocalDate 而非 java.time.LocalDate，

例如：

val date = org.threeten.bp.LocalDate.of(selectedYear.toInt(), selectedMonth.toInt(), selectedDay.toInt())
 

 这将根据 selectedYear、selectedMonth 和 selectedDay 的值创建一个 LocalDate 实例。

推荐内容