如何设置一个日期选择器选择的日期是颤振中另一个日期选择器的第一个日期

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

我制作了一个和你的有点相似的demo，请参考：

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

希望对您有所帮助，如有疑问请评论。

如何设置一个日期选择器选择的日期是颤振中另一个日期选择器的第一个日期

How to set one datepicker selected date is firstdate for another datepicker in flutter

datepicker

dart

flutter

flutter-dependencies

flutter-layout