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

如何在Flutter中从timePicker中选择时间后删除TimeOfDay文本

在Flutter中,可以通过以下步骤从timePicker中选择时间并删除TimeOfDay文本:

  1. 首先,需要导入flutter/material.dart库,因为它提供了与用户界面相关的控件和功能。
  2. 创建一个状态变量来存储选定的时间,例如selectedTime
  3. 创建一个FlatButton按钮,并在onPressed回调中打开时间选择器对话框。
代码语言:txt
复制
FlatButton(
  onPressed: () {
    showTimePicker(
      context: context,
      initialTime: TimeOfDay.now(),
    ).then((selectedTime) {
      setState(() {
        selectedTime != null
            ? selectedTime = selectedTime
            : selectedTime = selectedTime;
      });
    });
  },
  child: Text('选择时间'),
),
  1. showTimePicker函数中,我们指定了初始时间为当前时间(TimeOfDay.now())。当用户选择时间后,我们使用then方法来处理返回的结果。
  2. then方法中,我们使用setState函数来更新selectedTime状态变量。如果用户选择了一个时间,selectedTime将被更新为选定的时间,否则将保持不变。
  3. 在界面上显示选定的时间,可以使用一个Text控件来显示。
代码语言:txt
复制
Text(selectedTime != null ? selectedTime.format(context) : '未选择时间'),

以上就是在Flutter中从timePicker中选择时间后删除TimeOfDay文本的完整步骤。

值得注意的是,以上代码只是提供了一个基本的实现方式,您可以根据实际需求进行修改和优化。同时,为了使您能更好地理解和学习Flutter开发,建议您阅读Flutter官方文档和示例代码。

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

