GestureDetector手势

手势
在flutter中,手势表示可以从多个单独的指针事件(甚至可能是多个单独的指针)识别的语义动作(例如点击,拖拽和缩放)。 完整的一个手势可以分发多个事件,对应于手势的生命周期(例如,拖拽开始,拖拽更新和拖拽结束):

单击

onTapDown 指针已经在特定位置与屏幕接触
onTapUp 指针停止在特定位置与屏幕接触
onTap 单击事件触发
onTapCancel 先前指针触发的onTapDown不会在触发单击事件
双击

onDoubleTap 用户快速连续两次在同一位置轻敲屏幕.
长按

onLongPress 指针在相同位置长时间保持与屏幕接触
垂直拖拽

onVerticalDragStart 指针已经与屏幕接触并可能开始垂直移动
onVerticalDragUpdate 指针与屏幕接触并已沿垂直方向移动.
onVerticalDragEnd 先前与屏幕接触并垂直移动的指针不再与屏幕接触,并且在停止接触屏幕时以特定速度移动
水平拖拽

onHorizontalDragStart 指针已经接触到屏幕并可能开始水平移动
onHorizontalDragUpdate 指针与屏幕接触并已沿水平方向移动
onHorizontalDragEnd 先前与屏幕接触并水平移动的指针不再与屏幕接触,并在停止接触屏幕时以特定速度移动

带点击事件的容器
InkWell(
  child: Text('时间'),
onTap: _showTimePicker,
),
 
Flutter 日期和时间戳
 
日期转化成时间戳:
var now = new DateTime.now();
print(now.millisecondsSinceEpoch);//单位毫秒,13 位时间戳
时间戳转化成日期:
var now = new DateTime.now();
var a=now.millisecondsSinceEpoch; //时间戳
print(DateTime.fromMillisecondsSinceEpoch(a));
 
自带时间格式转换
formatDate(DateTime ,[yyyy,'-',mm,'-',dd]);
 
自定义时间
var time = DateTime(DateTime.now().year, DateTime.now().month, 1, DateTime.now().hour, DateTime.now().minute, DateTime.now().second);
获取一个月多少天
var time = DateTime(DateTime.now().year, DateTime.now().month + 1 , 0).day;
var time = DateTime(DateTime.now().year, DateTime.now().month + 1 , 0);

1.日期转换成时间戳

var now=new DateTime.now();

print(now.millisecondsSinceEpoch); //单位毫秒,13位时间戳

2.时间戳转换成日期

var now=new DateTime.now();

var a=now.millisecondsSinceEpoch; // 时间戳

print(DateTime.fromMillisecondsSinceEpoch(a));

3.创建指定时间

DateTime assignDay = new DateTime(2020,10,10);

print(assignDay);   // 2020-10-10 00:00:00.000

4.计算时间跨度

// 例如计算1天14小时45分的跨度

Duration timeRemaining = new Duration(days:1, hours:14, minutes:45);

print(timeRemaining);  // 38:45:00.000000

5.字符串转DateTime

DateTime.parse('2019-11-08') 或者 DateTime.parse('2019-11-08 12:30:05')

6.在之前——时间比较

var today = DateTime.now();

var date = DateTime.parse("2019-06-20 15:32:41");

today.isBefore(date);

7.在之后——时间比较

var today = DateTime.now();

var date = DateTime.parse("2019-06-20 15:32:41");

today.isAfter(date);

8.相等——时间比较

var today = DateTime.now();

var date = DateTime.parse("2019-06-20 15:32:41");

today.isAtSameMomentAs(date);

9.时间增加

var today = DateTime.now();   // 2019-11-08 02:54:53.218443

var fiftyDaysFromNow = today.add(new Duration(days: 5));

print('today加5天:$fiftyDaysFromNow');  // today加5天:2019-11-13 02:54:53.218443

10.时间减少

var today = DateTime.now();   // 2019-11-08 02:54:53.218443

var fiftyDaysAgo = today.add(new Duration(days: 5));

print('today加5天:$fiftyDaysAgo ');  // today减5天:2019-11-03 02:54:53.218443

11.时间差(小时数)

var day1 = new DateTime(2019, 6, 20, 17, 30, 20);

var day2 = new DateTime(2019, 7, 21, 0,  0, 0);

print('比较两个时间 差 小时数:${day1.difference(day2)}');  //  比较两个时间 差 小时数:-726:29:40.000000

