Improve customization and fix divider height

example/pubspec.yaml

@@ -14,7 +14,7 @@ description: flutter_holo_date_picker package exmaple project
 version: 1.0.0
 
 environment:
-  sdk: '>=2.12.0 <3.0.0'
+  sdk: '>=3.4.4 <4.0.0'
 
 dependencies:
   flutter:
@@ -27,7 +27,7 @@ dependencies:
   flutter_holo_date_picker:
     path: ../
 
-  intl: ^0.17.0
+  intl: ^0.19.0
 
 dev_dependencies:
   flutter_test:
@@ -44,34 +44,3 @@ flutter:
   # included with your application, so that you can use the icons in
   # the material Icons class.
   uses-material-design: true
-
-  # To add assets to your application, add an assets section, like this:
-  # assets:
-  #  - images/a_dot_burr.jpeg
-  #  - images/a_dot_ham.jpeg
-
-  # An image asset can refer to one or more resolution-specific "variants", see
-  # https://flutter.dev/assets-and-images/#resolution-aware.
-
-  # For details regarding adding assets from package dependencies, see
-  # https://flutter.dev/assets-and-images/#from-packages
-
-  # To add custom fonts to your application, add a fonts section here,
-  # in this "flutter" section. Each entry in this list should have a
-  # "family" key with the font family name, and a "fonts" key with a
-  # list giving the asset and other descriptors for the font. For
-  # example:
-  # fonts:
-  #   - family: Schyler
-  #     fonts:
-  #       - asset: fonts/Schyler-Regular.ttf
-  #       - asset: fonts/Schyler-Italic.ttf
-  #         style: italic
-  #   - family: Trajan Pro
-  #     fonts:
-  #       - asset: fonts/TrajanPro.ttf
-  #       - asset: fonts/TrajanPro_Bold.ttf
-  #         weight: 700
-  #
-  # For details regarding fonts from package dependencies,
-  # see https://flutter.dev/custom-fonts/#from-packages

lib/date_picker.dart

@@ -1,7 +1,7 @@
 import 'package:flutter/material.dart';
 
-import 'date_picker_theme.dart';
 import 'date_picker_constants.dart';
+import 'date_picker_theme.dart';
 import 'i18n/date_picker_i18n.dart';
 import 'widget/date_picker_widget.dart';
 
