Flutter_form_builder: [FormBuilderDateRangePicker 3.13.3] onChange and Cancel issues.

Created on 25 Aug 2020  ·  8Comments  ·  Source: danvick/flutter_form_builder

Hi,

I am having quite a few challenges getting this widget to work as I would expect it to.
If I use exactly the code in your example section ie.

FormBuilderDateRangePicker(
                    attribute: 'date_range',
                    firstDate: DateTime(1970),
                    lastDate: DateTime.now(),
                    initialValue: [
                      DateTime.now().subtract(Duration(days: 30)),
                      DateTime.now().subtract(Duration(seconds: 10))
                    ],
                    format: DateFormat('yyyy-MM-dd'),
                    onChanged: _onChanged,
                    decoration: const InputDecoration(
                      labelText: 'Date Range',
                      helperText: 'Helper text',
                      hintText: 'Hint text',
                    ),
                  ),

The issues I experience are:

  1. When tapping on the widget to open it, the onChange method fires twice, before any dates are tapped on in the picker. This is not the behaviour I would expect as nothing has changed and it makes the onChange method execute code that should only be executing after a change.
  2. When the picker is opened and before any changes are made, if I select Cancel button, the picker closes and the widget then has no values shown. I would expect the original values to be displayed, because nothing has changed.
  3. After issue 2, if I then tap on the widget to try and correct the values, the app crashes with 'Exception has occurred.
    _AssertionError ('package:date_range_picker/date_range_picker.dart': Failed assertion: line 1280 pos 10: '!initialLastDate.isAfter(lastDate)': initialDate must be on or before lastDate)'.

Also, when I use the widget in my app with the configuration I need, I am getting this error when onChange runs after changes have been made in the picker but before control is passed back to my app:

Exception has occurred.
NoSuchMethodError (NoSuchMethodError: The method 'didChange' was called on null.
Receiver: null
Tried calling: didChange(Instance(length:2) of '_GrowableList'))

that is occurring in dart-core object_path.dart and is triggered from line 264 - _fieldKey.currentState.didChange(picked);

in C:\flutter.pub-cache\hosted\pub.dartlang.org\flutter_form_builder-3.13.3\lib\src\fields\form_builder_date_range_picker.dart

These issues make the date range picker pretty much unusable at this point so I hope you can address them as the widget package is pretty useful overall.

My flutter doctor output is:

flutter doctor -v
[√] Flutter (Channel stable, 1.20.2, on Microsoft Windows [Version 10.0.20197.1000], locale en-ZA)
    • Flutter version 1.20.2 at C:\flutter
    • Framework revision bbfbf1770c (12 days ago), 2020-08-13 08:33:09 -0700
    • Engine revision 9d5b21729f
    • Dart version 2.9.1


[√] Android toolchain - develop for Android devices (Android SDK version 29.0.0)
    • Android SDK at D:\Android\Sdk
    • Platform android-29, build-tools 29.0.0
    • ANDROID_HOME = D:\Android\Sdk
    • Java binary at: C:\Program Files\Android\Android Studio1\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b03)
    • All Android licenses accepted.

[√] Android Studio (version 3.5)
    • Android Studio at C:\Program Files\Android\Android Studio1
    • Flutter plugin version 43.0.1
    • Dart plugin version 191.8593
    • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b03)

[√] VS Code (version 1.48.1)
    • VS Code at C:\Users\dicki\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.13.2

[√] Connected device (1 available)
    • AOSP on IA Emulator (mobile) • emulator-5554 • android-x86 • Android 9 (API 28) (emulator)

• No issues found!
bug

All 8 comments

Hi @GrahamDi,
Thanks for bringing this to our attention, we'll have this fixed ASAP.

@danvick Hi, Has there been any progress made on this?

Done but not yet published. Had other improvements to be done before publishing v3.13.5.

Planning to publish v3.13.5 today. Will let you know when I do.

@danvick
I now get the following build error with 3.13.3 and 3.13.5:

/C:/flutter/.pub-cache/hosted/pub.dartlang.org/flutter_form_builder-3.14.0-alpha.1/lib/src/fields/form_builder_range_slider.dart:115:53: Error: The argument type 'String Function(double)' can't be assigned to the parameter type 'String Function(RangeValues)'.

Have you seen this and any ideas what may be causing it? Why would it be picking up flutter_form_builder-3.14.0-alpha, which must be the new version that you are working on?
Fixed it by specifying flutter_form_builder: 3.13.5 instead of flutter_form_builder: ^3.13.5 but probably shouldn't be happening.

flutter doctor -v
[√] Flutter (Channel stable, 1.20.3, on Microsoft Windows [Version 10.0.20206.1000], locale en-ZA)
• Flutter version 1.20.3 at C:\flutter
• Framework revision 216dee60c0 (8 days ago), 2020-09-01 12:24:47 -0700
• Engine revision d1bc06f032
• Dart version 2.9.2

[√] Android toolchain - develop for Android devices (Android SDK version 29.0.0)
• Android SDK at D:\Android\Sdk
• Platform android-30, build-tools 29.0.0
• ANDROID_HOME = D:\Android\Sdk
• Java binary at: C:\Program Files\Android\Android Studio1\jre\bin\java
• Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b03)
• All Android licenses accepted.

[√] Android Studio (version 3.5)
• Android Studio at C:\Program Files\Android\Android Studio1
• Flutter plugin version 43.0.1
• Dart plugin version 191.8593
• Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b03)

[√] VS Code (version 1.48.2)
• VS Code at C:\Users\dicki\AppData\Local\Programs\Microsoft VS Code
• Flutter extension version 3.14.1

[√] Connected device (1 available)
• AOSP on IA Emulator (mobile) • emulator-5554 • android-x86 • Android 9 (API 28) (emulator)

• No issues found!

@danvick
Me again, sorry to be a pain :-(

The FormBuilderDateRangePicker is working much better now, thank you. However, there is still a small bug with it I think.

Steps to Reproduce:
Open the picker and select a single date (tap on same date twice) and tap OK
=> value returned is a list with two members eg. Range onChanged ran. value: [2020-09-09 00:00:00.000, 2020-09-09 00:00:00.000] - all good
Open the picker and select a range of dates (tap start date and then tap end date) and tap OK
=> value returned is a list with two members eg. Range onChanged ran. value: [2020-09-09 00:00:00.000, 2020-09-11 00:00:00.000] - all good
Open the picker and select a range of dates as above, then change your mind and select a single date with one tap, and then tap OK
=> value returned is a list with ONE member eg. Range onChanged ran. value: [2020-09-11 00:00:00.000] - problem as this throws RangeError (index): Invalid value: Only valid value is 0: 1 in dart:core-patch/growable_array.dart
Open the picker and select a single date (just one tap) and then tap OK
=> value returned is a list with ONE member eg. Range onChanged ran. value: [2020-09-11 00:00:00.000] - problem as this throws RangeError (index): Invalid value: Only valid value is 0: 1 in dart:core-patch/growable_array.dart - the picker should not allow you to only tap on one date then select OK, or it should default both start and end dates to the single date the user clicked on (this is probably the better option as it saves the user two clicks).

Thanks for the keen eye, @GrahamDi.

I see how this could be a problem. The problem however comes from the underlying dependency.

Working on a hack to fix this.

@danvick Thanks man. I thought it might be due to the underlying dependencies. Hopefully, you can provide a hack or at least prevent the crash that the range problem causes. Unfortunately, it is not that obvious to the average user that only one date has been selected.

Was this page helpful?
0 / 5 - 0 ratings