Search code examples
flutterdatetimeoperatorsdate-differencetextformfield

how to get date difference btw two DateTimeField to another TextFormField in flutter


I have two DateTimeField which users will select Start Date and End Date which I will like the difference in the number of days to be displayed on another TextFormField below it. E.g If I select 2020-11-15 on DateFormField as the start date and I select 2020-11-03 on DateFormField as the end date then it should automatically display 12 on total days TextFormField. Below is my code:


TextEditingController _controllerStartDate = TextEditingController();
  TextEditingController _controllerEndDate = TextEditingController();
TextEditingController _controllerTotalDays = TextEditingController();


body: Container{

child: Form{

child:ListView(

children:<widget>[

Text("Start Date:",style: TextStyle(color: colorBlack,fontWeight: FontWeight.bold),),
                    Container(
                        height: 50,
                        padding: EdgeInsets.only(left: 20),
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.all(
                            Radius.circular(5),
                          ),
                          border: Border.all(color: Colors.black, width: 1),
                        ),
                        child:DateTimeField(
                          format: format,
                          controller: _controllerStartDate,
                          decoration: InputDecoration(
                              labelStyle: TextStyle(color: Colors.black)),
                          onShowPicker: (context, currentValue) {
                            return showDatePicker(
                                context: context,
                                firstDate: DateTime(1900),
                                initialDate: currentValue ?? DateTime.now(),
                                lastDate: DateTime(2100));
                          },
                        )
                    ),
                    SizedBox(height: 25.0),

                    Text("End Date:",style: TextStyle(color: colorBlack,fontWeight: FontWeight.bold),),
                    Container(
                        height: 50,
                        padding: EdgeInsets.only(left: 20),
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.all(
                            Radius.circular(5),
                          ),
                          border: Border.all(color: Colors.black, width: 1),
                        ),
                        child:DateTimeField(
                          format: format,
                          controller: _controllerEndDate,
                          decoration: InputDecoration(
                            labelStyle: TextStyle(color: Colors.black)),
                          onShowPicker: (context, currentValue) {
                            return showDatePicker(
                                context: context,
                                firstDate: DateTime(1900),
                                initialDate: currentValue ?? DateTime.now(),
                                lastDate: DateTime(2100));
                          },
                        )
                    ),
                    SizedBox(height: 25.0),

TextFormField(
      autovalidate: _autoValidate,
      validator: validateLength,
      style: style,
      enabled: false,
      keyboardType: TextInputType.text,
      controller: _controllerTotalDays,
      decoration: InputDecoration(
        contentPadding: EdgeInsets.fromLTRB(20.0, 15.0, 20.0, 15.0),
        labelStyle: new TextStyle(color: colorBlack),
        hintStyle: new TextStyle(color: colorBlack),
        enabledBorder: const OutlineInputBorder(
          borderSide: const BorderSide(color: Colors.black),
        ),
        focusedBorder: OutlineInputBorder(
          borderSide: BorderSide(color: Colors.black),
        ),
      ),
    )

]

)

}


} 

From the above code, I will like some kind of operator difference between the date selected from the two DateFormField to display on the Textformfield just like the example I gave above.


Solution

  • you can obtain it as follows

    DateTime date1 = DateTime.parse(_controllerEndDate.text);
    DateTime date2 = DateTime.parse(_controllerStartDate.text);
    var difference = date1.difference(date2).inDays;
    print(difference);
    

    make sure that the values of the dates are not null