【问题标题】:How to set one datepicker selected date is firstdate for another datepicker in flutter如何设置一个日期选择器选择的日期是颤振中另一个日期选择器的第一个日期
【发布时间】:2019-12-14 08:03:26
【问题描述】:

我有两个日期选择器字段合同开始日期和合同结束日期。当我选择合同开始日期时,合同结束日期的初始值或第一个日期是第一个日期选择器的选定日期。

这里我有两个日期选择器的代码。

  Widget _buildContractBeginDate() {
    return DateTimeField(
      format: format,
      autocorrect: true,
      autovalidate: false,
      controller: _contractBeginDate,
      readOnly: true,
      validator: (date) => (date == null || _contractBeginDate.text == '')
          ? 'Please enter valid date'
          : null,
      decoration: InputDecoration(
          labelText: "Contract Begin Date",
          hintText: "Contract Begin Date",
          prefixIcon: Icon(
            FontAwesomeIcons.calendar,
            size: 24,
          )),
      onShowPicker: (context, currentValue) {
        return showDatePicker(
          context: context,
          firstDate: DateTime(1900),
          initialDate: currentValue ?? DateTime.now(),
          lastDate: DateTime(2022),
        );
      },
    );
  }

  Widget _buildContractEndDate() {
    return DateTimeField(
      format: format,
      autocorrect: true,
      autovalidate: false,
      controller: _contractEndDate,
      readOnly: true,
      validator: (date) => (date == null || _contractEndDate.text == '')
          ? 'Please enter valid date'
          : null,
      decoration: InputDecoration(
          labelText: "Contract End Date",
          hintText: "Contract End Date",
          prefixIcon: Icon(
            FontAwesomeIcons.calendar,
            size: 24,
          )),
      onShowPicker: (context, currentValue) {
        return showDatePicker(
            context: context,
            firstDate: DateTime(1900),
            initialDate: currentValue ?? DateTime.now(),
            lastDate: DateTime(2022));
      },
    );
  }

【问题讨论】:

    标签: flutter dart datepicker flutter-layout flutter-dependencies


    【解决方案1】:

    我创建了一个与你的有点相似的演示,请参考:

    TL;DR:使用ValueNotifier<DateTime> 并从第一个日期选择器更新它的值,并始终使用该通知程序的值作为第二个日期选择器的第一个日期。您将始终通过这种方式获得更新的日期。

    Run code on Dartpad

    import 'package:flutter/material.dart';
    
    void main() {
      runApp(
        MaterialApp(home: MyApp()),
      );
    }
    
    class MyApp extends StatefulWidget {
      @override
      _MyAppState createState() => _MyAppState();
    }
    
    class _MyAppState extends State<MyApp> with SingleTickerProviderStateMixin {
      ValueNotifier<DateTime> _dateTimeNotifier = ValueNotifier<DateTime>(DateTime.now());
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(title: Text('Demo')),
          body: Column(
            children: <Widget>[
              _buildContractBeginDate(context, _dateTimeNotifier),
              _buildContractEndDate(context, _dateTimeNotifier),          
            ],
          ),
        );
      }
    }
    
    Widget _buildContractBeginDate(BuildContext context, ValueNotifier<DateTime> _dateTimeNotifier) {
         return RaisedButton(
           child: Text('Begin Date'), 
          onPressed: () => showDatePicker(
                context: context,
                firstDate: DateTime(1900),
                initialDate: _dateTimeNotifier.value,
                lastDate: DateTime(2022), 
                ).then((DateTime dateTime) => _dateTimeNotifier.value = dateTime),
        );
      }
    
      Widget _buildContractEndDate(BuildContext context,ValueNotifier<DateTime> _dateTimeNotifier) {
        return RaisedButton(
           child: Text('End Date'), 
          onPressed: () {
            return showDatePicker(
                context: context,
                firstDate: _dateTimeNotifier.value,
                initialDate: _dateTimeNotifier.value ?? DateTime.now(),
                lastDate: DateTime(2022));
          },
        );
      }
    

    希望对你有帮助,如有疑问请评论。

    【讨论】:

    • 我很高兴能帮上忙 :)
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-05-19
    • 2019-07-25
    • 1970-01-01
    相关资源
    最近更新 更多