170 lines
6.8 KiB
Dart
170 lines
6.8 KiB
Dart
import 'package:calendar_builder/calendar_builder.dart';
|
|
import 'package:flutter/material.dart';
|
|
|
|
class CustomMonthBuilderScreen extends StatelessWidget {
|
|
const CustomMonthBuilderScreen({Key? key}) : super(key: key);
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
body: SafeArea(
|
|
child: Column(
|
|
children: [
|
|
Expanded(
|
|
child: CbMonthBuilder(
|
|
cbConfig: CbConfig(
|
|
startDate: DateTime(2020),
|
|
endDate: DateTime(2123),
|
|
selectedDate: DateTime(2022),
|
|
selectedYear: DateTime(2022),
|
|
weekStartsFrom: WeekStartsFrom.sunday,
|
|
eventDates: [
|
|
DateTime(2022, 1, 2),
|
|
DateTime(2022, 1, 2),
|
|
DateTime(2022, 1, 3)
|
|
],
|
|
highlightedDates: [
|
|
DateTime(2022, 1, 6),
|
|
DateTime(2022, 1, 3)
|
|
]),
|
|
yearDropDownCustomizer: YearDropDownCustomizer(
|
|
yearHeaderBuilder:
|
|
(isYearPickerExpanded, selectedDate, selectedYear, year) {
|
|
return Container(
|
|
height: 40,
|
|
color: Colors.yellow,
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.center,
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
children: [
|
|
Text(
|
|
year,
|
|
style: const TextStyle(fontWeight: FontWeight.bold),
|
|
),
|
|
Icon(!isYearPickerExpanded
|
|
? Icons.arrow_drop_down_outlined
|
|
: Icons.arrow_drop_up_outlined)
|
|
],
|
|
),
|
|
);
|
|
},
|
|
),
|
|
monthCustomizer: MonthCustomizer(
|
|
montMinhHeight: 200,
|
|
monthMinWidth: 450,
|
|
padding: const EdgeInsets.all(20),
|
|
monthHeaderBuilder:
|
|
(month, headerHeight, headerWidth, paddingLeft) {
|
|
return Container(
|
|
color: Colors.grey[200],
|
|
height: headerHeight,
|
|
width: headerWidth,
|
|
child: Padding(
|
|
padding: EdgeInsets.only(left: paddingLeft),
|
|
child: Align(
|
|
alignment: Alignment.center,
|
|
child: Text(
|
|
month,
|
|
style: const TextStyle(
|
|
fontSize: 22,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
);
|
|
},
|
|
monthWeekBuilder: (index, weeks, weekHeight, weekWidth) {
|
|
return SizedBox(
|
|
height: weekHeight,
|
|
width: weekWidth,
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(4.0),
|
|
child: Container(
|
|
decoration: BoxDecoration(
|
|
color: Colors.red.withOpacity(0.1),
|
|
borderRadius: BorderRadius.circular(10),
|
|
border: Border.all(color: Colors.red)),
|
|
child: Align(
|
|
child: Text(
|
|
weeks,
|
|
style: const TextStyle(
|
|
fontSize: 14,
|
|
color: Colors.red,
|
|
fontWeight: FontWeight.w500,
|
|
),
|
|
overflow: TextOverflow.ellipsis,
|
|
maxLines: 1,
|
|
),
|
|
),
|
|
),
|
|
),
|
|
);
|
|
},
|
|
monthButtonBuilder: (dateTime,
|
|
childHeight,
|
|
childWidth,
|
|
isSelected,
|
|
isDisabled,
|
|
hasEvent,
|
|
isHighlighted,
|
|
isCurrentDay) {
|
|
//Text Theme
|
|
final txtTheme = Theme.of(context).textTheme;
|
|
//color theme
|
|
final colorTheme = Theme.of(context);
|
|
|
|
var daysText = Align(
|
|
child: Text(
|
|
'${dateTime.day}',
|
|
style: isDisabled
|
|
? txtTheme.titleMedium
|
|
: isSelected
|
|
? txtTheme.bodyLarge!.copyWith(
|
|
fontWeight: FontWeight.bold,
|
|
color:
|
|
colorTheme.brightness == Brightness.dark
|
|
? Colors.black
|
|
: Colors.white)
|
|
: isHighlighted
|
|
? txtTheme.bodyLarge //Highlighted TextStyle
|
|
: isCurrentDay
|
|
? txtTheme
|
|
.bodyLarge //CurrentDay TextStyle
|
|
: txtTheme.bodyLarge,
|
|
),
|
|
);
|
|
if (isSelected) {
|
|
return Container(
|
|
decoration: const BoxDecoration(
|
|
color: Colors.red,
|
|
shape: BoxShape.rectangle,
|
|
),
|
|
margin: const EdgeInsets.all(2),
|
|
child: daysText,
|
|
);
|
|
}
|
|
return Container(
|
|
decoration: BoxDecoration(
|
|
color: isDisabled ? Colors.grey[200] : Colors.yellow,
|
|
shape: BoxShape.rectangle,
|
|
border: hasEvent || isHighlighted
|
|
? Border.all(
|
|
color:
|
|
isHighlighted ? Colors.red : Colors.blue,
|
|
width: 2)
|
|
: null),
|
|
margin: const EdgeInsets.all(2),
|
|
child: daysText,
|
|
);
|
|
},
|
|
),
|
|
),
|
|
)
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|