如何设置一个日期选择器的选定日期是扑扑中另一个日期选择器的初次日期

Question

我有两个日期选择器字段合同开始日期和合同结束日期。当我选择合同开始日期时，将选择第一个日期选择器的日期作为合同结束日期的初始值或第一个日期。

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

  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));
      },
    );
  }

Answer 1

我创建了一个与您的演示有些相似的演示，请参考：

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

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));
      },
    );
  }

我希望这会有所帮助，如有任何疑问，请发表评论。