首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何在TextFormField中显示输入时间?

在TextFormField中显示输入时间可以通过以下步骤实现:

  1. 首先,确保你已经在项目中引入了所需的依赖。在Flutter中,你可以在pubspec.yaml文件中添加如下依赖:
代码语言:txt
复制
dependencies:
  flutter:
    sdk: flutter
  intl: ^0.17.0

这里我们使用intl库来处理日期和时间的格式化。

  1. 在需要显示时间的页面中,创建一个DateTime类型的变量来存储用户输入的时间。例如:
代码语言:txt
复制
DateTime selectedTime;
  1. 在TextFormField的controller属性中,创建一个TextEditingController对象,并将其与selectedTime变量关联起来。例如:
代码语言:txt
复制
TextEditingController _timeController = TextEditingController();

然后,在TextFormField的controller属性中使用_timeController。

  1. 在TextFormField的onTap回调中,弹出一个时间选择器供用户选择时间。例如:
代码语言:txt
复制
onTap: () {
  showTimePicker(
    context: context,
    initialTime: TimeOfDay.now(),
  ).then((selected) {
    if (selected != null) {
      setState(() {
        selectedTime = DateTime(
          DateTime.now().year,
          DateTime.now().month,
          DateTime.now().day,
          selected.hour,
          selected.minute,
        );
        _timeController.text = DateFormat.Hm().format(selectedTime);
      });
    }
  });
},

这里我们使用showTimePicker方法来显示时间选择器,并将用户选择的时间存储在selectedTime变量中。然后,我们使用DateFormat.Hm()来格式化时间,并将其显示在TextFormField中。

  1. 最后,在TextFormField的initialValue属性中设置初始值,以便在用户未选择时间时显示默认值。例如:
代码语言:txt
复制
initialValue: selectedTime != null ? DateFormat.Hm().format(selectedTime) : null,

这样,当用户点击TextFormField时,会弹出一个时间选择器供用户选择时间,并将选择的时间显示在TextFormField中。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

5分11秒

01.多媒体技术基础

55秒

PS小白教程:如何在Photoshop中制作浮在水面上的文字效果?

-

145元“抹布”首销一抢而空,订单已排到2022年,苹果淡定回应很正常

1分38秒

安全帽佩戴识别检测系统

2分7秒

手持501TC采集仪连接两线制传感器及存储查看

1分52秒

Web网页端IM产品RainbowChat-Web的v7.0版已发布

6分48秒

032导入_import_os_time_延迟字幕效果_道德经文化_非主流火星文亚文化

1.1K
1时8分

TDSQL安装部署实战

2分7秒

基于深度强化学习的机械臂位置感知抓取任务

48秒

手持读数仪功能简单介绍说明

5分33秒

JSP 在线学习系统myeclipse开发mysql数据库web结构java编程

16分8秒

人工智能新途-用路由器集群模仿神经元集群

领券