AI生成，调试出来学习，这些小组件会用了，就可以组合一个大点的程序了。
package com.example.mydatetime
import android.app.AlertDialog
import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.enableEdgeToEdge
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.clickable
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.Alignment
import androidx.compose.ui.unit.dp
import java.time.LocalDateTime
import java.time.format.DateTimeFormatter
import java.util.*
import androidx.compose.foundation.ExperimentalFoundationApi
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.window.Dialog
import com.example.mydatetime.ui.theme.MyDateTimeTheme
import java.time.Instant
import java.time.LocalDate
import java.time.LocalTime
import java.time.ZoneId
class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
enableEdgeToEdge()
setContent {
MyDateTimeTheme {
DateAndTimePickerApp()
}
}
}
}
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun DatePickerDialog(
onDismissRequest: () -> Unit,
onDateSelected: (LocalDate) -> Unit
) {
// 获取当前日期
val currentDate = LocalDate.now()
// 创建DatePicker状态，并初始化为当前日期
val datePickerState = rememberDatePickerState(initialSelectedDateMillis = currentDate.atStartOfDay(ZoneId.systemDefault()).toInstant().toEpochMilli())
// 创建对话框
Dialog(
onDismissRequest = onDismissRequest,
) {
// 使用Column布局来组织对话框内容
Column(
modifier = Modifier
.fillMaxWidth()
.padding(16.dp)
) {
// 显示标题
Text(
text = "Select Date",
style = MaterialTheme.typography.headlineSmall,
modifier = Modifier.padding(bottom = 16.dp)
)
// 显示日期选择器
DatePicker(state = datePickerState)
// 使用Row布局来组织按钮
Row(
modifier = Modifier
.fillMaxWidth()
.padding(top = 16.dp),
horizontalArrangement = Arrangement.End
) {
// 取消按钮
Button(
onClick = onDismissRequest,
modifier = Modifier.padding(end = 8.dp)
) {
Text("Cancel")
}
// 确定按钮
Button(onClick = {
// 获取选中的日期
val selectedDate = LocalDate.ofInstant(
Instant.ofEpochMilli(datePickerState.selectedDateMillis ?: currentDate.atStartOfDay(ZoneId.systemDefault()).toInstant().toEpochMilli()),
ZoneId.systemDefault()
)
// 调用回调函数，传递选中的日期
onDateSelected(selectedDate)
}) {
Text("OK")
}
}
}
}
}
@OptIn(ExperimentalMaterial3Api::class) // 使用实验性API的注解
@Composable // 标记为可组合函数
fun TimePickerDialog(
onDismissRequest: () -> Unit, // 对话框关闭时的回调函数
onTimeSelected: (LocalTime) -> Unit // 时间选择后的回调函数
) {
val currentTime = LocalTime.now(ZoneId.systemDefault()) // 获取当前时间
val timePickerState = rememberTimePickerState(initialHour = currentTime.hour, initialMinute = currentTime.minute) // 创建时间选择器的状态，并初始化为当前时间
Dialog(
onDismissRequest = onDismissRequest, // 设置对话框关闭的回调函数
) {
Column(
modifier = Modifier
.fillMaxWidth() // 填充父布局的宽度
.padding(16.dp) // 设置内边距
) {
Text(
text = "Select Time", // 显示文本
style = MaterialTheme.typography.headlineSmall, // 使用主题中的小标题样式
modifier = Modifier.padding(bottom = 16.dp) // 设置底部内边距
)
TimePicker(state = timePickerState) // 显示时间选择器
Row(
modifier = Modifier
.fillMaxWidth() // 填充父布局的宽度
.padding(top = 16.dp), // 设置顶部内边距
horizontalArrangement = Arrangement.End // 水平排列方式为靠右
) {
Button(
onClick = onDismissRequest, // 点击按钮时调用关闭回调函数
modifier = Modifier.padding(end = 8.dp) // 设置右边距
) {
Text("Cancel") // 显示取消文本
}
Button(onClick = {
val selectedTime = LocalTime.of(timePickerState.hour, timePickerState.minute) // 获取选中的时间
onTimeSelected(selectedTime) // 调用时间选择后的回调函数
}) {
Text("OK") // 显示确定文本
}
}
}
}
}
@Composable
fun DateAndTimePickerApp() {
// 记住是否显示日期选择器的状态
var showDatePicker by remember { mutableStateOf(false) }
// 记住是否显示时间选择器的状态
var showTimePicker by remember { mutableStateOf(false) }
// 记住当前选中的日期和时间
var selectedDateTime by remember { mutableStateOf(LocalDateTime.now()) }
// 日期格式化器
val dateFormatter = DateTimeFormatter.ofPattern("yyyy-MM-dd", Locale.getDefault())
// 时间格式化器
val timeFormatter = DateTimeFormatter.ofPattern("HH:mm", Locale.getDefault())
// 使用Column布局，垂直居中，水平居中
Column(
modifier = Modifier
.fillMaxSize()
.padding(16.dp),
verticalArrangement = Arrangement.Center,
horizontalAlignment = Alignment.CenterHorizontally
) {
// 显示当前日期
Text(
text = "Date: ${selectedDateTime.format(dateFormatter)}",
style = MaterialTheme.typography.bodyLarge,
modifier = Modifier
.clickable { showDatePicker = true } // 点击时显示日期选择器
.padding(8.dp)
)
Spacer(modifier = Modifier.height(16.dp)) // 添加间距
// 显示当前时间
Text(
text = "Time: ${selectedDateTime.format(timeFormatter)}",
style = MaterialTheme.typography.bodyLarge,
modifier = Modifier
.clickable { showTimePicker = true } // 点击时显示时间选择器
.padding(8.dp)
)
// 日期选择器
if (showDatePicker) {
DatePickerDialog(
onDismissRequest = { showDatePicker = false }, // 点击外部时关闭日期选择器
onDateSelected = { date ->
// 更新选中的日期
selectedDateTime = selectedDateTime.withYear(date.year).withMonth(date.monthValue).withDayOfMonth(date.dayOfMonth)
showDatePicker = false // 关闭日期选择器
}
)
}
// 时间选择器
if (showTimePicker) {
TimePickerDialog(
onDismissRequest = { showTimePicker = false }, // 点击外部时关闭时间选择器
onTimeSelected = { time ->
// 更新选中的时间
selectedDateTime = selectedDateTime.withHour(time.hour).withMinute(time.minute)
showTimePicker = false // 关闭时间选择器
}
)
}
}
}
