feat: Fixes issue #382: Add Multi-Day View Support

example/lib/pages/mobile/mobile_home_page.dart

@@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
 import '../../extension.dart';
 import '../day_view_page.dart';
 import '../month_view_page.dart';
+import '../multi_day_view_page.dart';
 import '../week_view_page.dart';
 
 class MobileHomePage extends StatelessWidget {
@@ -35,6 +36,13 @@ class MobileHomePage extends StatelessWidget {
               onPressed: () => context.pushRoute(WeekViewDemo()),
               child: Text("Week View"),
             ),
+            SizedBox(
+              height: 20,
+            ),
+            ElevatedButton(
+              onPressed: () => context.pushRoute(MultiDayViewDemo()),
+              child: Text("Multi-Day View"),
+            ),
           ],
         ),
       ),

example/lib/pages/multi_day_view_page.dart

@@ -0,0 +1,34 @@
+import 'package:flutter/material.dart';
+
+import '../enumerations.dart';
+import '../extension.dart';
+import '../widgets/responsive_widget.dart';
+import '../widgets/multi_day_view_widget.dart';
+import 'create_event_page.dart';
+import 'web/web_home_page.dart';
+
+class MultiDayViewDemo extends StatefulWidget {
+  const MultiDayViewDemo({super.key});
+
+  @override
+  _MultiDayViewDemoState createState() => _MultiDayViewDemoState();
+}
+
+class _MultiDayViewDemoState extends State<MultiDayViewDemo> {
+  @override
+  Widget build(BuildContext context) {
+    return ResponsiveWidget(
+      webWidget: WebHomePage(
+        selectedView: CalendarView.week,
+      ),
+      mobileWidget: Scaffold(
+        floatingActionButton: FloatingActionButton(
+          child: Icon(Icons.add),
+          elevation: 8,
+          onPressed: () => context.pushRoute(CreateEventPage()),
+        ),
+        body: MultiDayViewWidget(),
+      ),
+    );
+  }
+}

example/lib/widgets/multi_day_view_widget.dart

@@ -0,0 +1,48 @@
+import 'package:calendar_view/calendar_view.dart';
+import 'package:flutter/material.dart';
+
+import '../pages/event_details_page.dart';
+
+class MultiDayViewWidget extends StatelessWidget {
+  final GlobalKey<MultiDayViewState>? state;
+  final double? width;
+
+  const MultiDayViewWidget({super.key, this.state, this.width});
+
+  @override
+  Widget build(BuildContext context) {
+    return MultiDayView(
+      key: state,
+      daysInView: 3,
+      width: width,
+      showLiveTimeLineInAllDays: true,
+      eventArranger: SideEventArranger(maxWidth: 30),
+      timeLineWidth: 65,
+      scrollPhysics: const BouncingScrollPhysics(),
+      liveTimeIndicatorSettings: LiveTimeIndicatorSettings(
+        color: Colors.redAccent,
+        onlyShowToday: 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(
+            builder: (_) => DetailsPage(
+              event: events.first,
+              date: date,
+            ),
+          ),
+        );
+      },
+      onEventLongTap: (events, date) {
+        SnackBar snackBar = SnackBar(content: Text("on LongTap"));
+        ScaffoldMessenger.of(context).showSnackBar(snackBar);
+      },
+    );
+  }
+}

lib/calendar_view.dart

@@ -18,3 +18,4 @@ export './src/month_view/month_view.dart';
 export './src/style/header_style.dart';
 export './src/typedefs.dart';
 export './src/week_view/week_view.dart';
+export './src/multi_day_view/multi_day_view.dart';

lib/src/components/_internal_components.dart