12.获取年、月、日、星期、时、分、秒、毫秒、微妙

year、month、day、weekday、hour、minute、second、millisecond、microsecond

var today = DateTime.now();

print(today.year);

13.获取本地时区简码

DateTime today = DateTime.now();

print('本地时区简码:${today.timeZoneName}');  //  本地时区简码:GMT

14.返回UTC与本地时差(小时数)

DateTime today = DateTime.now();

print('返回UTC与本地时差 小时数:${today.timeZoneOffset}');

 
常用属性

DateTime time = DateTime.now();

  • time.day,今天多少号
  • time.month 当前月份
  • time.year
  • time.hour
  • time.minute
  • time.second
  • time.millisecond
  • time.millisecondsSinceEpoch
常用方法

DateTime last = DateTime.now();

  • print(time.difference(last)>Duration(seconds: 1));// 比较二者差异
  • time.add(Duration(seconds: 1));
  • print(time.compareTo(last));//大于返回1
  • print(time.isAfter(last));//是否在之后
  • print(time.isBefore(last));//是否在之前
  • print(time.isAtSameMomentAs(last));//是否在同一时刻
Flutter 第三方库 date_format 的使用
文档:https://pub.dev/packages/date_format
 
在main.dart入口文件 dependencies 添加 date_format: ^1.0.8 然后再在要使用的地方引入 import 'package:date_format/date_format.dart';
 
dependencies:
  flutter:
    sdk: flutter
 
  # The following adds the Cupertino Icons font to your application.
  # Use with the CupertinoIcons class for iOS style icons.
  cupertino_icons: ^0.1.2
  date_format: ^1.0.8
 
//案例代码
import 'package:flutter/material.dart';
import 'package:date_format/date_format.dart'; class DatePage extends StatefulWidget{
DatePage({Key key});
_DatePage createState() => _DatePage();
} class _DatePage extends State {
var date = new DateTime.now();
@override
Widget build(BuildContext context) {
// 获取自带日期
_showDatePicker () async {
var _getTime = await showDatePicker(
context: context,
initialDate: DateTime.now(),// 现在时间
firstDate: DateTime(1990), // 时间选项的最小时间
lastDate: DateTime(2030) // 时间选项的最大时间
);
if(_getTime == null) return;
setState(() {
date = _getTime;
});
};
// 获取自带时间
var _time = TimeOfDay(hour: date.hour,minute: date.minute);
_showTimePicker () async {
var _getTime = await showTimePicker(
context: context,
initialTime: _time,// 现在时间
// 时间选项的最大时间
);
if(_getTime == null) return;
setState(() {
_time = _getTime;
});
};
// TODO: implement build
return Scaffold(
appBar: AppBar(
title: Text('Date')
),
body: ListView(
children: <Widget>[
Text('${date}'), // 日期
Text('${date.millisecondsSinceEpoch}'), // 毫秒数
Text('${DateTime.fromMillisecondsSinceEpoch(date.millisecondsSinceEpoch)}'), //毫秒转换成时间 // 自带日期
RaisedButton(
child: Text('日期${date}'),
onPressed: _showDatePicker
),
// 自带时间
RaisedButton(
child: Text('时间${_time.format(context)}'),
onPressed: _showTimePicker,
),
// 带点击事件的容器
InkWell(
child: Text('日期${date}'),
onTap: _showDatePicker,
),
InkWell(
child: Text('时间${_time.format(context)}'),
onTap: _showTimePicker,
),
Text('第三方时间${formatDate(date, [yyyy, '-', mm, '-', dd])}'),
Text('第三方时间${formatDate(date, [yyyy, '年', mm, '月', dd, '日', hh, '时', mm, '分', ss, '秒'])}'),
],
)
);
}
}

