From dcd0ae8c33053017e2bd70eee076ea880156fcb3 Mon Sep 17 00:00:00 2001 From: MrBoOodY Date: Sat, 3 Feb 2024 02:12:32 +0200 Subject: [PATCH 1/2] added customization for title --- lib/src/day_based_changable_picker.dart | 21 +++++- lib/src/day_picker.dart | 95 +++++++++++++++++-------- lib/src/month_navigation_row.dart | 58 +++++++++------ 3 files changed, 124 insertions(+), 50 deletions(-) diff --git a/lib/src/day_based_changable_picker.dart b/lib/src/day_based_changable_picker.dart index 631f82b..5853a47 100644 --- a/lib/src/day_based_changable_picker.dart +++ b/lib/src/day_based_changable_picker.dart @@ -2,7 +2,6 @@ import 'dart:async'; import 'package:flutter/material.dart'; import 'package:flutter_localizations/flutter_localizations.dart'; - import 'package:intl/intl.dart' as intl; import 'basic_day_based_widget.dart'; @@ -66,6 +65,18 @@ class DayBasedChangeablePicker extends StatefulWidget { /// Called when the user changes the month final ValueChanged? onMonthChanged; + /// Margin for title. + final EdgeInsetsGeometry? monthTitleMargin; + + /// Padding for title. + final EdgeInsetsGeometry? monthTitlePadding; + + /// Month Navigation Row Main AxisAlignment. + final MainAxisAlignment? navigationMonthMainAxisAlignment; + + /// Month Navigation Title Container decoration. + final BoxDecoration? navigationMonthTitleDecoration; + /// Create picker with option to change month. DayBasedChangeablePicker({ Key? key, @@ -81,6 +92,10 @@ class DayBasedChangeablePicker extends StatefulWidget { this.onSelectionError, this.eventDecorationBuilder, this.onMonthChanged, + this.navigationMonthMainAxisAlignment, + this.monthTitleMargin, + this.monthTitlePadding, + this.navigationMonthTitleDecoration, }) : initiallyShowDate = _getInitiallyShownDate(initiallyShownDate, selection), super(key: key); @@ -240,6 +255,10 @@ class _DayBasedChangeablePickerState ), nextIcon: widget.datePickerStyles.nextIcon, prevIcon: widget.datePickerStyles.prevIcon, + titleMargin: widget.monthTitleMargin, + titlePadding: widget.monthTitlePadding, + mainAxisAlignment: widget.navigationMonthMainAxisAlignment, + titleDecoration: widget.navigationMonthTitleDecoration, ); }); } diff --git a/lib/src/day_picker.dart b/lib/src/day_picker.dart index 8b4905b..dd00659 100644 --- a/lib/src/day_picker.dart +++ b/lib/src/day_picker.dart @@ -11,21 +11,25 @@ import 'utils.dart'; /// Date picker for selection one day. class DayPicker extends StatelessWidget { - DayPicker._( - {Key? key, - required this.onChanged, - required this.firstDate, - required this.lastDate, - required this.selectionLogic, - required this.selection, - this.initiallyShowDate, - this.datePickerLayoutSettings = const DatePickerLayoutSettings(), - this.datePickerStyles, - this.datePickerKeys, - this.selectableDayPredicate, - this.eventDecorationBuilder, - this.onMonthChanged}) - : super(key: key); + DayPicker._({ + Key? key, + required this.onChanged, + required this.firstDate, + required this.lastDate, + required this.selectionLogic, + required this.selection, + this.initiallyShowDate, + this.datePickerLayoutSettings = const DatePickerLayoutSettings(), + this.datePickerStyles, + this.datePickerKeys, + this.selectableDayPredicate, + this.eventDecorationBuilder, + this.onMonthChanged, + this.monthTitleMargin, + this.monthTitlePadding, + this.navigationMonthMainAxisAlignment, + this.navigationMonthTitleDecoration, + }) : super(key: key); /// Creates a day picker where only one single day can be selected. /// @@ -33,6 +37,10 @@ class DayPicker extends StatelessWidget { /// * [DayPicker.multi] - day picker where many single days can be selected. static DayPicker single( {Key? key, + BoxDecoration? navigationMonthTitleDecoration, + EdgeInsetsGeometry? monthTitleMargin, + EdgeInsetsGeometry? monthTitlePadding, + MainAxisAlignment? navigationMonthMainAxisAlignment, required DateTime selectedDate, required ValueChanged onChanged, required DateTime firstDate, @@ -82,6 +90,10 @@ class DayPicker extends StatelessWidget { datePickerKeys: datePickerKeys, datePickerStyles: datePickerStyles, datePickerLayoutSettings: datePickerLayoutSettings, + navigationMonthMainAxisAlignment: navigationMonthMainAxisAlignment, + monthTitlePadding: monthTitlePadding, + monthTitleMargin: monthTitleMargin, + navigationMonthTitleDecoration: navigationMonthTitleDecoration, ); } @@ -90,20 +102,25 @@ class DayPicker extends StatelessWidget { /// See also: /// * [DayPicker.single] - day picker where only one single day /// can be selected. - static DayPicker> multi( - {Key? key, - required List selectedDates, - required ValueChanged> onChanged, - required DateTime firstDate, - required DateTime lastDate, - DatePickerLayoutSettings datePickerLayoutSettings = - const DatePickerLayoutSettings(), - DateTime? initiallyShowDate, - DatePickerRangeStyles? datePickerStyles, - DatePickerKeys? datePickerKeys, - SelectableDayPredicate? selectableDayPredicate, - EventDecorationBuilder? eventDecorationBuilder, - ValueChanged? onMonthChanged}) { + static DayPicker> multi({ + Key? key, + required List selectedDates, + required ValueChanged> onChanged, + required DateTime firstDate, + required DateTime lastDate, + DatePickerLayoutSettings datePickerLayoutSettings = + const DatePickerLayoutSettings(), + DateTime? initiallyShowDate, + DatePickerRangeStyles? datePickerStyles, + DatePickerKeys? datePickerKeys, + SelectableDayPredicate? selectableDayPredicate, + EventDecorationBuilder? eventDecorationBuilder, + ValueChanged? onMonthChanged, + EdgeInsetsGeometry? monthTitleMargin, + EdgeInsetsGeometry? monthTitlePadding, + MainAxisAlignment? navigationMonthMainAxisAlignment, + BoxDecoration? navigationMonthTitleDecoration, + }) { final startOfTheFirstDate = DatePickerUtils.startOfTheDay(firstDate); final endOfTheLastDate = DatePickerUtils.endOfTheDay(lastDate); final startOfTheInitiallyShowDate = initiallyShowDate == null @@ -140,6 +157,10 @@ class DayPicker extends StatelessWidget { datePickerKeys: datePickerKeys, datePickerStyles: datePickerStyles, datePickerLayoutSettings: datePickerLayoutSettings, + monthTitlePadding: monthTitlePadding, + monthTitleMargin: monthTitleMargin, + navigationMonthMainAxisAlignment: navigationMonthMainAxisAlignment, + navigationMonthTitleDecoration: navigationMonthTitleDecoration, ); } @@ -188,6 +209,18 @@ class DayPicker extends StatelessWidget { /// Logic to handle user's selections. final ISelectablePicker selectionLogic; + /// Margin for title. + final EdgeInsetsGeometry? monthTitleMargin; + + /// Padding for title. + final EdgeInsetsGeometry? monthTitlePadding; + + /// Month Navigation Row Main AxisAlignment. + final MainAxisAlignment? navigationMonthMainAxisAlignment; + + /// Month Navigation Title Container decoration. + final BoxDecoration? navigationMonthTitleDecoration; + @override // ignore: prefer_expression_function_bodies Widget build(BuildContext context) { @@ -203,6 +236,10 @@ class DayPicker extends StatelessWidget { datePickerKeys: datePickerKeys, eventDecorationBuilder: eventDecorationBuilder, onMonthChanged: onMonthChanged, + monthTitleMargin: monthTitleMargin, + monthTitlePadding: monthTitlePadding, + navigationMonthMainAxisAlignment: navigationMonthMainAxisAlignment, + navigationMonthTitleDecoration: navigationMonthTitleDecoration, ); } } diff --git a/lib/src/month_navigation_row.dart b/lib/src/month_navigation_row.dart index 188f723..0a5d288 100644 --- a/lib/src/month_navigation_row.dart +++ b/lib/src/month_navigation_row.dart @@ -1,4 +1,5 @@ import 'package:flutter/material.dart'; + import 'day_picker.dart' as day_picker; import 'icon_btn.dart'; import 'range_picker.dart'; @@ -44,25 +45,41 @@ class MonthNavigationRow extends StatelessWidget { /// Usually [Text] widget. final Widget? title; + /// Margin for title. + final EdgeInsetsGeometry? titleMargin; + + /// Padding for title. + final EdgeInsetsGeometry? titlePadding; + + /// Month Navigation Row MainAxisAlignment. + final MainAxisAlignment? mainAxisAlignment; + + /// Month Navigation Title Container decoration. + final BoxDecoration? titleDecoration; + /// Creates month navigation row. - const MonthNavigationRow({ - Key? key, - this.previousPageIconKey, - this.nextPageIconKey, - this.onNextMonthTapped, - this.onPreviousMonthTapped, - this.nextMonthTooltip, - this.previousMonthTooltip, - this.title, - required this.nextIcon, - required this.prevIcon - }) : super(key: key); + const MonthNavigationRow( + {Key? key, + this.previousPageIconKey, + this.nextPageIconKey, + this.onNextMonthTapped, + this.onPreviousMonthTapped, + this.nextMonthTooltip, + this.previousMonthTooltip, + this.title, + this.mainAxisAlignment, + this.titleMargin, + this.titlePadding, + this.titleDecoration, + required this.nextIcon, + required this.prevIcon}) + : super(key: key); @override // ignore: prefer_expression_function_bodies Widget build(BuildContext context) { return Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, + mainAxisAlignment: mainAxisAlignment ?? MainAxisAlignment.spaceBetween, crossAxisAlignment: CrossAxisAlignment.center, children: [ Semantics( @@ -74,13 +91,14 @@ class MonthNavigationRow extends StatelessWidget { onTap: onPreviousMonthTapped, ), ), - Expanded( - child: Container( - alignment: Alignment.center, - child: Center( - child: ExcludeSemantics( - child: title, - ), + Container( + padding: titlePadding, + margin: titleMargin, + alignment: Alignment.center, + decoration: titleDecoration, + child: Center( + child: ExcludeSemantics( + child: title, ), ), ), From a16f224060510474af69c5eb01de3bb89fabcda6 Mon Sep 17 00:00:00 2001 From: MrBoOodY Date: Sat, 3 Feb 2024 14:45:28 +0200 Subject: [PATCH 2/2] unlock container customization of month navigation row's title --- lib/src/month_navigation_row.dart | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/lib/src/month_navigation_row.dart b/lib/src/month_navigation_row.dart index 0a5d288..f8b042b 100644 --- a/lib/src/month_navigation_row.dart +++ b/lib/src/month_navigation_row.dart @@ -94,12 +94,9 @@ class MonthNavigationRow extends StatelessWidget { Container( padding: titlePadding, margin: titleMargin, - alignment: Alignment.center, decoration: titleDecoration, - child: Center( - child: ExcludeSemantics( - child: title, - ), + child: ExcludeSemantics( + child: title, ), ), Semantics(