Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

1.0.4 first weekday customization #1

Merged
merged 4 commits into from
Jan 2, 2022
Merged

1.0.4 first weekday customization #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
ada3efe
Add support for customizing first week day
rfm4j Jan 1, 2022
0b10bb4
FistWeekDay validation
rfm4j Jan 1, 2022
799d937
Fix error when using weekday=7
rfm4j Jan 1, 2022
0284b6f
Update readme.md
rfm4j Jan 1, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
4 changes: 4 additions & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,3 +10,7 @@
## 1.0.3

* Init between animation fixed

## 1.0.4

* Allow to change the first week day (by default is set to Sunday)
41 changes: 21 additions & 20 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -134,26 +134,27 @@ placeholderTS = TextStyle(color: Colors.grey.withOpacity(0.7), fontSize: 20);

## Datepicker options

| option | Type | Default | Description |
| --------------------- | ----------------- | ----------------------: | ----------------------------------------------------- |
| calendarSize | double | 400| Datepicker size |
| minYear | double | DateTime.now().year - 100| Datepicker minimum year |
| maxYear | double | DateTime.now().year + 100| Datepicker maximum year |
| format | string | 'yyyy-mm-dd'| Format to show as result and bottom selected dates |
| limitCount | int | 1| Set how many dates can be picked |
| weekLabelList | List<String> | below code| Set week words on the datepicker |
| monthLabelList | List<String> | below code| Set month dropdown label on the datepicker datepicker |
| isYearMonthDropdownReverse | bool | false| Reverse order of dropdowns on the datepicker |
| headerColor | Color | Color(0XFF6771e4)| Reverse order of dropdowns on the datepicker |
| arrowIconAreaColor | Color | Color(0XFF4752e0)| Reverse order of dropdowns on the datepicker |
| selectedCircleColor | Color | Color(0XFF6771e4)| Reverse order of dropdowns on the datepicker |
| selectedBetweenAreaColor | Color | Color(0XFFe2e4fa)| Reverse order of dropdowns on the datepicker |
| cancelFontColor | Color | Color(0XFF4a54c5)| Reverse order of dropdowns on the datepicker |
| okButtonColor | LinearGradient | below code| Reverse order of dropdowns on the datepicker |
| bottomSelectedBorderColor | Color | Color(0XFF6771e4)| Reverse order of dropdowns on the datepicker |
| isDark | bool | false| dark mode |
| cancelBtnLabel | String | 'CANCEL'| Cancel button label |
| okBtnLabel | String | 'OK'| Ok button label |
| option | Type | Default | Description |
| --------------------- | ----------------- |--------------------------:|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| calendarSize | double | 400 | Datepicker size |
| minYear | double | DateTime.now().year - 100 | Datepicker minimum year |
| maxYear | double | DateTime.now().year + 100 | Datepicker maximum year |
| format | string | 'yyyy-mm-dd' | Format to show as result and bottom selected dates |
| limitCount | int | 1 | Set how many dates can be picked |
| weekLabelList | List<String> | below code | Set week words on the datepicker |
| monthLabelList | List<String> | below code | Set month dropdown label on the datepicker datepicker |
| firstWeekDay | int | 7 (Sunday) | Set de first weekday that will be shown. Possible values are:monday = 1, tuesday = 2 wednesday = 3, thursday = 4, friday = 5, saturday = 6, sunday = 7 (Can also use DateTime.monday, DateTime.sunday...) |
| isYearMonthDropdownReverse | bool | false | Reverse order of dropdowns on the datepicker |
| headerColor | Color | Color(0XFF6771e4) | Reverse order of dropdowns on the datepicker |
| arrowIconAreaColor | Color | Color(0XFF4752e0) | Reverse order of dropdowns on the datepicker |
| selectedCircleColor | Color | Color(0XFF6771e4) | Reverse order of dropdowns on the datepicker |
| selectedBetweenAreaColor | Color | Color(0XFFe2e4fa) | Reverse order of dropdowns on the datepicker |
| cancelFontColor | Color | Color(0XFF4a54c5) | Reverse order of dropdowns on the datepicker |
| okButtonColor | LinearGradient | below code | Reverse order of dropdowns on the datepicker |
| bottomSelectedBorderColor | Color | Color(0XFF6771e4) | Reverse order of dropdowns on the datepicker |
| isDark | bool | false | dark mode |
| cancelBtnLabel | String | 'CANCEL' | Cancel button label |
| okBtnLabel | String | 'OK' | Ok button label |