InkWell容器 和 官方自带日期组件 和第三方 日期格式转换组件的更多相关文章

  1. 关于jquery日期控件及时间格式转换2017.05.27

    开始时间:<input type="date" id="starttime" class="time"/>//data为日期控件 ...

  2. iphone SE 自带视频播放器要求的视频格式转换参数

  3. OLEDB 命令转换组件的用法

    在数据流任务组件中,OLEDB 命令转换组件对输入的每行数据调用TSQL,该组件能够把输入的数据作为参数,因此,该转换组件主要用于运行参数化的查询. 命令转换组件的配置十分简单,只有三个可编辑属性,位 ...

  4. Vite+TS带你搭建一个属于自己的Vue3组件库

    theme: nico 前言 随着前端技术的发展,业界涌现出了许多的UI组件库.例如我们熟知的ElementUI,Vant,AntDesign等等.但是作为一个前端开发者,你知道一个UI组件库是如何被 ...

  5. 第32讲 UI组件之 时间日期控件DatePicker和TimePicker

    第32讲 UI组件之 时间日期控件DatePicker和TimePicker 在Android中,时间日期控件相对来说还是比较丰富的.其中, DatePicker用来实现日期输入设置,    Time ...

  6. element-ui日期组件DatePicker设置日期选择范围Picker Options

    element-UI提供了DatePicker日期选择器组件,可以让我们很方便的获取到日期,默认的选择是全部的日期都可以选择的,但是很多场景中我们要对日期选择范围做限定,比如出行日期就不能选过去的日期 ...

  7. 15. react UI组件和容器组件的拆分 及 无状态组件

    1.组件的拆分 组件拆分的前提 当所有的逻辑都出现在一个组件内时 组件会变得非常复杂 不便与代码的维护 所以对组件进行拆分 IU组件 进行页面渲染 容器组件  进行逻辑操作 UI组件的拆分 新建一个 ...

  8. Asp.net core自定义依赖注入容器,替换自带容器

    依赖注入 在asp.net core程序中,众所周知,依赖注入基本上贯穿了整个项目,以通用的结构来讲解,控制器层(Controller层)依赖业务层(Service层),业务层依赖于仓储层(Repos ...

  9. C#组件系列———又一款日志组件:Elmah的学习和分享

    前言:好久没动笔了,都有点生疏,12月都要接近尾声,可是这月连一篇的产出都没有,不能坏了“规矩”,今天还是来写一篇.最近个把月确实很忙,不过每天早上还是会抽空来园子里逛逛.一如既往,园子里每年这个时候 ...

随机推荐

  1. babel 的简单使用

    之前在项目中使用.balelrc文件,但是一直不知道具体怎么使用,就知道可以将es6语法转码为es5语法. 今天就简单的做个例子,也算是记录一下困扰了好久的问题. 转码步骤: 首先在项目的目录中安装B ...

  2. 分类问题(四)ROC曲线

    ROC曲线 ROC曲线是二元分类器中常用的工具,它的全称是 Receiver Operating Characteristic,接收者操作特征曲线.它与precision/recall 曲线特别相似, ...

  3. Spring Boot整合Freemarker

    一.首先导入依赖 <!-- 添加freemarker模版的依赖 --> <dependency>     <groupId>org.springframework. ...

  4. jquery tagsinput监听输入、修改、删除事件

    个人博客 地址:http://www.wenhaofan.com/article/20181118192458 由于度娘上的根本搜不到对应的操作,连该插件对应的文档介绍都没有,不得已debug了源码才 ...

  5. npm 模块开发调试技巧之最优方案npm link

    在我们平时写项目中,当我们需要新开发或修改的 npm 模块时,如何在本地项目中调试呢? 本地项目路径:G:\npm\project 开发的模块路径:G:\npm\model 方法一: 在cmd命令窗口 ...

  6. python3函数的参数

    函数的定义能简化代码的逻辑,对于函数的调用者来说,只需要知道如何正确的传递参数,以及知道函数将返回什么值就可以了,而函数内部的复杂逻辑被封装起来,调用者不必了解. 位置参数 调用函数时,传入实参的值按 ...

  7. Python RSA

    # -*- coding: utf-8 -*- from Crypto import Random from Crypto.Hash import SHA from Crypto.Cipher imp ...

  8. 笔记本u盘插上不显示

    u盘突然拔出笔记本再次插入时不显示: 解决方法:我的电脑-设备管理器-其他设备(你的U盘驱动)-卸载 再重新插上去,即可显示

  9. 使用Vue创建一个新项目

    1.环境 保证已经安装好了node\npm\vue等工具,将路径设置为想要建立新项目的文件夹路径 2.关于npm与cnpm npm包管理器,是集成在node中的,node环境安装完成,npm包管理器也 ...

  10. sql查询 —— 模糊查询

    --模糊查询 --like --%至少替换一个 -- _只替换一个 -- 查姓李的人 select *from student name like "李%"; -- 查名为杰伦的人 ...