shadcn_ui-time-picker

用途

Shadcn UI 时间选择器用于在界面中提供时间选择能力，可通过独立的时间选择组件，或以表单字段的形式嵌入表单，满足用户录入时间、并对时间输入进行校验的需求。

主要能力

• ShadTimePicker：时间选择组件，可选地提供尾随部件（trailing widget），例如在输入框旁放置一个图标。
• ShadTimePickerFormField：表单场景下的时间字段，支持 label（标签）、description（描述文本）、onChanged（变更回调）与 validator（校验函数）。
• 时段选择：通过 ShadTimePickerFormField.period 支持 AM/PM（上午/下午）时段选择。

使用方式

独立组件示例：

const ShadTimePicker(
  trailing: Padding(
    padding: EdgeInsets.only(left: 8, top: 14),
    child: Icon(LucideIcons.clock4),
  ),
)

表单字段示例：

ShadTimePickerFormField(
  label: const Text('Pick a time'),
  onChanged: print,
  description: const Text('The time of the day you want to pick'),
  validator: (v) => v == null ? 'A time is required' : null,
)

带 AM/PM 时段选择的表单字段示例：

ShadTimePickerFormField.period(
  label: const Text('Pick a time'),
  onChanged: print,
  description: const Text('The time of the day you want to pick'),
  validator: (v) => v == null ? 'A time is required' : null,
)

适用场景

• 在表单中添加时间输入项，并配合 label 与 description 提示用户。
• 需要对时间输入做必填或格式/取值校验的场景，通过 validator 实现。
• 需要在时间选择控件旁搭配图标等装饰部件的场景，通过 trailing 实现。
• 需要区分上午/下午（AM/PM）的时间录入场景，使用 period 变体。

限制

资料未提供关于收费、价格、平台支持范围、性能表现或具体使用步骤的更多信息，暂未提供。