相关·内容

  • Flutter lesson 8:输入框,时间日期选择

    日期时间选择 Flutter自带的 showDatePicker 和 showTimePicker 两个方法可以进行时间和日期的选择。...选择时间日期还是挺简单的,不过需要注意的是 flutter: 选择的日期是:2019-07-30 00:00:00.000 flutter: 选择的时间是:TimeOfDay(21:34) 两个方法选择时间...,日期后,时间日期的格式是上面那样的,如果你要使用,或许你需要处理一下。...选择时间是使用的 TimeOfDay,选择日期使用的是 DateTime ,两个是不同的方法,没有选择日期又选择时间的,或许在dart.pub上面有一些第三方的插件可以。...输入框 TextField TextField 是Flutter中的用户输入框,属性挺多的,不同的配置出不同的效果,就像是HTML中的 input 一样。

    4.8K20

    【译】Flutter 1.20 发布

    在快速这个类别中,从底层级别的渲染引擎到 Dart 语言本身,本次我们都实现了多项性能改进。...; 对旧版本的 Material Widget(例如时间和日期选择器),以及 desktop 和 mobile 上 Flutter 应用中 About box 的全新响应式 license 页面的更新。...在我们的UTF-8解码基准测试中,我们发现,在低端ARM设备上,英语文本的全面改进从近200%提高到中文文本的400%。...自动填充移动文本字段 一段时间以来,最受用户欢迎的功能之一是为 Flutter 程序中对文本自动填充在 Android 和 iOS提供支持。...无法列出太多工具更新 Flutter 1.20 时间表中的工具发生了太多重大变化,因此我们无法在此处列出所有内容。

    4K10

    Flutter 时间选择组件

    在Flutter 应用开发过程中,或多或少的都会涉及到时间选择器相关的内容。...Flutter默认提供了DatePicker日期选择器,如果对样式没有特殊的要求,那么可以使用它来进行时间的选择,默认的样式如下所示。...通常在移动应用开发中,App的涉及多是参考iOS的设计来的,所以这时候,多半需要进行自定义组件了。...不管,为了快速的进行开发我们可以选择一些第三方的组件库,如flutter_custom_calendar,此库具有如下的功能: 支持公历,农历,节气,传统节日,常用节假日 日期范围设置,默认支持的最大日期范围为...controller.addOnCalendarSelectListener((dateModel) { // debugPrint(dateModel.toString()+'+++++++++++'); // //刷新选择的时间

    3.7K30

    WinCC V7.5 制作 设备运行报表3

    第一步,在 ActiveX 控件上右键,选择“添加/删除”,然后在 OCX 控件列表中选择Microsoft Date and Timer Picker Control 和 Microsoft Web...第三步,添加组合框控件 在画面上添加组合框控件,用来选择设备。可以从智能对象下拖拽组合框控件直接添加到画面,并设置属性。步骤如图 19 所示。...也可以直接从 excel 中拖拽文本到 WinCC 直接生成组合框。如图 20 所示。 首先在 excel 输入需要的文本,选择所有文本,移动鼠标到选中区域的右下角, 直到鼠标变成十字光标形状。...然后按着鼠标右键拖拽文本到 WinCC 画面,松开鼠标,在弹出对话框中选择“插入组合框”。最后,具有三项文本的组合框被插入到 WinCC 画面。...然后点击“生成报表”按钮, WinCC 从数据库读取设定日期的相应设备的数据,显示在 WinCC 画面中。如图 23 所示。

    5.4K11

    Date & Time组件(下)

    本节我们来继续学习Android系统给我们提供的几个原生的Date & Time组件,他们分别是: DatePicker(日期选择器),TimePicker(时间选择器),CalendarView(日期视图...1.DatePicker(日期选择器) 可供我们使用的属性如下: android:calendarTextColor : 日历列表的文本的颜色 android:calendarViewShown...spinnersShown:是否显示spinner android:startYear:设置第一年(内容),比如19940年 android:yearListItemTextAppearance:列表的文本出现在列表中... 另外,奇怪的是,如果是上面这种mode为calendar的设置了事件并没有响应,看来上面这种 只能选择完后获取对应的值了,如果你的mode未spinner的话,使用下述代码就可以完成事件监听: 实现代码如下...,Toast.LENGTH_SHORT).show(); } } 运行效果图: 2.TimePicker(时间选择器) 先来看看5.0的TimePicker长什么样: 样子还是蛮标致的哈,我们发现官方给我们提供的属性只有一个

    15720

    Windows 8.1 应用再出发 - 几种新增控件(1)

    而当更复杂的内容,如文本,图像等存在时,我们选择使用AppBar 控件。...大家可能也发现了,年份并没有特殊的限制,如果我们想选择出生年月的话,那么超过2014年明显是不合理的;如果想选择一个计划完成时间,那么2013年以前的年份也是我们不想看到的。...TimePicker  TimePicker多数时候会和DatePicker搭配使用,来完成日期和时间的选取。默认外观是这样的 ?...如上图所示,我们设置时间为20:19,也就是下午8:19。另外我们可以把分钟选择器的增量值设置为适合我们的值,比如半个小时。...我们看到,设置后的TimePicker,分钟选择只有0和30两种,这正是我们想要的。

    1.4K90

    【Android从零单排系列十一】《Android视图控件——日历、日期、时间选择控件》

    DatePicker –日期选择控件 3.TimePicker –时间选择控件 4.Chronometer—计时器控件 三.DEMO 前言 小伙伴们,在上文中我们介绍了Android视图控件ImageView...一.日历、日期、时间组件基本介绍 在 Android 应用开发中,CalendarView 、DatePicker和TimePicker实现选择日期时间、Chronometer实现计时器功能,本文结合实例形式分析了...DatePicker –日期选择控件 android:calendarTextColor : 日历列表的文本的颜色 android:calendarViewShown:是否显示日历视图 android:...spinnersShown:是否显示spinner android:startYear:设置第一年(内容),比如19940年 android:yearListItemTextAppearance:列表的文本出现在列表中...android:yearListSelectorColor:年列表选择的颜色 3.TimePicker –时间选择控件 calendarViewShown 设置其是否显示CalenderView组件

    14.3K30
    领券