Added an option for developers to use either the standard Material Da…

…tePicker or a custom datepicker.
muammerakilli · Jun 2, 2024 · aa2f45c · aa2f45c
1 parent 43f8d02
commit aa2f45c
Show file tree

Hide file tree

Showing 5 changed files with 49 additions and 16 deletions.
diff --git a/example/lib/main.dart b/example/lib/main.dart
@@ -181,6 +181,17 @@ class _PlutoGridExamplePageState extends State<PlutoGridExamplePage> {
             print(event);
           },
           configuration: const PlutoGridConfiguration(),
+          selectDateCallback: (PlutoCell cell, PlutoColumn column) async {
+            return showDatePicker(
+                context: context,
+                initialDate: PlutoDateTimeHelper.parseOrNullWithFormat(
+                  cell.value,
+                  column.type.date.format,
+                ) ?? DateTime.now(),
+                firstDate: column.type.date.startDate ?? DateTime(0),
+                lastDate: column.type.date.endDate ?? DateTime(9999)
+            );
+          }
         ),
       ),
     );

diff --git a/lib/src/manager/pluto_grid_state_manager.dart b/lib/src/manager/pluto_grid_state_manager.dart
@@ -84,6 +84,7 @@ class PlutoGridStateChangeNotifier extends PlutoChangeNotifier
     this.onRowsMoved,
     this.onColumnsMoved,
     this.rowColorCallback,
+    this.selectDateCallback,
     this.createHeader,
     this.createFooter,
     PlutoColumnMenuDelegate? columnMenuDelegate,
@@ -159,6 +160,9 @@ class PlutoGridStateChangeNotifier extends PlutoChangeNotifier
   @override
   final CreateFooterCallBack? createFooter;
 
+  @override
+  final PlutoSelectDateCallBack? selectDateCallback;
+
   @override
   final PlutoColumnMenuDelegate columnMenuDelegate;
 
@@ -236,6 +240,7 @@ class PlutoGridStateManager extends PlutoGridStateChangeNotifier {
     super.onRowsMoved,
     super.onColumnsMoved,
     super.rowColorCallback,
+    super.selectDateCallback,
     super.createHeader,
     super.createFooter,
     super.columnMenuDelegate,

diff --git a/lib/src/manager/state/grid_state.dart b/lib/src/manager/state/grid_state.dart
@@ -38,6 +38,8 @@ abstract class IGridState {
 
   CreateFooterCallBack? get createFooter;
 
+  PlutoSelectDateCallBack? get selectDateCallback;
+
   PlutoGridLocaleText get localeText;
 
   PlutoGridStyleConfig get style;

diff --git a/lib/src/pluto_grid.dart b/lib/src/pluto_grid.dart
@@ -51,6 +51,9 @@ typedef CreateFooterCallBack = Widget Function(
 typedef PlutoRowColorCallback = Color Function(
     PlutoRowColorContext rowColorContext);
 
+typedef PlutoSelectDateCallBack = Future<DateTime?> Function(
+    PlutoCell dateCell, PlutoColumn column);
+
 /// [PlutoGrid] is a widget that receives columns and rows and is expressed as a grid-type UI.
 ///
 /// [PlutoGrid] supports movement and editing with the keyboard,
@@ -80,6 +83,7 @@ class PlutoGrid extends PlutoStatefulWidget {
     this.createFooter,
     this.noRowsWidget,
     this.rowColorCallback,
+    this.selectDateCallback,
     this.columnMenuDelegate,
     this.configuration = const PlutoGridConfiguration(),
     this.notifierFilterResolver,
@@ -309,6 +313,8 @@ class PlutoGrid extends PlutoStatefulWidget {
   /// {@endtemplate}
   final PlutoRowColorCallback? rowColorCallback;
 
+  final PlutoSelectDateCallBack? selectDateCallback;
+
   /// {@template pluto_grid_property_columnMenuDelegate}
   /// Column menu can be customized.
   ///
@@ -535,6 +541,7 @@ class PlutoGridState extends PlutoStateWithChange<PlutoGrid> {
       onRowsMoved: widget.onRowsMoved,
       onColumnsMoved: widget.onColumnsMoved,
       rowColorCallback: widget.rowColorCallback,
+      selectDateCallback: widget.selectDateCallback,
       createHeader: widget.createHeader,
       createFooter: widget.createFooter,
       columnMenuDelegate: widget.columnMenuDelegate,

diff --git a/lib/src/ui/cells/pluto_date_cell.dart b/lib/src/ui/cells/pluto_date_cell.dart
@@ -42,26 +42,34 @@ class PlutoDateCellState extends State<PlutoDateCell>
   IconData? get icon => widget.column.type.date.popupIcon;
 
   @override
-  void openPopup() {
+  void openPopup() async {
     if (widget.column.checkReadOnly(widget.row, widget.cell)) {
       return;
     }
 
+    if (widget.stateManager.selectDateCallback != null) {
+      final sm = widget.stateManager;
+      final date = await sm.selectDateCallback!(widget.cell, widget.column);
+      isOpenedPopup = false;
+      if (date != null) {
+        handleSelected(widget.column.type.date.dateFormat.format(date)); // Consider call onSelected
+      }
+    } else {
+      PlutoGridDatePicker(
+        context: context,
+        initDate: PlutoDateTimeHelper.parseOrNullWithFormat(
+          widget.cell.value,
+          widget.column.type.date.format,
+        ),
+        startDate: widget.column.type.date.startDate,
+        endDate: widget.column.type.date.endDate,
+        dateFormat: widget.column.type.date.dateFormat,
+        headerDateFormat: widget.column.type.date.headerDateFormat,
+        onSelected: onSelected,
+        itemHeight: widget.stateManager.rowTotalHeight,
+        configuration: widget.stateManager.configuration,
+      );
+    }
     isOpenedPopup = true;
-
-    PlutoGridDatePicker(
-      context: context,
-      initDate: PlutoDateTimeHelper.parseOrNullWithFormat(
-        widget.cell.value,
-        widget.column.type.date.format,
-      ),
-      startDate: widget.column.type.date.startDate,
-      endDate: widget.column.type.date.endDate,
-      dateFormat: widget.column.type.date.dateFormat,
-      headerDateFormat: widget.column.type.date.headerDateFormat,
-      onSelected: onSelected,
-      itemHeight: widget.stateManager.rowTotalHeight,
-      configuration: widget.stateManager.configuration,
-    );
   }
 }