Using simpler method of date and time picker dialogs - works with mobile too.

Author: dsyrstad

.flutter-plugins

@@ -0,0 +1,8 @@
+<component name="ProjectRunConfigurationManager">
+  <configuration default="false" name="tests in test" type="FlutterTestConfigType" factoryName="Flutter Test" nameIsGenerated="true">
+    <option name="testDir" value="$PROJECT_DIR$/test" />
+    <option name="useRegexp" value="false" />
+    <option name="additionalArgs" value="" />
+    <method v="2" />
+  </configuration>
+</component>

.flutter-plugins-dependencies

@@ -0,0 +1,8 @@
+<component name="ProjectRunConfigurationManager">
+  <configuration default="false" name="tests in vsc_datetime_field_test.dart - Update Goldens" type="FlutterTestConfigType" factoryName="Flutter Test">
+    <option name="testFile" value="$PROJECT_DIR$/test/vsc_datetime_field_test.dart" />
+    <option name="useRegexp" value="false" />
+    <option name="additionalArgs" value="--update-goldens" />
+    <method v="2" />
+  </configuration>
+</component>

.run/tests in test.run.xml

@@ -0,0 +1,8 @@
+<component name="ProjectRunConfigurationManager">
+  <configuration default="false" name="tests in vsc_datetime_field_test.dart" type="FlutterTestConfigType" factoryName="Flutter Test" nameIsGenerated="true">
+    <option name="testFile" value="$PROJECT_DIR$/test/vsc_datetime_field_test.dart" />
+    <option name="useRegexp" value="false" />
+    <option name="additionalArgs" value="" />
+    <method v="2" />
+  </configuration>
+</component>

.run/tests in vsc_datetime_field_test.dart - Update Goldens.run.xml

@@ -62,54 +62,6 @@ packages:
     description: flutter
     source: sdk
     version: "0.0.0"
-  flutter_keyboard_visibility:
-    dependency: transitive
-    description:
-      name: flutter_keyboard_visibility
-      sha256: "86b71bbaffa38e885f5c21b1182408b9be6951fd125432cf6652c636254cef2d"
-      url: "https://pub.dev"
-    source: hosted
-    version: "5.4.0"
-  flutter_keyboard_visibility_linux:
-    dependency: transitive
-    description:
-      name: flutter_keyboard_visibility_linux
-      sha256: "6fba7cd9bb033b6ddd8c2beb4c99ad02d728f1e6e6d9b9446667398b2ac39f08"
-      url: "https://pub.dev"
-    source: hosted
-    version: "1.0.0"
-  flutter_keyboard_visibility_macos:
-    dependency: transitive
-    description:
-      name: flutter_keyboard_visibility_macos
-      sha256: c5c49b16fff453dfdafdc16f26bdd8fb8d55812a1d50b0ce25fc8d9f2e53d086
-      url: "https://pub.dev"
-    source: hosted
-    version: "1.0.0"
-  flutter_keyboard_visibility_platform_interface:
-    dependency: transitive
-    description:
-      name: flutter_keyboard_visibility_platform_interface
-      sha256: e43a89845873f7be10cb3884345ceb9aebf00a659f479d1c8f4293fcb37022a4
-      url: "https://pub.dev"
-    source: hosted
-    version: "2.0.0"
-  flutter_keyboard_visibility_web:
-    dependency: transitive
-    description:
-      name: flutter_keyboard_visibility_web
-      sha256: d3771a2e752880c79203f8d80658401d0c998e4183edca05a149f5098ce6e3d1
-      url: "https://pub.dev"
-    source: hosted
-    version: "2.0.0"
-  flutter_keyboard_visibility_windows:
-    dependency: transitive
-    description:
-      name: flutter_keyboard_visibility_windows
-      sha256: fc4b0f0b6be9b93ae527f3d527fb56ee2d918cd88bbca438c478af7bcfd0ef73
-      url: "https://pub.dev"
-    source: hosted
-    version: "1.0.0"
   flutter_lints:
     dependency: "direct dev"
     description:
@@ -123,11 +75,6 @@ packages:
     description: flutter
     source: sdk
     version: "0.0.0"
-  flutter_web_plugins:
-    dependency: transitive
-    description: flutter
-    source: sdk
-    version: "0.0.0"
   intl:
     dependency: transitive
     description:
@@ -184,14 +131,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "1.8.2"
-  plugin_platform_interface:
-    dependency: transitive
-    description:
-      name: plugin_platform_interface
-      sha256: dbf0f707c78beedc9200146ad3cb0ab4d5da13c246336987be6940f026500d3a
-      url: "https://pub.dev"
-    source: hosted
-    version: "2.1.3"
   sky_engine:
     dependency: transitive
     description: flutter
@@ -262,4 +201,4 @@ packages:
     version: "0.0.1"
 sdks:
   dart: ">=2.18.0 <3.0.0"
-  flutter: ">=1.20.0"
+  flutter: ">=1.17.0"

.run/tests in vsc_datetime_field_test.dart.run.xml

@@ -1,24 +1,10 @@
 import 'dart:async';
-import 'dart:io';
 
-import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
-import 'package:flutter_keyboard_visibility/flutter_keyboard_visibility.dart';
 import 'package:intl/intl.dart' hide TextDirection;
 import 'package:vsc_datetime_field/datetime_parser.dart';
 
