From 4cbb45f9af448193a565770c1f0cfdc4c816fae4 Mon Sep 17 00:00:00 2001 From: Apurva-Simform <122270609+apurva010@users.noreply.github.com> Date: Thu, 9 May 2024 14:09:17 +0530 Subject: [PATCH] Feat/all day header title (#361) * New option to display allday event header title feat: #308 * Fix week view full-day row bottom border color * Add IgnorePointer to live indicator to allow to press event Without IgnorePointer, because the live indicator is on top of the events it won't allow to press the events. --------- Co-authored-by: Martim Silva --- CHANGELOG.md | 1 + README.md | 8 ++- lib/src/components/week_view_components.dart | 13 ++++ .../week_view/_internal_week_view_page.dart | 70 ++++++++++++++----- lib/src/week_view/week_view.dart | 15 ++++ 5 files changed, 88 insertions(+), 19 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 630bfc14..43e05dd8 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,7 @@ - # [1.1.1] (UnReleased) - Added showWeekTileBorder field whether to show border for header in month view. [#306](https://github.com/SimformSolutionsPvtLtd/flutter_calendar_view/issues/306) - Fixed an issue related to hiding day, which is not in the current month in MonthView. [#328](https://github.com/SimformSolutionsPvtLtd/flutter_calendar_view/issues/328) +- Added header title for full day events in week view. [#308](https://github.com/SimformSolutionsPvtLtd/flutter_calendar_view/issues/308) - Added support for double tapping gestures on any event in day, week, and month view. [#195](https://github.com/SimformSolutionsPvtLtd/flutter_calendar_view/issues/195) - Added support to set end time of day and week view. [#298](https://github.com/SimformSolutionsPvtLtd/flutter_calendar_view/issues/298) - Added support for horizontal scroll physics of week and month view page. [#314](https://github.com/SimformSolutionsPvtLtd/flutter_calendar_view/issues/314) diff --git a/README.md b/README.md index 7f76f072..52a0b364 100644 --- a/README.md +++ b/README.md @@ -220,7 +220,13 @@ WeekView( hourLinePainter: (lineColor, lineHeight, offset, minuteHeight, showVerticalLine, verticalLineOffset) { return //Your custom painter. }, - weekPageHeaderBuilder: WeekHeader.hidden // To hide week header + weekPageHeaderBuilder: WeekHeader.hidden, // To hide week header + fullDayHeaderTitle: 'All day', // To set full day events header title + fullDayHeaderTextConfig: FullDayHeaderTextConfig( + textAlign: TextAlign.center, + textOverflow: TextOverflow.ellipsis, + maxLines: 2, + ), // To set full day events header text config ); ``` diff --git a/lib/src/components/week_view_components.dart b/lib/src/components/week_view_components.dart index 69f88203..77e1ff70 100644 --- a/lib/src/components/week_view_components.dart +++ b/lib/src/components/week_view_components.dart @@ -43,3 +43,16 @@ class WeekPageHeader extends CalendarPageHeader { "${secondaryDate != null ? "${secondaryDate.day} / " "${secondaryDate.month} / ${secondaryDate.year}" : ""}"; } + +class FullDayHeaderTextConfig { + /// Set full day events header text config + const FullDayHeaderTextConfig({ + this.textAlign = TextAlign.center, + this.maxLines = 2, + this.textOverflow = TextOverflow.ellipsis, + }); + + final TextAlign textAlign; + final int maxLines; + final TextOverflow textOverflow; +} diff --git a/lib/src/week_view/_internal_week_view_page.dart b/lib/src/week_view/_internal_week_view_page.dart index 52a46056..c56362f1 100644 --- a/lib/src/week_view/_internal_week_view_page.dart +++ b/lib/src/week_view/_internal_week_view_page.dart @@ -5,6 +5,7 @@ import 'package:flutter/material.dart'; import '../components/_internal_components.dart'; +import '../components/week_view_components.dart'; import '../components/event_scroll_notifier.dart'; import '../enumerations.dart'; import '../event_arrangers/event_arrangers.dart'; @@ -144,6 +145,12 @@ class InternalWeekViewPage extends StatelessWidget { /// This field will be used to set end hour for week view final int endHour; + /// Title of the full day events row + final String fullDayHeaderTitle; + + /// Defines full day events header text config + final FullDayHeaderTextConfig fullDayHeaderTextConfig; + /// A single page for week view. const InternalWeekViewPage({ Key? key, @@ -187,6 +194,8 @@ class InternalWeekViewPage extends StatelessWidget { required this.emulateVerticalOffsetBy, required this.onTileDoubleTap, required this.endHour, + this.fullDayHeaderTitle = '', + required this.fullDayHeaderTextConfig, }) : super(key: key); @override @@ -229,25 +238,50 @@ class InternalWeekViewPage extends StatelessWidget { ), SizedBox( width: width, - child: Row( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - SizedBox(width: timeLineWidth + hourIndicatorSettings.offset), - ...List.generate( - filteredDates.length, - (index) { - final fullDayEventList = - controller.getFullDayEvent(filteredDates[index]); - return SizedBox( - width: weekTitleWidth, - child: fullDayEventBuilder.call( - fullDayEventList, - dates[index], + child: Container( + decoration: BoxDecoration( + border: Border( + bottom: BorderSide( + color: hourIndicatorSettings.color, + width: 2, + ), + ), + ), + child: Row( + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + if (fullDayHeaderTitle.isNotEmpty) + Container( + width: timeLineWidth + hourIndicatorSettings.offset, + padding: const EdgeInsets.symmetric( + vertical: 2, + horizontal: 1, ), - ); - }, - ) - ], + child: Text( + fullDayHeaderTitle, + textAlign: fullDayHeaderTextConfig.textAlign, + maxLines: fullDayHeaderTextConfig.maxLines, + overflow: fullDayHeaderTextConfig.textOverflow, + ), + ), + ...List.generate( + filteredDates.length, + (index) { + final fullDayEventList = + controller.getFullDayEvent(filteredDates[index]); + return Container( + width: weekTitleWidth, + child: fullDayEventList.isEmpty + ? null + : fullDayEventBuilder.call( + fullDayEventList, + dates[index], + ), + ); + }, + ) + ], + ), ), ), Expanded( diff --git a/lib/src/week_view/week_view.dart b/lib/src/week_view/week_view.dart index a7d45f71..7f3de723 100644 --- a/lib/src/week_view/week_view.dart +++ b/lib/src/week_view/week_view.dart @@ -231,6 +231,12 @@ class WeekView extends StatefulWidget { /// This can be used to disable the horizontal scroll of a page. final ScrollPhysics? pageViewPhysics; + /// Title of the full day events row + final String fullDayHeaderTitle; + + /// Defines full day events header text config + final FullDayHeaderTextConfig? fullDayHeaderTextConfig; + /// Main widget for week view. const WeekView({ Key? key, @@ -286,6 +292,8 @@ class WeekView extends StatefulWidget { this.pageViewPhysics, this.onEventDoubleTap, this.endHour = Constants.hoursADay, + this.fullDayHeaderTitle = '', + this.fullDayHeaderTextConfig, }) : assert(!(onHeaderTitleTap != null && weekPageHeaderBuilder != null), "can't use [onHeaderTitleTap] & [weekPageHeaderBuilder] simultaneously"), assert((timeLineOffset) >= 0, @@ -327,6 +335,7 @@ class WeekViewState extends State> { late DateTime _currentWeek; late int _totalWeeks; late int _currentIndex; + late String _fullDayHeaderTitle; late EventArranger _eventArranger; @@ -346,6 +355,7 @@ class WeekViewState extends State> { late WeekNumberBuilder _weekNumberBuilder; late FullDayEventBuilder _fullDayEventBuilder; late DetectorBuilder _weekDetectorBuilder; + late FullDayHeaderTextConfig _fullDayHeaderTextConfig; late double _weekTitleWidth; late int _totalDaysInWeek; @@ -388,6 +398,9 @@ class WeekViewState extends State> { _eventArranger = widget.eventArranger ?? SideEventArranger(); _assignBuilders(); + _fullDayHeaderTitle = widget.fullDayHeaderTitle; + _fullDayHeaderTextConfig = + widget.fullDayHeaderTextConfig ?? FullDayHeaderTextConfig(); } @override @@ -533,6 +546,8 @@ class WeekViewState extends State> { widget.emulateVerticalOffsetBy, showWeekDayAtBottom: widget.showWeekDayAtBottom, endHour: _endHour, + fullDayHeaderTitle: _fullDayHeaderTitle, + fullDayHeaderTextConfig: _fullDayHeaderTextConfig, ), ); },