## mini_calendar
[![](https://img.shields.io/pub/v/mini_calendar#align=left&display=inline&height=20&originHeight=20&originWidth=76&status=done&style=none&width=76)](https://pub.flutter-io.cn/packages/mini_calendar) ![GitHub code size in bytes](https://img.shields.io/github/languages/code-size/OpenFlutter/mini_calendar?style=plastic)
Date component developed with Flutter, plans to support display, swipe left and right, add date mark, radio, display week, etc.
使ç¨Flutterå¼åçæ¥æç»ä»¶ï¼è®¡åæ¯ææ¾ç¤ºï¼å·¦å³æ»å¨ï¼æ·»å æ¥ææ è®°ï¼åéï¼æ¾ç¤ºææçåè½ã
- [æ´æ°è®°å½](CHANGELOG.md)
### 主è¦æ³å®ç°çå
容
![åè½è®¾è®¡](https://upload-images.jianshu.io/upload_images/14097955-e322a37f80d25deb.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
## 使ç¨
### å¼å
¥åº
```dart
dependencies:
mini_calendar: ^2.0.0
```
### 导å
```dart
import 'package:mini_calendar/mini_calendar.dart';
```
### æè§å¾(MonthWidget)
```dart
MonthWidget();// é»è®¤å½æ
```
- å¯éè¿æ§å¶å¨åæ°æ¥æ§å¶æ¾ç¤ºçæ份以åéæ©çæ¥æ
```dart
MonthWidget(
controller: MonthController.init(
MonthOption(
currentDay: DateDay.now().copyWith(month: index + 1, day: Random().nextInt(27) + 1),
currentMonth: DateMonth.now().copyWith(month: index + 1),
)
),
)
```
- æ¯ææ¾ç¤ºè¿é
```dart
MonthWidget(
controller: MonthController.init(MonthOption(
currentMonth: DateMonth.now().copyWith(month: 1),
enableContinuous: true,
firstSelectDay: DateDay.now().copyWith(month: 1, day: 8),
secondSelectDay: DateDay.now().copyWith(month: 1, day: 18),
)),
)
```
- æ¯æå¤é
```dart
MonthWidget(
controller: MonthController.init(MonthOption(
currentMonth: DateMonth.now().copyWith(month: 1),
enableMultiple: true,
multipleDays: [
DateDay.now().copyWith(month: 1, day: 3),
DateDay.now().copyWith(month: 1, day: 5),
DateDay.now().copyWith(month: 1, day: 8),
],
)),
)
```
- æ¯ææ·»å æ è®°
- â¦â¦
![image.png](https://cdn.nlark.com/yuque/0/2019/png/179485/1576584797091-8f86bb0c-b470-49c7-85dd-00f68febca94.png)
### æ»å¨æ¥å(MonthPageView)
> æ§å¶å¨éè¦å建åè·å `onCreated`
```dart
MonthPageView(
padding: EdgeInsets.all(1),
scrollDirection: Axis.horizontal,// æ°´å¹³æ»å¨æè
ç«ç´æ»å¨
option: MonthOption(
enableContinuous: true,// åéãè¿éæ§å¶
marks: {
DateDay.now().copyWith(day: 1): '111',
DateDay.now().copyWith(day: 5): '222',
DateDay.now().copyWith(day: 13): '333',
DateDay.now().copyWith(day: 19): '444',
DateDay.now().copyWith(day: 26): '444',
},
),
showWeekHead: true, // æ¾ç¤ºææ头é¨
onContinuousSelectListen: (DateDayï¼firstDay,DateDayï¼endFay) {
},// è¿éåè°
onMultipleSelectListen: (list) {
},// å¤éåè°
onMonthChange: (month) {
},// æ份æ´æ¹åè°
onDaySelected: (DateDay day, T? markData, bool enable) {
// enable : æ¯å¦æ¯å¯éæ¥æ
},// æ¥æéä¸ä¼è¿ªæ¬§å
onCreated: (controller){
}, // æ§å¶å¨åè°
onClear: () {
}// ç¹å»æ¸
空æé®ï¼è®¾ç½®ä¸ºç©ºæ¶ä¸æ¾ç¤ºæ¸
空æé®
),
```
### æ§å¶å¨
#### åæ°åå§å
```dart
MonthOption({
DateDay currentDay,//éæ©çæ¥æ
DateMonth currentMonth,//å½åæ份
int firstWeek = 7,//第ä¸åæ¾ç¤ºçææ [1,7]
DateDay firstSelectDay,//è¿é第ä¸ä¸ªæ¥æ
DateDay secondSelectDay,//è¿é第äºä¸ªæ¥æ
bool enableContinuous = false,//æ¯å¦æ¯æè¿é
Map marks = const {},//æ è®°
List? multipleDays, // å¤éæ¥æ
List? enableDays, // è½éæ©çæ¥æéå
bool enableMultiple = false,//æ¯å¦æ¯æå¤é
DateDay minDay,//å¯éçæå°æ¥æ
DateDay maxDay,//å¯éçæ大æ¥æ
});
```
#### 注é
```dart
MonthPageController#dispose();
```
#### æ´æ°
```dart
MonthPageController#reLoad();
```
#### ä¸ä¸æ
```dart
MonthPageController#next();
```
#### ä¸ä¸æ
```dart
MonthPageController#last();
```
#### 跳转å°æå®æ份
```dart
MonthPageController#goto(DateMonth month);
```
![æ¼ç¤º](https://upload-images.jianshu.io/upload_images/14097955-88d9957dbdc0c533.gif?imageMogr2/auto-orient/strip|imageView2/2/w/499/format/webp)
### é«çº§åè½
> èªå®ä¹
#### èªå®ä¹æè§å¾èæ¯
```dart
buildMonthBackground: (_, width, height, month) => Image.network(
'https://ssyerv1.oss-cn-hangzhou.aliyuncs.com/picture/b0c57bd90abd49d59920924010ab66a9.png!sswm',
height: height,
width: width,
fit: BoxFit.cover,
),
```
#### èªå®ä¹æè§å¾å¤´é¨
```dart
buildMonthHead: (ctx, width, height, month) => Container(
padding: EdgeInsets.all(5),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Text(
"${month.year}å¹´",
style: TextStyle(fontSize: 40, color: Colors.white),
),
Container(
margin: EdgeInsets.only(left: 5, right: 5),
width: 1,
color: Colors.yellow,
height: 50,
),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"${month.month}æ",
style: TextStyle(fontSize: 18, color: Colors.orange),
),
Text("è¿æ¯ä¸ä¸ªèªå®ä¹çæ头é¨"),
],
)
],
),
),
```
- èªå®ä¹ææ头é¨
- èªå®ä¹æ¥è§å¾
- â¦â¦
|![image.png](https://cdn.nlark.com/yuque/0/2019/png/179485/1576584839283-c713cc7e-c932-4d7f-8033-888a7b7505f2.png)|![image.png](https://cdn.nlark.com/yuque/0/2019/png/179485/1576584857241-5a4a8bb1-fe4b-4fd2-b4c6-be03b68ddefc.png)|
| :---: | :---: |
> æ´å¤åè½clone项ç®ï¼è¿è¡demo
### å¼æºä¸æï¼èé们å¤å¤æ¯æï¼ç¹èµä¹æ¯æ¯æ ð ï¼