Time picker 时间选择器
/TYME PIK-er/ · noun · 输入类模式 · #137
不用打字就能设定几点几分的控件：Android 上是拖动指针的表盘，iPhone 上是滚动的小时和分钟滚轮，网页表单里是小时、分钟两格输入框。它按用户所在地区显示 12 小时制（分上午、下午）或 24 小时制；要同时选日期和时间时（比如预约、提醒），常和日期选择器搭配使用。
别名：日期时间选择器、时间滚轮。
你可能会这样叫它
- “选时间的表盘”
- “iPhone 上的时间滚轮”
- “选小时和分钟的控件”
- “表单里选时间的下拉框”
……它的名字是 时间选择器（Time picker）。
常见问题
时间选择器是什么意思？
时间选择器（time picker）是不用打字就能选定几点几分的控件：Android 上是拖动指针的表盘，先选小时再选分钟；iPhone 上常见的是上下滚动的小时、分钟滚轮；网页表单里是 <input type="time"> 的小时、分钟两格。它按地区显示 12 小时制或 24 小时制，好的时间选择器也允许直接输入。
选择时间的控件叫什么？
叫时间选择器（time picker）。只选日期的叫日期选择器（date picker），日期和时间一起选的叫日期时间选择器（date time picker）。在代码里，SwiftUI 用 DatePicker 加 .hourAndMinute，Jetpack Compose 用 TimePicker，Flutter 用 showTimePicker()，网页用 <input type="time">。
代码里叫什么
| SwiftUI | DatePicker displayedComponents: .hourAndMinute |
|---|---|
| UIKit | UIDatePicker datePickerMode = .time |
| Jetpack Compose | TimePicker TimeInput rememberTimePickerState() |
| Android (Views) | MaterialTimePicker TimePickerDialog |
| Flutter | showTimePicker() TimeOfDay CupertinoDatePicker |
| Web (HTML) | <input type="time"> <input type="datetime-local"> 选择器由浏览器绘制；显示 12 小时制还是 24 小时制取决于用户的地区设置，代码里改不了 |
| React (MUI X) | TimePicker DateTimePicker |
复制给 AI 编程工具
给这个字段加一个时间选择器：点击后选择小时和分钟（表盘或滚动列都可以），预先填好一个合理的默认时间；分钟不需要精确时按 5 或 15 分钟一档；按用户习惯显示 12 小时制或 24 小时制，上午、下午的切换要清楚。也必须能直接输入时间，允许范围之外的时间要禁用，能完全用键盘和读屏软件操作（网页上用 <input type="time"> 也可以）。