DateRangeField constructor

DateRangeField({ Key? key, DateTime? firstDate, DateTime? lastDate, DateTime? currentDate, DatePickerEntryMode? initialEntryMode, String? helpText, String? cancelText, bool enabled = true, String? confirmText, String? saveText, String? errorFormatText, String? errorInvalidText, String? errorInvalidRangeText, String? fieldStartHintText, String? fieldEndHintText, String? fieldStartLabelText, String? fieldEndLabelText, double? width, EdgeInsets? margin, ValueChanged<DateTimeRange<DateTime>?>? onChanged, FormFieldSetter<DateTimeRange<DateTime>>? onSaved, FormFieldValidator<DateTimeRange<DateTime>>? validator, DateTimeRange<DateTime>? initialValue, bool autoValidate = false, DateFormat? dateFormat, InputDecoration decoration = const InputDecoration(), })

Creates a DateRangeField which extends a FormField.

When using without a Form ancestor a GlobalKey is required.

Implementation

DateRangeField(
    {Key? key,
    this.firstDate,
    this.lastDate,
    this.currentDate,
    this.initialEntryMode,
    this.helpText,
    this.cancelText,
    this.enabled = true,
    this.confirmText,
    this.saveText,
    this.errorFormatText,
    this.errorInvalidText,
    this.errorInvalidRangeText,
    this.fieldStartHintText,
    this.fieldEndHintText,
    this.fieldStartLabelText,
    this.fieldEndLabelText,
    this.width,
    this.margin,
    ValueChanged<DateTimeRange?>? onChanged,
    FormFieldSetter<DateTimeRange>? onSaved,
    FormFieldValidator<DateTimeRange>? validator,
    this.initialValue,
    bool autoValidate = false,
    this.dateFormat,
    InputDecoration decoration = const InputDecoration()})
    : super(
          validator: validator,
          onSaved: onSaved,
          enabled: enabled,
          initialValue: initialValue,
          builder: (FormFieldState<DateTimeRange> state) {
            final DateFormat format =
                (dateFormat ?? DateFormat('MM/dd/yyyy'));
            final InputDecoration inputDecoration = decoration
                .copyWith(enabled: enabled)
                .applyDefaults(Theme.of(state.context).inputDecorationTheme);

            /// This is the dialog to select the date range.
            Future<Null> selectDateRange() async {
              DateTimeRange? picked = await showDateRangePicker(
                      context: state.context,
                      initialDateRange: initialValue,
                      firstDate: firstDate ?? DateTime.now(),
                      lastDate: lastDate ?? DateTime(DateTime.now().year + 5),
                      helpText: helpText ?? 'Select Date Range',
                      cancelText: cancelText ?? 'CANCEL',
                      confirmText: confirmText ?? 'OK',
                      saveText: saveText ?? 'SAVE',
                      errorFormatText: errorFormatText ?? 'Invalid format.',
                      errorInvalidText: errorInvalidText ?? 'Out of range.',
                      errorInvalidRangeText:
                          errorInvalidRangeText ?? 'Invalid range.',
                      fieldStartHintText: fieldStartHintText ?? 'Start Date',
                      fieldEndHintText: fieldEndHintText ?? 'End Date',
                      fieldStartLabelText: fieldStartLabelText ?? 'End Date',
                      fieldEndLabelText: fieldEndLabelText ?? 'End Date') ??
                  state.value;
              if (picked != state.value) {
                state.didChange(picked);
                onChanged?.call(picked);
              }
            }

            String hintText = decoration.hintText ?? '';
            return InkWell(
              /// This calls the dialog to select the date range.
              onTap: enabled ? selectDateRange : null,
              child: Container(
                margin: margin ?? EdgeInsets.all(15.0),
                width: width ?? MediaQuery.of(state.context).size.width,
                child: InputDecorator(
                  decoration:
                      inputDecoration.copyWith(errorText: state.errorText),
                  child: Text(
                      // This will display hintText if provided and if state.value is null
                      state.value == null
                          ? hintText
                          :

                          /// This displays the selected date range when the dialog is closed.
                          '${format.format(state.value!.start)} - ${format.format(state.value!.end)}',
                      style: (state.value == null &&
                              hintText != '' &&
                              decoration.hintStyle != null)
                          ? decoration.hintStyle
                          : TextStyle(
                              color: enabled
                                  ? null
                                  : Theme.of(state.context).disabledColor)),
                ),
              ),
            );
          });