Merge pull request #8 from Iconica-Development/feature/weekday-names

Make it possible to show the names of the day of the weeks in the overlay date time picker
This commit is contained in:
FlutterJorian 2022-11-18 13:59:01 +01:00 committed by GitHub
commit 3edcbe4b5a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 82 additions and 28 deletions

View file

@ -11,9 +11,10 @@ import 'package:flutter_date_time_picker/src/widgets/overlay_date_time_picker/ov
class OverlayDateTimePicker extends StatefulWidget {
const OverlayDateTimePicker({
this.theme = const DateTimePickerTheme(),
this.textStyle = const TextStyle(),
this.alignment = Alignment.bottomRight,
this.initialDate,
this.size = const Size(325, 325),
this.size = const Size(325, 350),
this.wrongTimeDialog,
this.onTapDay,
this.highlightToday = true,
@ -26,6 +27,7 @@ class OverlayDateTimePicker extends StatefulWidget {
super.key,
this.buttonBuilder,
this.closeOnSelectDate = true,
this.showWeekDays = true,
}) : assert(child != null || buttonBuilder != null);
/// The child contained by the DatePicker.
@ -37,6 +39,9 @@ class OverlayDateTimePicker extends StatefulWidget {
/// Visual properties for the [OverlayDateTimePicker]
final DateTimePickerTheme theme;
/// Style to base the text on
final TextStyle textStyle;
/// Callback that provides the date tapped on as a [DateTime] object.
final Function(DateTime date)? onTapDay;
@ -73,6 +78,9 @@ class OverlayDateTimePicker extends StatefulWidget {
/// [closeOnSelectDate] is a bool that indicates if the overlay should be closed if a date has been picked.
final bool closeOnSelectDate;
/// [showWeekDays] is a [bool] that determines if day in the week indicators should be shown
final bool showWeekDays;
@override
State<OverlayDateTimePicker> createState() => _OverlayDateTimePickerState();
}
@ -208,8 +216,10 @@ class _OverlayDateTimePickerState extends State<OverlayDateTimePicker> {
padding: const EdgeInsets.all(8.0),
child: OverlayDateTimeContent(
theme: widget.theme,
textStyle: widget.textStyle,
size: widget.size,
controller: _dateTimePickerController,
showWeekDays: true,
onNextDate: nextDate,
onPreviousDate: previousDate,
),

View file

@ -7,20 +7,25 @@ import 'package:flutter_date_time_picker/flutter_date_time_picker.dart';
import 'package:flutter_date_time_picker/src/extensions/date_time.dart';
import 'package:flutter_date_time_picker/src/utils/date_time_picker_controller.dart';
import 'package:flutter_date_time_picker/src/widgets/overlay_date_time_picker/pickable_date.dart';
import 'package:intl/intl.dart';
class DatePicker extends StatelessWidget {
const DatePicker({
super.key,
required this.controller,
required this.theme,
required this.textStyle,
required this.onSelectDate,
required this.date,
required this.showWeekDays,
});
final DateTimePickerController controller;
final DateTimePickerTheme theme;
final TextStyle textStyle;
final void Function(DateTime date) onSelectDate;
final DateTime date;
final bool showWeekDays;
@override
Widget build(BuildContext context) {
@ -33,15 +38,41 @@ class DatePicker extends StatelessWidget {
int addedIndex = 0;
if (daysToSkip >= 7) {
addedIndex = 7;
if (daysToSkip >= DateTime.daysPerWeek) {
addedIndex = DateTime.daysPerWeek;
}
int length = DateTime(date.year, date.month).daysInMonth() + daysToSkip;
int daysToAdd = 7 - length % 7;
return GridView.count(
int daysToAdd = DateTime.daysPerWeek - length % DateTime.daysPerWeek;
return Column(
children: [
if (showWeekDays) ...[
Padding(
padding: const EdgeInsets.only(top: 8),
child: Row(
children: List.generate(DateTime.daysPerWeek, (index) {
DateFormat dateFormatter = DateFormat("EE");
return Expanded(
child: Center(
child: Padding(
padding: const EdgeInsets.all(2.0),
child: Text(
// The first day in November 2022 is monday
// We use it to properly show monday as the first day and sunday as the last one
dateFormatter.format(DateTime(2022, 11, index)),
style: textStyle.copyWith(fontWeight: FontWeight.bold),
),
),
),
);
}),
),
),
],
Expanded(
child: GridView.count(
physics: const NeverScrollableScrollPhysics(),
crossAxisCount: 7,
crossAxisCount: DateTime.daysPerWeek,
children: List.generate(
length + daysToAdd,
(index) {
@ -64,6 +95,9 @@ class DatePicker extends StatelessWidget {
);
},
),
),
),
],
);
}

View file

@ -12,15 +12,19 @@ class OverlayDateTimeContent extends StatefulWidget {
const OverlayDateTimeContent({
super.key,
required this.theme,
required this.textStyle,
required this.size,
required this.controller,
required this.showWeekDays,
required this.onNextDate,
required this.onPreviousDate,
});
final DateTimePickerTheme theme;
final TextStyle textStyle;
final Size size;
final DateTimePickerController controller;
final bool showWeekDays;
final void Function() onNextDate;
final void Function() onPreviousDate;
@ -86,27 +90,33 @@ class _OverlayDateTimeContentState extends State<OverlayDateTimeContent> {
controller: widget.controller,
onSelectDate: onSelectDate,
theme: widget.theme,
textStyle: widget.textStyle,
date: DateTime(
widget.controller.browsingDate.year,
widget.controller.browsingDate.month - 1,
1,
),
showWeekDays: widget.showWeekDays,
),
DatePicker(
controller: widget.controller,
onSelectDate: onSelectDate,
theme: widget.theme,
textStyle: widget.textStyle,
date: widget.controller.browsingDate,
showWeekDays: widget.showWeekDays,
),
DatePicker(
controller: widget.controller,
onSelectDate: onSelectDate,
theme: widget.theme,
textStyle: widget.textStyle,
date: DateTime(
widget.controller.browsingDate.year,
widget.controller.browsingDate.month + 1,
1,
),
showWeekDays: widget.showWeekDays,
),
],
),