```dart
Expand Down
15 changes: 15 additions & 0 deletions lib/cool_datepicker.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ class CoolDatepicker extends StatefulWidget {
late List weekLabelMapList;
late List monthLabelMapList;
bool isYearMonthDropdownReverse;
int ? firstWeekDay;

// color
Color headerColor;
Expand Down Expand Up @@ -105,6 +106,7 @@ class CoolDatepicker extends StatefulWidget {
this.cancelBtnLabel = 'CANCEL',
this.okBtnLabel = 'OK',
this.isResultLabel = true,
this.firstWeekDay = DateTime.sunday,
}) {
// disabledRangeList 체크
if (disabledRangeList != null) {
Expand All @@ -131,6 +133,12 @@ class CoolDatepicker extends StatefulWidget {
format.contains('dd')),
'you must include yyyy, dd, mm');

assert(
(firstWeekDay! >=1) && (firstWeekDay! <= 7),
'firstWeekDay must be > 0 and <= 7. The code number is: '
' monday = 1, tuesday = 2 wednesday = 3, thursday = 4, friday = 5, saturday = 6, sunday = 7'
);

// weekLabelList setting
weekLabelMapList = [
{'label': weekLabelList?[0] ?? 'S', 'color': const Color(0XFFE70000)},
Expand All @@ -142,6 +150,11 @@ class CoolDatepicker extends StatefulWidget {
{'label': weekLabelList?[6] ?? 'S', 'color': const Color(0XFF22A2BF)}
];

List sourceWeekLabels = List.from(weekLabelMapList);
for(int i=0; i<sourceWeekLabels.length; i++){
weekLabelMapList[i] = sourceWeekLabels[(i+firstWeekDay!)%7];
}

monthLabelMapList = [
{'label': monthLabelList?[0] ?? '01', 'value': 1},
{'label': monthLabelList?[1] ?? '02', 'value': 2},
Expand Down Expand Up @@ -305,6 +318,7 @@ class _CoolDatepickerState extends State<CoolDatepicker>
onSelected: widget.onSelected,
weekLabelList: widget.weekLabelMapList,
monthLabelList: widget.monthLabelMapList,
firstWeekDay: widget.firstWeekDay!,
getSelectedItems: (selectedItems) {
if (selectedItems is Map) {
setState(() {
Expand Down Expand Up @@ -484,6 +498,7 @@ class _CoolDatepickerState extends State<CoolDatepicker>
width: widget.iconSize,
child: Calendar(
key: datePickerIconKey,
firstWeekDay: widget.firstWeekDay!,
iconSize: widget.iconSize,
calendarSize: widget.calendarSize,
isYearMonthDropdownReverse:
Expand Down
13 changes: 6 additions & 7 deletions lib/models/calendar_info.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,17 +10,16 @@ class CalendarInfo {
List<DateInfo> dates = [];
late dynamic thisVsync;

CalendarInfo({required this.year, required this.month, this.thisVsync}) {
CalendarInfo({required this.year, required this.month, this.thisVsync, required int firstWeekDay}) {
int lastDay = DateTime(year, month + 1, 0).day;
int firstWeekday = DateTime(year, month, 1).weekday;
int monthFirstWeekDay = DateTime(year, month, 1).weekday;

// 비어있는 날짜
if (firstWeekday != 7) {
for (var i = 0; i < firstWeekday; i++) {
dates.add(DateInfo(isSelected: SelectType.empty));
}
for (int i = 0; i < (monthFirstWeekDay - firstWeekDay) %7; i++) {
dates.add(DateInfo(isSelected: SelectType.empty));
}



for (var i = 0; i < lastDay; i++) {
AnimationController singleSelectedAniCtrl = AnimationController(
vsync: thisVsync, duration: const Duration(milliseconds: 500));
Expand Down
4 changes: 4 additions & 0 deletions lib/views/calendar.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ class Calendar extends StatefulWidget {
List monthLabelList;
late double maxMonthDropdownWidth;
bool isYearMonthDropdownReverse;
int firstWeekDay;

Color headerColor;
Color arrowIconAreaColor;
Expand Down Expand Up @@ -77,6 +78,7 @@ class Calendar extends StatefulWidget {
required this.monthLabelList,
this.key,
required this.isYearMonthDropdownReverse,
required this.firstWeekDay,
required this.headerColor,
required this.arrowIconAreaColor,
required this.selectedCircleColor,
Expand Down Expand Up @@ -340,6 +342,7 @@ class CalendarState extends State<Calendar> with TickerProviderStateMixin {
void setCalendar() {
if (widget.isRange) {
calendarInfo = CalendarInfo(
firstWeekDay: widget.firstWeekDay,
year: yearValue['value'], month: monthValue['value'], thisVsync: this)
..setSelectedBtwDates(
datesRange: datesRange,
Expand All @@ -348,6 +351,7 @@ class CalendarState extends State<Calendar> with TickerProviderStateMixin {
);
} else {
calendarInfo = CalendarInfo(
firstWeekDay: widget.firstWeekDay,
year: yearValue['value'], month: monthValue['value'], thisVsync: this)
..setSelectedDates(
selectedDates: selectedItems!,
Expand Down
2 changes: 1 addition & 1 deletion pubspec.yaml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
name: cool_datepicker
description: Cool datepicker ✨ This datepicker gives you cool animation, modern design, and you can customize colors and language for datepicker.
version: 1.0.3
version: 1.0.4
homepage: https://github.com/joo6077/cool_datepicker

environment:
Expand Down