2-1-3. 日历组件/时间【CupertinoDatePicker】

基本属性

CupertinoDatePicker({  // iOS风格的日期选择器小部件。
    Key key,
    this.mode = CupertinoDatePickerMode.dateAndTime, // 显示模式
    @required this.onDateTimeChanged, // 当选定的日期和/或时间发生更改时的 回调
    DateTime initialDateTime, // 设置默认选择日期
    this.minimumDate, // 选择器可以滚动到的最小日期 没有限制则为空
    this.maximumDate, // 选择器可以滚动到的最大日期 没有限制则为空
    this.minimumYear = 1, // 选择器可以滚动到的最小年份
    this.maximumYear,     // 
    this.minuteInterval = 1, //分钟微调器的粒度(如果在当前模式下显示)。必须是60的整数倍。
    this.use24hFormat = false,
    this.backgroundColor, //  背景色
  }) : initialDateTime = initialDateTime ?? DateTime.now(),
       assert(mode != null),
       assert(onDateTimeChanged != null),
       assert(minimumYear != null),
       assert(
         minuteInterval > 0 && 60 % minuteInterval == 0,
         'minute interval is not a positive integer factor of 60',
       ),

基本用法【日期】

showDialog(
 context: context,
 builder: (context) {
   return AlertDialog(
     title: Text('选择结束日期', style: TextStyle( fontSize: 18, fontWeight: FontWeight.w500 ), textAlign: TextAlign.center,),
     content: Container(
       width: _width,
       height: 150,
       child: CupertinoDatePicker(
         initialDateTime: DateTime.now().add(Duration( days: -90 )), // 设置默认几天 3个月前 需要大于minimumDate
         mode: CupertinoDatePickerMode.date,
         minimumDate: DateTime.now().add(Duration( days: -91)), // 当前日期前进多少天 
         maximumDate: DateTime.now().add(Duration(days: 0)), // 当前日期的后几天
        //  backgroundColor: Colors.red,
         onDateTimeChanged: (e){
           print(e);
         },
       ),
     ),
     actions: <Widget>[
       FlatButton(child: Text('取消'),onPressed: (){
         Navigator.of(context).pop('cancel');
       },),
       FlatButton(child: Text('确认'),onPressed: (){
         Navigator.of(context).pop('ok');
       },),
     ],
   );
 });

showDialog(
 context: context,
 builder: (context) {
   return AlertDialog(
     title: Text('选择结束日期', style: TextStyle( fontSize: 18, fontWeight: FontWeight.w500 ), textAlign: TextAlign.center,),
     content: Container(
       width: _width,
       height: 150,
       child: CupertinoDatePicker(
         mode: CupertinoDatePickerMode.date,
         minimumDate: DateTime.now().add(Duration( days: -91)), // 当前日期前进多少天 
         maximumDate: DateTime.now().add(Duration(days: 1)), // 当前日期的后几天
        //  backgroundColor: Colors.red,
         onDateTimeChanged: (e){
           print(e);
         },
       ),
     ),
     actions: <Widget>[
       FlatButton(child: Text('取消'),onPressed: (){
         Navigator.of(context).pop('cancel');
       },),
       FlatButton(child: Text('确认'),onPressed: (){
         Navigator.of(context).pop('ok');
       },),
     ],
   );
 });

基本用法【时间】

修改mode即可 mode: CupertinoDatePickerMode.dateAndTime,

国际化

本来日期是英文的，需要弄成中文就需要添加国际化标准

pubspec.yaml文件添加

dependencies:
  flutter_localizations:
    sdk: flutter

在MaterialApp主文件添加

  localeListResolutionCallback:
              (List<Locale> locales, Iterable<Locale> supportedLocales) {
            return Locale('zh');
          },
          localeResolutionCallback:
              (Locale locale, Iterable<Locale> supportedLocales) {
            return Locale('zh');
          },
          localizationsDelegates: [
            GlobalMaterialLocalizations.delegate,
            GlobalWidgetsLocalizations.delegate,
            GlobalCupertinoLocalizations.delegate,
          ],
          supportedLocales: [
            const Locale('zh', 'CH'),
            const Locale('en', 'US'),
          ],