Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

date picker is not showing months correctly – flutter

am taking date of birth from users while registering, users click on the form field so date picker shows and they choose their date of birth, the problem is for example user chooses "15-October-1996", the months always show as "00" like this "15-00-1996" here is the "DateTimeField()" code:

final birthDateField = DateTimeField(
      controller: dateController,
      format: DateFormat("dd-mm-yyyy"),
      onShowPicker: (context, currentValue) async {
        final date = await showDatePicker(
            context: context,
            initialDate: currentValue ?? DateTime.now(),
            firstDate: DateTime(1920),
            lastDate: DateTime(2030));
        return date;
      },
      decoration: InputDecoration(
        border: OutlineInputBorder(
          borderRadius: BorderRadius.circular(10),
        ),
        labelText: 'تاريخ الميلاد',
        prefixIcon: Icon(Icons.calendar_month),
      ),
    );

and i rendered the fields inside a Scaffold widget as follows:

return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        backgroundColor: Colors.transparent,
        elevation: 0,
        leading: IconButton(
          icon: Icon(
            Icons.arrow_back,
            color: Colors.purple,
          ),
          onPressed: () {
            Navigator.of(context).pop();
          },
        ),
      ),
      body: Center(
        //Use the SingleChildScrollView as a wrapper to ensure scrolling in case scorrling is needed.
        child: SingleChildScrollView(
          //wrap the elements with Container to provide flexibility in designing the elements.
          child: Container(
            color: Colors.white,
            //use the form as a container of the input fields as it is a login form.
            child: Padding(
              padding: const EdgeInsets.all(36.0),
              child: Form(
                //give the form wrapper the key value to tell flutter that this is the form design for your form functions.
                key: _formKey,
                //use the column to show the elements in vertical array.
                child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    //Use children property inside the column to specify list of widgets
                    children: [
                      birthDateField,
                      SizedBox(
                        height: 20,
                      ),
                      signUpButton,
                    ]),
              ),
            ),
          ),
        ),
      ),
    );

am using a controller to update values and send to database, i also imported all the necessary packages, so am not sure what am missing i would be thankful for any help.

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

>Solution :

change your formatter to "dd-MM-yyyy":

final birthDateField = DateTimeField(
      controller: dateController,
      format: DateFormat("dd-MM-yyyy"), //<- change this
      onShowPicker: (context, currentValue) async {
        final date = await showDatePicker(
            context: context,
            initialDate: currentValue ?? DateTime.now(),
            firstDate: DateTime(1920),
            lastDate: DateTime(2030));
        return date;
      },
      decoration: InputDecoration(
        border: OutlineInputBorder(
          borderRadius: BorderRadius.circular(10),
        ),
        labelText: 'تاريخ الميلاد',
        prefixIcon: Icon(Icons.calendar_month),
      ),
    );
```
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading