Date Picker is not showing when clicking the field

Im building a registration screen that contains a form of input fields, one of the fields is to input the date of birth from user by showing the Date Picker when the user clicks the field, first i have created an instance of DateFormField and implemented the solution as follows:

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

Then i have rendered the birthDateField inside the Scaffold as follows:

return Scaffold(
  backgroundColor: Colors.white,
  body: Center(
    //Use the SingleChildScrollView as a wrapper to ensure scrolling in case scrolling 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 Registration 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: <Widget>[
                  nameField,
                  SizedBox(
                    height: 20,
                  ),
                  emailField,
                  SizedBox(
                    height: 20,
                  ),
                  passwordField,
                  SizedBox(
                    height: 20,
                  ),
                  confirmPasswordField,
                  SizedBox(
                    height: 20,
                  ),
                  birthDateField,
                  SizedBox(
                    height: 20,
                  ),
                ]),
          ),
        ),
      ),
    ),
  ),
);

so after running the code the field appears normally but when clicking its not opening the picker, i tried to set a TextEdittingController i though its updating the state issue but doesn't work and its not showing any errors, i would be thankful if anyone have a idea of whats i am missing.

Note: i have imported the necessary libraries :

import 'dart:io';
import 'package:image_picker/image_picker.dart';
import 'package:intl/intl.dart';
import 'package:datetime_picker_formfield/datetime_picker_formfield.dart';
import 'package:flutter/material.dart';

CodePudding user response：

The issue is here, last date is getting 2022/01/01 and current date is greater than last date.

In order to fix the issue, you need to provide last date which must be greater initial date. You can include lastDate: DateTime(2023)

onShowPicker: (context, currentValue) async {
  final date = await showDatePicker(
      context: context,
      initialDate: currentValue ?? DateTime.now(),
      firstDate: DateTime(1920),
      lastDate: DateTime(2023));
  return date;
},