Flutter中的日期，格式化日期与组件选择

Flutter中的日期和时间戳

//获取当前日期
DateTime \_nowDate = DateTime.now();

print(\_nowDate);//2019-10-29 10:57:20.384872

print(\_nowDate.millisecondsSinceEpoch);//时间戳，1572317840384

print(DateTime.fromMicrosecondsSinceEpoch(1572317840384));//时间戳转换日期，1970-01-19 12:45:17.840384

所谓时间戳，是指自格林威治时间1970年01月01日00时00分00秒（北京时间1970年01月01日08时00分00秒）起至目前的总秒数。

有些情况下，后台可能会将所有的时间都转换成时间戳返回给我们前端，这是我们就需要将时间戳转换成时间，并将时间进行格式化。

展示一个时间，我们会有多种形式，列如1970-01-01、1970/01/01、1970年01月01日，等等，那么我们如何把同一个时间根据需要转换成不同的格式呢？接下来我就为大家介绍一个Flutter中的第三方库。

Flutter第三方組件庫

登录pub.dev搜索date_format组件查看Installing添加依赖

pubspec.yaml

dependencies:
    date\_format: ^1.0.8

按ctrl+s或flutter packages get后会自动下载依賴包，注意控制台，如无异常就是下载成功

引入包

import  package:date\_format/date\_format.dart ;

print(formatDate(DateTime.now(), [yyyy, "-", mm, "-", dd, " ", DD, " ", HH, ":", nn, ":", ss]));

输出

2019-10-29 Wednesday 14:27:29

调用Flutter自带的日期选择器组件和时间选择器组件

显示日历組件和获取选中数据的方法一

//\_代表私有，重写私有的日历组件
  \_showDatePicker(){
    showDatePicker(
      context:context,//上下文必须传入
      initialDate:\_nowDate,//设置初始化日期
      firstDate:DateTime(1900),//设置起始时间
      lastDate: DateTime(2100),//设置结束时间
    ).then((val){//異步方法
      print(val);
    });
  }

方法二

\_showDatePicker() async{
    var val = await showDatePicker(
      context:context,//上下文必须传入
      initialDate:\_nowDate,//设置初始化日期
      firstDate:DateTime(1900),//设置起始时间
      lastDate: DateTime(2100),//设置结束时间
    );
    setState(() {
      //将获得的时间传给变量
      this.\_nowDate =val;
    });
  }

使用变量替換文本

Container(  
  margin: EdgeInsets.all(5),  
  width: 350,  
  height: 120,  
  decoration: new BoxDecoration(  
    color: Colors.black12,  
    borderRadius:BorderRadius.circular(10.0),//边框  
  ),  
  child: GestureDetector(//手势事件
    child: Text( ${formatDate(\_nowDate, [yyyy, "-", mm, "-", dd])} ),//替換文本  
    onTap: (){  
      \_showDatePicker();//调用重写的组件  
    },  
  ),  
),

时间

　　//自带组件
  showTimePicker(
      context: context,
      initialTime: new TimeOfDay.now(),
    ).then((val) {
      print(val);
    }).catchError((err) {
      print(err);
    });

  //获得当前时间
  var \_nowTime = TimeOfDay.now();


\_showTimePicker() async{
    var val = await showTimePicker(
        context: context,//上下文
        initialTime: \_nowTime/当前时间，设置固定时间TimeOfDay(hour: 12,minute: 10)
    );
    setState(() {
      this.\_nowTime = val;
    });
  }