android compose TimePickerDialog 时间选择对话框 使用

发布时间:2026/6/29 16:46:29
android compose TimePickerDialog 时间选择对话框 使用 android compose TimePickerDialog 时间选择对话框 使用请注意此代码段中的要点DialWithDialogExample可组合项将 TimePicker 封装在对话框中。TimePickerDialog是一个自定义的可组合函数用于创建具有以下参数的AlertDialogonDismiss当用户关闭对话框通过关闭按钮或返回导航时调用的函数。onConfirm用户点击“确定”按钮时调用的函数。content在对话框中显示时间选择器的可组合项。AlertDialog包含一个标有“关闭”的关闭按钮。一个标有“确定”的确认按钮。作为text参数传递的时间选择器内容。DialWithDialogExample使用当前时间初始化TimePickerState并将其传递给TimePicker和onConfirm函数。package com.wn.androidcomposedemo1.basegoogle import android.app.TimePickerDialog import android.os.Bundle import android.util.Log import androidx.activity.ComponentActivity import androidx.activity.compose.setContent import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.material3.AlertDialog import androidx.compose.material3.Button import androidx.compose.material3.ExperimentalMaterial3Api import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Surface import androidx.compose.material3.Text import androidx.compose.material3.TextButton import androidx.compose.material3.TimePicker import androidx.compose.material3.TimePickerState import androidx.compose.material3.rememberTimePickerState import androidx.compose.runtime.Composable import androidx.compose.runtime.getValue import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.remember import androidx.compose.runtime.setValue import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import com.wn.androidcomposedemo1.ui.theme.AndroidComposeDemo1Theme import java.util.Calendar /** * Author : wn * Email : maoning20080808163.com * Date : 2026/6/28 21:28 * Description : 时间选择框 */ class TimeDialogActivity : ComponentActivity(){ override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContent { AndroidComposeDemo1Theme() { Surface( modifier Modifier.fillMaxSize(), color MaterialTheme.colorScheme.background ) { TimeDialogDemo() } } } } OptIn(ExperimentalMaterial3Api::class) Composable fun TimeDialogDemo(){ var showDialog by remember { mutableStateOf(false) } Column( modifier Modifier.fillMaxSize(), horizontalAlignment Alignment.CenterHorizontally, verticalArrangement Arrangement.Center ) { Button(onClick { showDialog true }) { Text(选择时间) } } if(showDialog){ DialWithDialogExample( onConfirm { timePickerState - val hour timePickerState.hour val minute timePickerState.minute Log.d(AAA , 点击确定 选择时间 , hour ${hour}, minute : ${minute}) showDialog false }, onDismiss { Log.d(AAA , 点击取消) showDialog false } ) } } ExperimentalMaterial3Api Composable fun DialWithDialogExample( onConfirm : (TimePickerState) - Unit, onDismiss : () - Unit ){ val currentTime Calendar.getInstance() val timePickerState rememberTimePickerState( initialHour currentTime.get(Calendar.HOUR_OF_DAY), initialMinute currentTime.get(Calendar.MINUTE), is24Hour true ) TimePickerDialog2( onDismiss { onDismiss() }, onConfirm { onConfirm(timePickerState) } ) { TimePicker( state timePickerState ) } } ExperimentalMaterial3Api Composable fun TimePickerDialog2( onDismiss: () - Unit, onConfirm: () - Unit, content : Composable () - Unit ){ AlertDialog( onDismissRequest onDismiss, dismissButton { TextButton( onClick { onDismiss() } ) { Text(取消) } }, confirmButton { TextButton(onClick { onConfirm() }) { Text(确定) } }, text { content() } ) } }