Flutter初识一 DatePicker和DateTime

DatePicker

前言

flutter已经为我们定义好了两种时间选择器样式showDatePicker和showDateRangePicker

showDatePicker

1. api

Future<DateTime?> showDatePicker({
  required BuildContext context,
  required DateTime initialDate, // 显示的最初开始DateTime
  required DateTime firstDate, // 允许选择的最小时间
  required DateTime lastDate,  // 允许选择的最大时间
  DateTime? currentDate, // 凸显今天的时间
  DatePickerEntryMode initialEntryMode = DatePickerEntryMode.calendar, // 样式
  SelectableDayPredicate? selectableDayPredicate,
  String? helpText,
  String? cancelText,
  String? confirmText,
  Locale? locale, // 本地化
  bool useRootNavigator = true,
  RouteSettings? routeSettings,
  TextDirection? textDirection,
  TransitionBuilder? builder,
  DatePickerMode initialDatePickerMode = DatePickerMode.day, // 日期格式
  String? errorFormatText,
  String? errorInvalidText,
  String? fieldHintText,
  String? fieldLabelText,
  TextInputType? keyboardType,
  Offset? anchorPoint,
})

2. 样式

DatePickerEntryMode.calendar

DatePickerEntryMode.input

showDateRangePicker

1. api和showDatePicker基本相同

Future<DateTimeRange?> showDateRangePicker({
  required BuildContext context,
  DateTimeRange? initialDateRange,
  required DateTime firstDate,
  required DateTime lastDate,
  DateTime? currentDate,
  DatePickerEntryMode initialEntryMode = DatePickerEntryMode.calendar,
  String? helpText,
  String? cancelText,
  String? confirmText,
  String? saveText,
  String? errorFormatText,
  String? errorInvalidText,
  String? errorInvalidRangeText,
  String? fieldStartHintText,
  String? fieldEndHintText,
  String? fieldStartLabelText,
  String? fieldEndLabelText,
  Locale? locale,
  bool useRootNavigator = true,
  RouteSettings? routeSettings,
  TextDirection? textDirection,
  TransitionBuilder? builder,
  Offset? anchorPoint,
})

2. 样式

DatePickerEntryMode.calendar

DatePickerEntryMode.input

Flutter并没有带时分秒样式的DatePicker, 如果需要只能自定义或者三方组件了

DateTime

前言

DateTime类用来标识一个瞬时的时间节点，可以通过构造函数，从标准格式（符合ISO 8601标准）的字符串中构造一个时间对象。DateTIme使用24小时计时法。基础使用：

var now = new DateTime.now(); // 获取当前时间的DateTime对象
var berlinWallFell = new DateTime.utc(1989, 11, 9); 
var moonLanding = DateTime.parse("1969-07-20 20:18:04Z"); // 8:18pm

如何将DateTime对象转成时间字符串？ DateTime有个自带的toString()可以将DateTime转成时间字符串，转换的结果是2023-02-10 14:28:34.647496，

toString()的实现如下：

String toString() {
  String y = _fourDigits(year);
  String m = _twoDigits(month);
  String d = _twoDigits(day);
  String h = _twoDigits(hour);
  String min = _twoDigits(minute);
  String sec = _twoDigits(second);
  String ms = _threeDigits(millisecond);
  String us = microsecond == 0 ? "" : _threeDigits(microsecond);
  if (isUtc) {
    return "$y-$m-$d $h:$min:$sec.$ms${us}Z";
  } else {
    return "$y-$m-$d $h:$min:$sec.$ms$us";
  }
}

通过toString()转换一般不能满足我们在项目中的使用，那我们是不是可以通过toString()的实现来自定义成自己想要的输出方式。

如何将DateTime对象转换成时间戳？

我们可以通过DateTime自带的方法将其转换成时间戳

DateTime.now().millisecondsSinceEpoch // 1676011033105
DateTime.now().microsecondsSinceEpoch // 1676011061369060

如何获取当前时间的前后一个小时的时间呢？

// 一个小时前的时间
DateTime.now().subtract(const Duration(hours:  1)) // 2023-02-10 13:48:01.435314

// 一个小时后的时间
DateTime.now().add(const Duration(hours:  1)) // 2023-02-10 15:48:01.435550

如何获取两个时间的差值？

var dateTime1 = DateTime.now();
var dateTime2 = DateTime.now().add(const Duration(days: 1));
print("时间差: ${dateTime2.difference(dateTime1)}"); // 24:00:00.000000
// 返回一个Duration实例

判断两个时间是否相等?

var dateTime1 = DateTime.now();
var dateTime2 = DateTime.now();
print("${dateTime1.compareTo(dateTime2)}"); // true

以上这些是我在项目中使用到的，DateTime还有一些其他的api，如果想要了解cmd + 鼠标左键查看相关api。