@@ -41,17 +41,21 @@ class LiveTimeIndicator extends StatefulWidget {
   /// This field will be used to set end hour for day and week view
   final int endHour;
 
+  /// Flag to show only today's events.
+  final bool onlyShowToday;
+
   /// Widget to display tile line according to current time.
-  const LiveTimeIndicator({
-    Key? key,
-    required this.width,
-    required this.height,
-    required this.timeLineWidth,
-    required this.liveTimeIndicatorSettings,
-    required this.heightPerMinute,
-    required this.startHour,
-    this.endHour = Constants.hoursADay,
-  }) : super(key: key);
+  const LiveTimeIndicator(
+      {Key? key,
+      required this.width,
+      required this.height,
+      required this.timeLineWidth,
+      required this.liveTimeIndicatorSettings,
+      required this.heightPerMinute,
+      required this.startHour,
+      this.endHour = Constants.hoursADay,
+      this.onlyShowToday = false})
+      : super(key: key);
 
   @override
   _LiveTimeIndicatorState createState() => _LiveTimeIndicatorState();
@@ -113,7 +117,9 @@ class _LiveTimeIndicatorState extends State<LiveTimeIndicator> {
         color: widget.liveTimeIndicatorSettings.color,
         height: widget.liveTimeIndicatorSettings.height,
         offset: Offset(
-          widget.timeLineWidth + widget.liveTimeIndicatorSettings.offset,
+          widget.onlyShowToday
+              ? 0
+              : widget.timeLineWidth + widget.liveTimeIndicatorSettings.offset,
           (_currentTime.getTotalMinutes - startMinutes) *
               widget.heightPerMinute,
         ),

lib/src/extensions.dart

@@ -44,6 +44,24 @@ extension DateTimeExtensions on DateTime {
               7)
           .ceil();
 
+  /// Gets difference of multi-day between [date] and calling object.
+  int getMultiDayDifference(
+      {required DateTime startDate,
+      required DateTime endDate,
+      daysInView = 3}) {
+    final daysDifference =
+        startDate.withoutTime.difference(endDate.withoutTime).inDays.abs() + 1;
+
+    return (daysDifference / daysInView).ceil();
+  }
+
+  /// Returns the list of [DateTime] for given [index] and [daysInView].
+  List<DateTime> getMultiDateRangeList(DateTime startDate, int index,
+      {int daysInView = 3}) {
+    DateTime baseDate = startDate.add(Duration(days: index * daysInView));
+    return List.generate(daysInView, (i) => baseDate.add(Duration(days: i)));
+  }
+
   /// Returns The List of date of Current Week, all of the dates will be without
   /// time.
   /// Day will start from Monday to Sunday.
@@ -89,6 +107,36 @@ extension DateTimeExtensions on DateTime {
   DateTime lastDayOfWeek({WeekDays start = WeekDays.monday}) =>
       DateTime(year, month, day + (6 - (weekday - start.index - 1) % 7));
 
+  DateTime firstDayOfMultiDay({
+    required DateTime startDate,
+    int daysInView = 3,
+  }) {
+    final diffDays = startDate.withoutTime
+        .difference(DateTime.now().withoutTime)
+        .inDays
+        .abs();
+    final offset = diffDays % daysInView;
+    return offset == 0
+        ? startDate.withoutTime
+        : startDate.subtract(Duration(days: daysInView - offset)).withoutTime;
+  }
+
+  /// Returns the last date of week containing the current date
+  DateTime lastDayOfMultiDay({
+    required DateTime endDate,
+    int daysInView = 3,
+  }) {
+    final diffDays = endDate.withoutTime
+            .difference(DateTime.now().withoutTime)
+            .inDays
+            .abs() +
+        1;
+    final offset = diffDays % daysInView;
+    return offset == 0
+        ? endDate.withoutTime
+        : endDate.add(Duration(days: daysInView - offset)).withoutTime;
+  }
+
   /// Returns list of all dates of [month].
   /// All the dates are week based that means it will return array of size 42
   /// which will contain 6 weeks that is the maximum number of weeks a month

lib/src/modals.dart

@@ -62,6 +62,9 @@ class LiveTimeIndicatorSettings {
   /// Width of time backgroud view.
   final double timeBackgroundViewWidth;
 
+  /// Flag to show only today's events.
+  final bool onlyShowToday;
+
   /// Settings for live time line
   const LiveTimeIndicatorSettings({
     this.height = 1.0,
@@ -73,6 +76,7 @@ class LiveTimeIndicatorSettings {
     this.showTimeBackgroundView = false,
     this.bulletRadius = 5.0,
     this.timeBackgroundViewWidth = 60.0,
+    this.onlyShowToday = false,
   }) : assert(height >= 0, "Height must be greater than or equal to 0.");
 
   factory LiveTimeIndicatorSettings.none() => LiveTimeIndicatorSettings(