@@ -115,28 +115,28 @@ class DatePicker {
     DateTime? lastDate,
     DateTime? initialDate,
     String? dateFormat,
-    DateTimePickerLocale locale: DATETIME_PICKER_LOCALE_DEFAULT,
-    DateTimePickerMode pickerMode: DateTimePickerMode.date,
+    DateTimePickerLocale locale = DATETIME_PICKER_LOCALE_DEFAULT,
+    DateTimePickerMode pickerMode = DateTimePickerMode.date,
     Color? backgroundColor,
     Color? textColor,
     TextStyle? itemTextStyle,
     String? titleText,
     String? confirmText,
     String? cancelText,
-    bool looping: false,
-    bool reverse: false,
+    bool looping = false,
+    bool reverse = false,
   }) {
     DateTime? _selectedDate = initialDate;
     final List<Widget> listButtonActions = [
       TextButton(
-        style: TextButton.styleFrom(primary: textColor),
+        style: TextButton.styleFrom(backgroundColor: textColor),
         child: Text(confirmText ?? "OK"),
         onPressed: () {
           Navigator.pop(context, _selectedDate);
         },
       ),
       TextButton(
-        style: TextButton.styleFrom(primary: textColor),
+        style: TextButton.styleFrom(backgroundColor: textColor),
         child: Text(cancelText ?? "Cancel"),
         onPressed: () {
           Navigator.pop(context);
@@ -157,13 +157,11 @@ class DatePicker {
       initialDate = DateTime.now();
     }
 
-    if (backgroundColor == null)
-      backgroundColor = DateTimePickerTheme.Default.backgroundColor;
+    if (backgroundColor == null) backgroundColor = DateTimePickerTheme.Default.backgroundColor;
 //    if (itemTextStyle == null)
 //      itemTextStyle = DateTimePickerTheme.Default.itemTextStyle;
 
-    if (textColor == null)
-      textColor = DateTimePickerTheme.Default.itemTextStyle.color;
+    if (textColor == null) textColor = DateTimePickerTheme.Default.itemTextStyle.color;
 
     var datePickerDialog = AlertDialog(
       title: Text(
@@ -191,13 +189,9 @@ class DatePicker {
           looping: looping,
         ),
       ),
-      actions:
-          reverse ? listButtonActions.reversed.toList() : listButtonActions,
+      actions: reverse ? listButtonActions.reversed.toList() : listButtonActions,
     );
-    return showDialog(
-        useRootNavigator: false,
-        context: context,
-        builder: (context) => datePickerDialog);
+    return showDialog(useRootNavigator: false, context: context, builder: (context) => datePickerDialog);
   }
 }
 
@@ -246,14 +240,12 @@ class _DatePickerRoute<T> extends PopupRoute<T> {
   @override
   AnimationController createAnimationController() {
     assert(_animationController == null);
-    _animationController =
-        BottomSheet.createAnimationController(navigator!.overlay!);
+    _animationController = BottomSheet.createAnimationController(navigator!.overlay!);
     return _animationController!;
   }
 
   @override
-  Widget buildPage(BuildContext context, Animation<double> animation,
-      Animation<double> secondaryAnimation) {
+  Widget buildPage(BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation) {
     double height = pickerTheme!.pickerHeight;
     if (pickerTheme!.title != null || pickerTheme!.showTitle) {
       height += pickerTheme!.titleHeight;
@@ -276,8 +268,7 @@ class _DatePickerComponent extends StatelessWidget {
   final _DatePickerRoute route;
   final double _pickerHeight;
 
-  _DatePickerComponent({required this.route, required pickerHeight})
-      : this._pickerHeight = pickerHeight;
+  _DatePickerComponent({required this.route, required pickerHeight}) : this._pickerHeight = pickerHeight;
 
   @override
   Widget build(BuildContext context) {
@@ -298,8 +289,7 @@ class _DatePickerComponent extends StatelessWidget {
         builder: (BuildContext context, Widget? child) {
           return ClipRect(
             child: CustomSingleChildLayout(
-              delegate: _BottomPickerLayout(route.animation!.value,
-                  contentHeight: _pickerHeight),
+              delegate: _BottomPickerLayout(route.animation!.value, contentHeight: _pickerHeight),
               child: pickerWidget,
             ),
           );

lib/date_picker_constants.dart

@@ -1,3 +1,5 @@
+import 'package:flutter/material.dart';
+
 /// Selected value of DatePicker.
 typedef DateValueCallback(DateTime dateTime, List<int> selectedIndex);
 
@@ -18,3 +20,13 @@ const String DATETIME_PICKER_TIME_FORMAT = 'HH:mm:ss';
 
 /// Default value of datetime format
 const String DATETIME_PICKER_DATETIME_FORMAT = 'yyyyMMdd HH:mm:ss';
+
+/// Selected value of DatePicker.
+typedef TimeValueCallback(TimeOfDay dateTime, List<int> selectedIndex);
+
+/// Pressed cancel callback.
+typedef TimeVoidCallback();
+
+const String TIME_PICKER_MAX_TIME = "2100-12-31 23:59:59";
+
+const String TIME_PICKER_MIN_TIME = "1900-01-01 00:00:00";

lib/date_picker_theme.dart

@@ -16,13 +16,24 @@ const double DATETIME_PICKER_TITLE_HEIGHT = 36.0;
 const double DATETIME_PICKER_ITEM_HEIGHT = 36.0;
 
 /// Default value of DatePicker's item [TextStyle].
-const TextStyle DATETIME_PICKER_ITEM_TEXT_STYLE =
-    const TextStyle(color: Colors.black, fontSize: 16.0);
+const TextStyle DATETIME_PICKER_ITEM_TEXT_STYLE = const TextStyle(color: Colors.black, fontSize: 16.0);
 
 const Color DATETIME_PICKER_ITEM_TEXT_COLOR = Colors.black;
 const double DATETIME_PICKER_ITEM_TEXT_SIZE_SMALL = 15;
 const double DATETIME_PICKER_ITEM_TEXT_SIZE_BIG = 17;
 
+/// Default value of DatePicker's divider height.
+const double DATETIME_PICKER_DIVIDER_HEIGHT = 1.0;
+
+/// Default value of DatePicker's divider thickness.
+const double DATETIME_PICKER_DIVIDER_THICKNESS = 2.0;
+
+/// Default value of DatePicker's diameter ratio.
+const double DATETIME_PICKER_DIAMETER_RATIO = 1.5;
+
+/// Default value of DatePicker's divider thickness.
+const double DATETIME_PICKER_SQUEEZE = 0.95;
+
 /// To support both stable and beta channels until
 /// 'DiagnosticableMixin' is officially deprecated.
 class DateTimePickerTheme {
@@ -42,18 +53,23 @@ class DateTimePickerTheme {
   /// [itemHeight] The value of DatePicker's column height.
   /// [itemTextStyle] The value of DatePicker's column [TextStyle].
   const DateTimePickerTheme({
-    this.backgroundColor: DATETIME_PICKER_BACKGROUND_COLOR,
+    this.backgroundColor = DATETIME_PICKER_BACKGROUND_COLOR,
     this.cancelTextStyle,
     this.confirmTextStyle,
     this.cancel,
     this.confirm,
     this.title,
-    this.showTitle: DATETIME_PICKER_SHOW_TITLE_DEFAULT,
-    this.pickerHeight: DATETIME_PICKER_HEIGHT,
-    this.titleHeight: DATETIME_PICKER_TITLE_HEIGHT,
-    this.itemHeight: DATETIME_PICKER_ITEM_HEIGHT,
-    this.itemTextStyle: DATETIME_PICKER_ITEM_TEXT_STYLE,
+    this.showTitle = DATETIME_PICKER_SHOW_TITLE_DEFAULT,
+    this.pickerHeight = DATETIME_PICKER_HEIGHT,
+    this.titleHeight = DATETIME_PICKER_TITLE_HEIGHT,
+    this.itemHeight = DATETIME_PICKER_ITEM_HEIGHT,
+    this.itemTextStyle = DATETIME_PICKER_ITEM_TEXT_STYLE,
+    this.dividerHeight = DATETIME_PICKER_DIVIDER_HEIGHT,
+    this.dividerThickness = DATETIME_PICKER_DIVIDER_THICKNESS,
+    this.dividerSpacing,
     this.dividerColor,
+    this.squeeze = DATETIME_PICKER_SQUEEZE,
+    this.diameterRatio = DATETIME_PICKER_DIAMETER_RATIO,
   });
 
   static const DateTimePickerTheme Default = const DateTimePickerTheme();
@@ -93,4 +109,19 @@ class DateTimePickerTheme {
 
   /// The value of DatePicker's Divider Color [TextStyle].
   final Color? dividerColor;
+
+  /// The value of DatePicker's Divider height.
+  final double? dividerHeight;
+
+  /// The value of DatePicker's Divider thickness.
+  final double? dividerThickness;
+
+  /// The value of DatePicker's Divider padding.
+  final double? dividerSpacing;
+
+  /// The value of DatePicker's squeeze.
+  final double? squeeze;
+
+  /// The value of DatePicker's diameter ratio.
+  final double? diameterRatio;
 }

lib/date_time_formatter.dart

@@ -8,8 +8,7 @@ const String DATE_FORMAT_SEPARATOR = r'[|,-\/._: ]+';
 
 class DateTimeFormatter {
   /// Get default value of date format.
-  static String generateDateFormat(
-      String dateFormat, DateTimePickerMode pickerMode) {
+  static String generateDateFormat(String dateFormat, DateTimePickerMode pickerMode) {
     if (dateFormat.length > 0) {
       return dateFormat;
     }
@@ -32,8 +31,7 @@ class DateTimeFormatter {
   }
 
   /// Split date format to array.
-  static List<String> splitDateFormat(String? dateFormat,
-      {DateTimePickerMode? mode}) {
+  static List<String> splitDateFormat(String? dateFormat, {DateTimePickerMode? mode}) {
     if (dateFormat == null || dateFormat.length == 0) {
       return [];
     }
@@ -71,8 +69,7 @@ class DateTimeFormatter {
   }
 
   /// Format datetime string
-  static String formatDateTime(
-      int value, String format, DateTimePickerLocale? locale, weekday) {
+  static String formatDateTime(int value, String format, DateTimePickerLocale? locale, weekday) {
     if (format.length == 0) {
       return value.toString();
     }
@@ -121,7 +118,7 @@ class DateTimeFormatter {
 //    String result = format;
 //    // format year text
 //    if (format.contains('y')) {
-//      result = _formatYear(dateTime.year, result, locale);
+//      result = _formatYear(dateTime.hour, result, locale);
 //    }
 //    // format month text
 //    if (format.contains('M')) {
@@ -141,22 +138,19 @@ class DateTimeFormatter {
 //  }
 
   /// format year text
-  static String _formatYear(
-      int value, String format, DateTimePickerLocale? locale) {
+  static String _formatYear(int value, String format, DateTimePickerLocale? locale) {
     if (format.contains('yyyy')) {
       // yyyy: the digit count of year is 4, e.g. 2019
       return format.replaceAll('yyyy', value.toString());
     } else if (format.contains('yy')) {
       // yy: the digit count of year is 2, e.g. 19
-      return format.replaceAll('yy',
-          value.toString().substring(max(0, value.toString().length - 2)));
+      return format.replaceAll('yy', value.toString().substring(max(0, value.toString().length - 2)));
     }
     return value.toString();
   }
 
   /// format month text
-  static String _formatMonth(
-      int value, String format, DateTimePickerLocale? locale) {
+  static String _formatMonth(int value, String format, DateTimePickerLocale? locale) {
     List<String> months = DatePickerI18n.getLocaleMonths(locale);
     if (format.contains('MMMM')) {
       // MMMM: the full name of month, e.g. January
@@ -170,14 +164,12 @@ class DateTimeFormatter {
   }
 
   /// format day text
-  static String _formatDay(
-      int value, String format, DateTimePickerLocale? locale) {
+  static String _formatDay(int value, String format, DateTimePickerLocale? locale) {
     return _formatNumber(value, format, 'd');
   }
 
   /// format week text
-  static String _formatWeek(
-      int value, String format, DateTimePickerLocale? locale) {
+  static String _formatWeek(int value, String format, DateTimePickerLocale? locale) {
     if (format.contains('EEEE')) {
       // EEEE: the full name of week, e.g. Monday
       List<String> weeks = DatePickerI18n.getLocaleWeeks(locale)!;
@@ -189,20 +181,17 @@ class DateTimeFormatter {
   }
 
   /// format hour text
-  static String _formatHour(
-      int value, String format, DateTimePickerLocale? locale) {
+  static String _formatHour(int value, String format, DateTimePickerLocale? locale) {
     return _formatNumber(value, format, 'H');
   }
 
   /// format minute text
-  static String _formatMinute(
-      int value, String format, DateTimePickerLocale? locale) {
+  static String _formatMinute(int value, String format, DateTimePickerLocale? locale) {
     return _formatNumber(value, format, 'm');
   }
 
   /// format second text
-  static String _formatSecond(
-      int value, String format, DateTimePickerLocale? locale) {
+  static String _formatSecond(int value, String format, DateTimePickerLocale? locale) {
     return _formatNumber(value, format, 's');
   }
 

lib/flutter_holo_date_picker.dart

@@ -1,6 +1,7 @@
 library flutter_holo_date_picker;
 
 export 'date_picker.dart';
-export 'i18n/date_picker_i18n.dart';
 export 'date_picker_theme.dart' show DateTimePickerTheme;
+export 'i18n/date_picker_i18n.dart';
 export 'widget/date_picker_widget.dart';
+export 'widget/time_picker_widget.dart';