-final _kbdSupportedPlatform = (kIsWeb || Platform.isAndroid || Platform.isIOS);
-
-// Unfortunately stolen from flutter/lib/src/material/calendar_date_picker.dart
-const double _dayPickerRowHeight = 42.0;
-const int _maxDayPickerRowCount = 6; // A 31 day month that starts on Saturday.
-// One extra row for the day-of-week header.
-const double _maxDayPickerHeight =
-    _dayPickerRowHeight * (_maxDayPickerRowCount + 1);
-// Value is from flutter/lib/src/material/date_picker.dart:
-const _pickerWidth = 330.0;
-
 final _yearSuffixRegexp = RegExp(r'[-/]y+');
 
 const _timePatterns24h = [
@@ -41,16 +27,6 @@ const _timePatternsAmPm = [
 
 enum VscDatetimeFieldType { date, datetime, time }
 
-/*
- * TODO
- *  - Sometimes there's just not enough room with the kbd open on mobile. Don't show any picker in this case.
- *    But if the mobile kbd closes, recalculate available size
- *  - Sometimes on mobile the screen doesn't scroll with the kbd up, even though the example has a scroll widget,
- *    it doesn't have enough height to perform scrolling.
- *  - Maybe on mobile if there is not enough height, don't show the picker but if the calendar icon is tapped,
- *    show the dialog instead.
- */
-
 class VscDatetimeField extends StatefulWidget {
   /// Type of field desired.
   final VscDatetimeFieldType type;
@@ -245,11 +221,6 @@ class VscDatetimeFieldState extends State<VscDatetimeField> {
       widget.textFieldConfiguration.focusNode ?? _focusNode;
   late VoidCallback _focusNodeListener;
 
-  // Keyboard detection
-  final Stream<bool>? _keyboardVisibility =
-      (_kbdSupportedPlatform) ? KeyboardVisibilityController().onChange : null;
-  late StreamSubscription<bool>? _keyboardVisibilitySubscription;
-
   final _textFieldGlobalKey = GlobalKey();
 
   DateTime? _value;
@@ -278,7 +249,6 @@ class VscDatetimeFieldState extends State<VscDatetimeField> {
 
   @override
   void dispose() {
-    _keyboardVisibilitySubscription?.cancel();
     _effectiveFocusNode.removeListener(_focusNodeListener);
     _focusNode.dispose();
     _textEditingController.dispose();
@@ -364,18 +334,11 @@ class VscDatetimeFieldState extends State<VscDatetimeField> {
   Future<void> _openPicker() async {
     switch (widget.type) {
       case VscDatetimeFieldType.date:
-      case VscDatetimeFieldType.datetime:
-        final selected = await showDatePicker(
-          context: context,
-          initialDate: _value ?? DateTime.now(),
-          firstDate: widget.minValue,
-          lastDate: widget.maxValue,
-        );
-
+        final selected = await _showCustomizedDatePicker();
         _effectiveFocusNode.requestFocus();
 
         if (selected != null) {
-          // Modify the field's DateTime, sans the time component.
+          // Modify the field's DateTime date component.
           final currValue = _value ?? testableNow();
           _setValue(
             DateTime(
@@ -391,30 +354,39 @@ class VscDatetimeFieldState extends State<VscDatetimeField> {
             setTextAndMoveCursorToEnd: true,
           );
         }
-
         break;
+      case VscDatetimeFieldType.datetime:
+        final selectedDate = await _showCustomizedDatePicker();
+        if (selectedDate == null) break;
 
-      case VscDatetimeFieldType.time:
-        final selected = await showTimePicker(
-          context: context,
-          initialTime: TimeOfDay.now(),
-          // TODO
-          // initialDate: _value ?? DateTime.now(),
-          // firstDate: widget.minValue,
-          // lastDate: widget.maxValue,
-          builder: (context, Widget? child) {
-            return MediaQuery(
-              data:
-                  MediaQuery.of(context).copyWith(alwaysUse24HourFormat: false),
-              child: child!,
-            );
-          },
+        var selectedTime = await _showCustomizedTimePicker();
+        _effectiveFocusNode.requestFocus();
+
+        selectedTime ??= _value == null
+            ? const TimeOfDay(hour: 0, minute: 0)
+            : TimeOfDay.fromDateTime(_value!);
+
+        _setValue(
+          DateTime(
+            selectedDate.year,
+            selectedDate.month,
+            selectedDate.day,
+            selectedTime.hour,
+            selectedTime.minute,
+            0,
+            0,
+            0,
+          ),
+          setTextAndMoveCursorToEnd: true,
         );
+        break;
 
+      case VscDatetimeFieldType.time:
+        final selected = await _showCustomizedTimePicker();
         _effectiveFocusNode.requestFocus();
 
         if (selected != null) {
-          // Modify the field's DateTime, sans the date component.
+          // Modify the field's DateTime time component.
           final currValue = _value ?? testableNow();
           _setValue(
             DateTime(
@@ -434,6 +406,32 @@ class VscDatetimeFieldState extends State<VscDatetimeField> {
     }
   }
 
+  Future<TimeOfDay?> _showCustomizedTimePicker() async {
+    final selected = await showTimePicker(
+      context: context,
+      initialTime: _value == null
+          ? const TimeOfDay(hour: 0, minute: 0)
+          : TimeOfDay.fromDateTime(_value!),
+      builder: (context, Widget? child) {
+        return MediaQuery(
+          data: MediaQuery.of(context).copyWith(alwaysUse24HourFormat: false),
+          child: child!,
+        );
+      },
+    );
+    return selected;
+  }
+
+  Future<DateTime?> _showCustomizedDatePicker() async {
+    final selected = await showDatePicker(
+      context: context,
+      initialDate: _value ?? testableNow(),
+      firstDate: widget.minValue,
+      lastDate: widget.maxValue,
+    );
+    return selected;
+  }
+
   void _setValue(
     DateTime? newValue, {
     bool setText = false,

example/pubspec.lock

@@ -11,7 +11,6 @@ dependencies:
   flutter:
     sdk: flutter
 
-  flutter_keyboard_visibility: ^5.2.0
   intl: ^0.18.0
 
 dev_dependencies: