Skip to content

Commit

Permalink
part 1
Browse files Browse the repository at this point in the history
  • Loading branch information
Macacoazul01 committed Aug 2, 2024
1 parent e7dd425 commit 9155d58
Show file tree
Hide file tree
Showing 10 changed files with 276 additions and 146 deletions.
4 changes: 4 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
## 5.0.0-dev.3
- Added `showYearPicker` function to the package. Now its possible to return only a year.
- Updated sample.

## 5.0.0-dev.2
- Added `dialogSettings.insetPadding` parameter.
- Changed `headerSettings.headerPageTextStyle` name to `headerSettings.headerCurrentPageTextStyle` parameter + removed the fallback to avoid strange results.
Expand Down
292 changes: 163 additions & 129 deletions example/lib/main.dart
Original file line number Diff line number Diff line change
Expand Up @@ -51,11 +51,154 @@ class MyApp extends StatefulWidget {

class _MyAppState extends State<MyApp> {
DateTime? selectedDate;
int? selectedYear;

@override
void initState() {
super.initState();
selectedDate = widget.initialDate;
selectedYear = selectedDate?.year;
}

Future<void> monthPicker(BuildContext contexto) async {
return showMonthPicker(
context: contexto,
firstDate: DateTime(DateTime.now().year - 5, 5),
lastDate: DateTime(DateTime.now().year + 8, 9),
initialDate: selectedDate ?? widget.initialDate,
selectableMonthPredicate: (DateTime val) => val.month.isEven,
selectableYearPredicate: (int year) => year.isEven,
monthStylePredicate: (DateTime val) {
if (val.month == 4) {
return TextButton.styleFrom(
backgroundColor: Colors.yellow[700],
textStyle: const TextStyle(
color: Colors.pink,
fontWeight: FontWeight.bold,
),
);
}
return null;
},
yearStylePredicate: (int val) {
if (val == 2022) {
return TextButton.styleFrom(
backgroundColor: Colors.yellow[700],
textStyle: const TextStyle(
color: Colors.pink,
fontWeight: FontWeight.bold,
),
);
}
return null;
},
confirmWidget: Text(
'This one!',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.indigo[300],
),
),
cancelWidget: Text(
'Cancel',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.red[900],
),
),
monthPickerDialogSettings: const MonthPickerDialogSettings(
headerSettings: PickerHeaderSettings(
headerCurrentPageTextStyle: TextStyle(fontSize: 14),
headerSelectedIntervalTextStyle: TextStyle(fontSize: 16),
),
),
).then((DateTime? date) {
if (date != null) {
setState(() {
selectedDate = date;
});
}
});
}

Future<void> yearPicker(BuildContext contexto) async {
return showYearPicker(
context: contexto,
firstDate: DateTime(DateTime.now().year - 5, 5),
lastDate: DateTime(DateTime.now().year + 8, 9),
initialDate: selectedDate ?? widget.initialDate,
selectableYearPredicate: (int year) => year.isEven,
).then((int? year) {
if (year != null) {
setState(() {
selectedYear = year;
});
}
});
}

Future<void> rangePicker(BuildContext contexto) async {
return showMonthRangePicker(
context: contexto,
firstDate: DateTime(DateTime.now().year - 5, 5),
lastDate: DateTime(DateTime.now().year + 8, 9),
initialDate: selectedDate ?? widget.initialDate,
confirmWidget: Text(
'This one!',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.indigo[300],
),
),
cancelWidget: Text(
'Cancel',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.red[900],
),
),
headerTitle: const Text('Month Picker Dialog'),
monthPickerDialogSettings: MonthPickerDialogSettings(
dialogSettings: PickerDialogSettings(
locale: const Locale('en'),
dialogRoundedCornersRadius: 20,
dialogBackgroundColor: Colors.blueGrey[50],
),
headerSettings: PickerHeaderSettings(
headerBackgroundColor: Colors.indigo[300],
headerSelectedIntervalTextStyle: const TextStyle(
color: Colors.black,
fontWeight: FontWeight.bold,
fontSize: 20,
),
headerCurrentPageTextStyle: const TextStyle(
color: Colors.black,
),
previousIcon: Icons.arrow_back,
nextIcon: Icons.arrow_forward,
),
buttonsSettings: PickerButtonsSettings(
buttonBorder: const RoundedRectangleBorder(),
selectedMonthBackgroundColor: Colors.amber[900],
selectedMonthTextColor: Colors.white,
unselectedMonthsTextColor: Colors.black,
currentMonthTextColor: Colors.green,
yearTextStyle: const TextStyle(
color: Colors.amber,
),
monthTextStyle: const TextStyle(
color: Colors.red,
fontWeight: FontWeight.bold,
),
),
),
rangeList: true,
).then((List<DateTime>? dates) {
if (dates != null) {
print(dates);
print(dates.last.lastDayOfMonth());
}
});
}

@override
Expand All @@ -70,150 +213,41 @@ class _MyAppState extends State<MyApp> {
child: Center(
child: Column(
children: [
TextButton(
onPressed: () async => await monthPicker(context),
child: const Text('Single month picker'),
),
const SizedBox(
height: 10,
),
Text(
'Year: ${selectedDate?.year}\nMonth: ${selectedDate?.month}',
style: Theme.of(context).textTheme.headlineMedium,
textAlign: TextAlign.center,
),
const SizedBox(
height: 20,
height: 40,
),
TextButton(
onPressed: () async {
await showMonthPicker(
context: context,
firstDate: DateTime(DateTime.now().year - 5, 5),
lastDate: DateTime(DateTime.now().year + 8, 9),
initialDate: selectedDate ?? widget.initialDate,
selectableMonthPredicate: (DateTime val) =>
val.month.isEven,
selectableYearPredicate: (int year) => year.isEven,
monthStylePredicate: (DateTime val) {
if (val.month == 4) {
return TextButton.styleFrom(
backgroundColor: Colors.yellow[700],
textStyle: const TextStyle(
color: Colors.pink,
fontWeight: FontWeight.bold,
),
);
}
return null;
},
yearStylePredicate: (int val) {
if (val == 2022) {
return TextButton.styleFrom(
backgroundColor: Colors.yellow[700],
textStyle: const TextStyle(
color: Colors.pink,
fontWeight: FontWeight.bold,
),
);
}
return null;
},
confirmWidget: Text(
'This one!',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.indigo[300],
),
),
cancelWidget: Text(
'Cancel',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.red[900],
),
),
monthPickerDialogSettings:
const MonthPickerDialogSettings(
headerSettings: PickerHeaderSettings(
headerCurrentPageTextStyle: TextStyle(fontSize: 14),
headerSelectedIntervalTextStyle:
TextStyle(fontSize: 16),
),
),
).then((DateTime? date) {
if (date != null) {
setState(() {
selectedDate = date;
});
}
});
},
child: const Text('Single month picker'),
)
onPressed: () async => await yearPicker(context),
child: const Text('Single year picker'),
),
const SizedBox(
height: 10,
),
Text(
'Year: $selectedYear',
style: Theme.of(context).textTheme.headlineMedium,
textAlign: TextAlign.center,
),
],
),
),
),
),
floatingActionButton: Builder(
builder: (BuildContext context) => FloatingActionButton(
onPressed: () {
showMonthRangePicker(
context: context,
firstDate: DateTime(DateTime.now().year - 5, 5),
lastDate: DateTime(DateTime.now().year + 8, 9),
initialDate: selectedDate ?? widget.initialDate,
confirmWidget: Text(
'This one!',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.indigo[300],
),
),
cancelWidget: Text(
'Cancel',
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.red[900],
),
),
headerTitle: const Text('Month Picker Dialog'),
monthPickerDialogSettings: MonthPickerDialogSettings(
dialogSettings: PickerDialogSettings(
locale: const Locale('en'),
dialogRoundedCornersRadius: 20,
dialogBackgroundColor: Colors.blueGrey[50],
),
headerSettings: PickerHeaderSettings(
headerBackgroundColor: Colors.indigo[300],
headerSelectedIntervalTextStyle: const TextStyle(
color: Colors.black,
fontWeight: FontWeight.bold,
fontSize: 20,
),
headerCurrentPageTextStyle: const TextStyle(
color: Colors.black,
),
previousIcon: Icons.arrow_back,
nextIcon: Icons.arrow_forward,
),
buttonsSettings: PickerButtonsSettings(
buttonBorder: const RoundedRectangleBorder(),
selectedMonthBackgroundColor: Colors.amber[900],
selectedMonthTextColor: Colors.white,
unselectedMonthsTextColor: Colors.black,
currentMonthTextColor: Colors.green,
yearTextStyle: const TextStyle(
color: Colors.amber,
),
monthTextStyle: const TextStyle(
color: Colors.red,
fontWeight: FontWeight.bold,
),
),
),
rangeList: true,
).then((List<DateTime>? dates) {
if (dates != null) {
print(dates);
print(dates.last.lastDayOfMonth());
}
});
},
onPressed: () async => await rangePicker(context),
child: const Icon(Icons.calendar_today),
),
),
Expand Down
5 changes: 3 additions & 2 deletions lib/month_picker_dialog.dart
Original file line number Diff line number Diff line change
Expand Up @@ -20,8 +20,9 @@ export '/src/month_picker_widgets/pager.dart';
export '/src/month_selector/month_button.dart';
export '/src/month_selector/month_selector.dart';
export '/src/month_selector/month_year_grid.dart';
export '/src/show_month_picker.dart';
export '/src/show_month_range_picker.dart';
export '/src/pickers/show_month_picker.dart';
export '/src/pickers/show_month_range_picker.dart';
export '/src/pickers/show_year_picker.dart';
export '/src/year_selector/year_button.dart';
export '/src/year_selector/year_grid.dart';
export '/src/year_selector/year_selector.dart';
19 changes: 12 additions & 7 deletions lib/src/helpers/controller.dart
Original file line number Diff line number Diff line change
Expand Up @@ -18,10 +18,11 @@ class MonthpickerController {
required this.theme,
required this.useMaterial3,
this.customDivider,
required this.headerTitle,
required this.rangeMode,
required this.rangeList,
this.headerTitle,
this.rangeMode = false,
this.rangeList = false,
required this.monthPickerDialogSettings,
this.onlyYear = false,
});

//User defined variables
Expand All @@ -31,7 +32,7 @@ class MonthpickerController {
final bool Function(int)? selectableYearPredicate;
final ButtonStyle? Function(DateTime)? monthStylePredicate;
final ButtonStyle? Function(int)? yearStylePredicate;
final bool useMaterial3, rangeMode, rangeList;
final bool useMaterial3, rangeMode, rangeList, onlyYear;
final Widget? confirmWidget, cancelWidget, customDivider;
final Widget? headerTitle;
final MonthPickerDialogSettings monthPickerDialogSettings;
Expand Down Expand Up @@ -220,10 +221,14 @@ class MonthpickerController {
///function to show datetime in header
String getDateTimeHeaderText(String localeString) {
if (!rangeMode) {
if (monthPickerDialogSettings.dialogSettings.capitalizeFirstLetter) {
return '${toBeginningOfSentenceCase(DateFormat.yMMM(localeString).format(selectedDate))}';
if (!onlyYear) {
if (monthPickerDialogSettings.dialogSettings.capitalizeFirstLetter) {
return '${toBeginningOfSentenceCase(DateFormat.yMMM(localeString).format(selectedDate))}';
}
return DateFormat.yMMM(localeString).format(selectedDate).toLowerCase();
} else {
return DateFormat.y(localeString).format(selectedDate);
}
return DateFormat.yMMM(localeString).format(selectedDate).toLowerCase();
} else {
String rangeDateString = "";
if (firstRangeDate != null) {
Expand Down
Loading

0 comments on commit 9155d58

Please sign in to comment.