Merge pull request #419 from SimformSolutionsPvtLtd/feature/time_clickable_function

feat: Fixes issue #383: ✨ Add action on tap of timestamp in day & week view

Author: PRBaraiya

CHANGELOG.md

@@ -9,6 +9,8 @@
 - Adds additional configurations for `CalendarPageHeader`, `MonthPageHeader`, `DayPageHeader` and `WeekPageHeader`.
     - Added `titleBuilder` to build custom title for header.
 - Fixes issue calendar scroll physics for day & week view. [#417](https://github.com/SimformSolutionsPvtLtd/flutter_calendar_view/issues/417)
+- Adds `onTimestampTap` callback in `WeekView`
+  and `DayView`.  [#383](https://github.com/SimformSolutionsPvtLtd/flutter_calendar_view/issues/383)
 - `Deprecations`:
     - deprecated `backgroundColor` and `iconColor` from `CalendarPageHeader`, `DayPageHeader`, `MonthPageHeader` and `WeekPageHeader`.
         - **Solution:** use `headerStyle` instead.

example/lib/widgets/day_view_widget.dart

@@ -26,6 +26,12 @@ class DayViewWidget extends StatelessWidget {
       hourIndicatorSettings: HourIndicatorSettings(
         color: Theme.of(context).dividerColor,
       ),
+      onTimestampTap: (date) {
+        SnackBar snackBar = SnackBar(
+          content: Text("On tap: ${date.hour} Hr : ${date.minute} Min"),
+        );
+        ScaffoldMessenger.of(context).showSnackBar(snackBar);
+      },
       onEventTap: (events, date) {
         Navigator.of(context).push(
           MaterialPageRoute(

example/lib/widgets/week_view_widget.dart

@@ -21,6 +21,12 @@ class WeekViewWidget extends StatelessWidget {
         color: Colors.redAccent,
         showTime: true,
       ),
+      onTimestampTap: (date) {
+        SnackBar snackBar = SnackBar(
+          content: Text("On tap: ${date.hour} Hr : ${date.minute} Min"),
+        );
+        ScaffoldMessenger.of(context).showSnackBar(snackBar);
+      },
       onEventTap: (events, date) {
         Navigator.of(context).push(
           MaterialPageRoute(

lib/src/components/_internal_components.dart

@@ -147,6 +147,9 @@ class TimeLine extends StatefulWidget {
   /// This will display time string in timeline.
   final DateWidgetBuilder timeLineBuilder;
 
+  /// This method will be called when user taps on timestamp in timeline.
+  final TimestampCallback? onTimestampTap;
+
   /// Flag to display half hours.
   final bool showHalfHours;
 
@@ -175,6 +178,7 @@ class TimeLine extends StatefulWidget {
     required this.height,
     required this.timeLineOffset,
     required this.timeLineBuilder,
+    required this.onTimestampTap,
     this.startHour = 0,
     this.showHalfHours = false,
     this.showQuarterHours = false,
@@ -287,6 +291,14 @@ class _TimeLineState extends State<TimeLine> {
     required int hour,
     int minutes = 0,
   }) {
+    final dateTime = DateTime(
+      TimeLine._date.year,
+      TimeLine._date.month,
+      TimeLine._date.day,
+      hour,
+      minutes,
+    );
+
     return Visibility(
       visible: !((_currentTime.minute >= 45 && _currentTime.hour == hour - 1) ||
               (_currentTime.minute <= 15 && _currentTime.hour == hour)) ||
@@ -300,14 +312,13 @@ class _TimeLineState extends State<TimeLine> {
         child: Container(
           height: widget.hourHeight,
           width: widget.timeLineWidth,
-          child: widget.timeLineBuilder.call(
-            DateTime(
-              TimeLine._date.year,
-              TimeLine._date.month,
-              TimeLine._date.day,
-              hour,
-              minutes,
-            ),
+          child: InkWell(
+            onTap: () {
+              if (widget.onTimestampTap != null) {
+                widget.onTimestampTap!(dateTime);
+              }
+            },
+            child: widget.timeLineBuilder.call(dateTime),
           ),
         ),
       ),

lib/src/day_view/_internal_day_view_page.dart

@@ -136,6 +136,8 @@ class InternalDayViewPage<T extends Object?> extends StatefulWidget {
   /// Use this field to disable the calendar scrolling
   final ScrollPhysics? scrollPhysics;
 
+  final TimestampCallback? onTimestampTap;
+
   /// Defines a single day page.
   const InternalDayViewPage({
     Key? key,
@@ -176,6 +178,7 @@ class InternalDayViewPage<T extends Object?> extends StatefulWidget {
     required this.quarterHourIndicatorSettings,
     required this.emulateVerticalOffsetBy,
     required this.onTileDoubleTap,
+    required this.onTimestampTap,
     this.keepScrollOffset = false,
   }) : super(key: key);
 
@@ -330,6 +333,7 @@ class _InternalDayViewPageState<T extends Object?>
                       key: ValueKey(widget.heightPerMinute),
                       liveTimeIndicatorSettings:
                           widget.liveTimeIndicatorSettings,
+                      onTimestampTap: widget.onTimestampTap,
                     ),
                     if (widget.showLiveLine &&
                         widget.liveTimeIndicatorSettings.height > 0)

lib/src/day_view/day_view.dart

@@ -158,6 +158,9 @@ class DayView<T extends Object?> extends StatefulWidget {
   /// initial offset.
   final double? scrollOffset;
 
+  /// This method will be called when user taps on timestamp in timeline.
+  final TimestampCallback? onTimestampTap;
+
   /// This method will be called when user taps on event tile.
   final CellTapCallback<T>? onEventTap;
 
@@ -273,6 +276,7 @@ class DayView<T extends Object?> extends StatefulWidget {
     this.onEventDoubleTap,
     this.endHour = Constants.hoursADay,
     this.keepScrollOffset = false,
+    this.onTimestampTap,
   })  : assert(!(onHeaderTitleTap != null && dayTitleBuilder != null),
             "can't use [onHeaderTitleTap] & [dayTitleBuilder] simultaneously"),
         assert(timeLineOffset >= 0,
@@ -467,6 +471,7 @@ class DayViewState<T extends Object?> extends State<DayView<T>> {
                             hourIndicatorSettings: _hourIndicatorSettings,
                             hourLinePainter: _hourLinePainter,
                             date: date,
+                            onTimestampTap: widget.onTimestampTap,
                             onTileTap: widget.onEventTap,
                             onTileLongTap: widget.onEventLongTap,
                             onDateLongPress: widget.onDateLongPress,

lib/src/typedefs.dart

@@ -70,6 +70,8 @@ typedef DatePressCallback = void Function(DateTime date);
 
 typedef DateTapCallback = void Function(DateTime date);
 
+typedef TimestampCallback = void Function(DateTime date);
+
 typedef EventFilter<T extends Object?> = List<CalendarEventData<T>> Function(
     DateTime date, List<CalendarEventData<T>> events);
 

lib/src/week_view/_internal_week_view_page.dart

@@ -163,6 +163,9 @@ class InternalWeekViewPage<T extends Object?> extends StatefulWidget {
   /// Use this field to disable the calendar scrolling
   final ScrollPhysics? scrollPhysics;
 
+  /// This method will be called when user taps on timestamp in timeline.
+  final TimestampCallback? onTimestampTap;
+
   /// A single page for week view.
   const InternalWeekViewPage({
     Key? key,
@@ -205,6 +208,7 @@ class InternalWeekViewPage<T extends Object?> extends StatefulWidget {
     required this.emulateVerticalOffsetBy,
     required this.onTileDoubleTap,
     required this.endHour,
+    required this.onTimestampTap,
     this.fullDayHeaderTitle = '',
     required this.fullDayHeaderTextConfig,
     required this.scrollPhysics,
@@ -475,6 +479,7 @@ class _InternalWeekViewPageState<T extends Object?>
                       liveTimeIndicatorSettings:
                           widget.liveTimeIndicatorSettings,
                       endHour: widget.endHour,
+                      onTimestampTap: widget.onTimestampTap,
                     ),
                     if (widget.showLiveLine &&
                         widget.liveTimeIndicatorSettings.height > 0)

lib/src/week_view/week_view.dart

@@ -149,6 +149,9 @@ class WeekView<T extends Object?> extends StatefulWidget {
   /// Scroll offset of week view page.
   final double scrollOffset;
 
+  /// This method will be called when user taps on timestamp in timeline.
+  final TimestampCallback? onTimestampTap;
+
   /// Called when user taps on event tile.
   final CellTapCallback<T>? onEventTap;
 
@@ -306,6 +309,7 @@ class WeekView<T extends Object?> extends StatefulWidget {
     this.fullDayHeaderTitle = '',
     this.fullDayHeaderTextConfig,
     this.keepScrollOffset = false,
+    this.onTimestampTap,
   })  : assert(!(onHeaderTitleTap != null && weekPageHeaderBuilder != null),
             "can't use [onHeaderTitleTap] & [weekPageHeaderBuilder] simultaneously"),
         assert((timeLineOffset) >= 0,
@@ -527,6 +531,7 @@ class WeekViewState<T extends Object?> extends State<WeekView<T>> {
                             liveTimeIndicatorSettings:
                                 _liveTimeIndicatorSettings,
                             timeLineBuilder: _timeLineBuilder,
+                            onTimestampTap: widget.onTimestampTap,
                             onTileTap: widget.onEventTap,
                             onTileLongTap: widget.onEventLongTap,
                             onDateLongPress: widget.onDateLongPress,