showDatePicker function

Future<DateTime> showDatePicker (
  1. {@required BuildContext context,
  2. @required DateTime initialDate,
  3. @required DateTime firstDate,
  4. @required DateTime lastDate,
  5. DateTime currentDate,
  6. DatePickerEntryMode initialEntryMode: DatePickerEntryMode.calendar,
  7. SelectableDayPredicate selectableDayPredicate,
  8. String helpText,
  9. String cancelText,
  10. String confirmText,
  11. Locale locale,
  12. bool useRootNavigator: true,
  13. RouteSettings routeSettings,
  14. TextDirection textDirection,
  15. TransitionBuilder builder,
  16. DatePickerMode initialDatePickerMode:,
  17. String errorFormatText,
  18. String errorInvalidText,
  19. String fieldHintText,
  20. String fieldLabelText}

Shows a dialog containing a Material Design date picker.

The returned Future resolves to the date selected by the user when the user confirms the dialog. If the user cancels the dialog, null is returned.

When the date picker is first displayed, it will show the month of initialDate, with initialDate selected.

The firstDate is the earliest allowable date. The lastDate is the latest allowable date. initialDate must either fall between these dates, or be equal to one of them. For each of these DateTime parameters, only their dates are considered. Their time fields are ignored. They must all be non-null.

The currentDate represents the current day (i.e. today). This date will be highlighted in the day grid. If null, the date of will be used.

An optional initialEntryMode argument can be used to display the date picker in the DatePickerEntryMode.calendar (a calendar month grid) or DatePickerEntryMode.input (a text input field) mode. It defaults to DatePickerEntryMode.calendar and must be non-null.

An optional selectableDayPredicate function can be passed in to only allow certain days for selection. If provided, only the days that selectableDayPredicate returns true for will be selectable. For example, this can be used to only allow weekdays for selection. If provided, it must return true for initialDate.

The following optional string parameters allow you to override the default text used for various parts of the dialog:

  • helpText, label displayed at the top of the dialog.
  • cancelText, label on the cancel button.
  • confirmText, label on the ok button.
  • errorFormatText, message used when the input text isn't in a proper date format.
  • errorInvalidText, message used when the input text isn't a selectable date.
  • fieldHintText, text used to prompt the user when no text has been entered in the field.
  • fieldLabelText, label for the date text input field.

An optional locale argument can be used to set the locale for the date picker. It defaults to the ambient locale provided by Localizations.

An optional textDirection argument can be used to set the text direction (TextDirection.ltr or TextDirection.rtl) for the date picker. It defaults to the ambient text direction provided by Directionality. If both locale and textDirection are non-null, textDirection overrides the direction chosen for the locale.

The context, useRootNavigator and routeSettings arguments are passed to showDialog, the documentation for which discusses how it is used. context and useRootNavigator must be non-null.

The builder parameter can be used to wrap the dialog widget to add inherited widgets like Theme.

An optional initialDatePickerMode argument can be used to have the calendar date picker initially appear in the DatePickerMode.year or mode. It defaults to, and must be non-null.

See also:


Future<DateTime> showDatePicker({
  @required BuildContext context,
  @required DateTime initialDate,
  @required DateTime firstDate,
  @required DateTime lastDate,
  DateTime currentDate,
  DatePickerEntryMode initialEntryMode = DatePickerEntryMode.calendar,
  SelectableDayPredicate selectableDayPredicate,
  String helpText,
  String cancelText,
  String confirmText,
  Locale locale,
  bool useRootNavigator = true,
  RouteSettings routeSettings,
  TextDirection textDirection,
  TransitionBuilder builder,
  DatePickerMode initialDatePickerMode =,
  String errorFormatText,
  String errorInvalidText,
  String fieldHintText,
  String fieldLabelText,
}) async {
  assert(context != null);
  assert(initialDate != null);
  assert(firstDate != null);
  assert(lastDate != null);
  initialDate = utils.dateOnly(initialDate);
  firstDate = utils.dateOnly(firstDate);
  lastDate = utils.dateOnly(lastDate);
    'lastDate $lastDate must be on or after firstDate $firstDate.'
    'initialDate $initialDate must be on or after firstDate $firstDate.'
    'initialDate $initialDate must be on or before lastDate $lastDate.'
    selectableDayPredicate == null || selectableDayPredicate(initialDate),
    'Provided initialDate $initialDate must satisfy provided selectableDayPredicate.'
  assert(initialEntryMode != null);
  assert(useRootNavigator != null);
  assert(initialDatePickerMode != null);

  Widget dialog = _DatePickerDialog(
    initialDate: initialDate,
    firstDate: firstDate,
    lastDate: lastDate,
    currentDate: currentDate,
    initialEntryMode: initialEntryMode,
    selectableDayPredicate: selectableDayPredicate,
    helpText: helpText,
    cancelText: cancelText,
    confirmText: confirmText,
    initialCalendarMode: initialDatePickerMode,
    errorFormatText: errorFormatText,
    errorInvalidText: errorInvalidText,
    fieldHintText: fieldHintText,
    fieldLabelText: fieldLabelText,

  if (textDirection != null) {
    dialog = Directionality(
      textDirection: textDirection,
      child: dialog,

  if (locale != null) {
    dialog = Localizations.override(
      context: context,
      locale: locale,
      child: dialog,

  return showDialog<DateTime>(
    context: context,
    useRootNavigator: useRootNavigator,
    routeSettings: routeSettings,
    builder: (BuildContext context) {
      return builder == null ? dialog : builder(context, dialog);