🧩 项目信息：
- 示例预览地址： knight-l.github.io/y_calendar/
- github主页： github.com/knight-L/y_…
- pub主页： pub.dev/packages/y_…
✨ 特性
- 📅 单日期选择 - 简洁直观的单日期选择功能
- 📆 日期范围选择 - 灵活的日期范围选择，适用于各种场景
- 🌓 深/浅色主题 - 自动适应系统主题，提供良好的视觉体验
- 🎨 Material 风格 - 遵循 Material Design 设计规范
- 🚀 预设快捷选项 - 支持添加常用日期预设，提高用户效率
📱 效果展示
| 范围选择 | 单日期选择 | 主题适配 |
|---|---|---|
🛠️ 安装
在 pubspec.yaml 文件中添加依赖：
dependencies:
y_calendar: ^1.0.5
然后运行：
flutter pub get
📖 使用指南
导入包
import 'package:y_calendar/y_calendar.dart';
import 'package:intl/intl.dart'; // 用于格式化日期
单日期选择
ElevatedButton(
onPressed: () async {
DateTime? date = await YCalendar<DateTime>
().showBottomSheet(context);
if (date != null) {
// 使用选中的日期
String formattedDate = DateFormat
('yyyy-MM-dd').format(date);
print('选中日期: $formattedDate');
}
},
child: Text('单个日期选择'),
)
日期范围选择
ElevatedButton(
onPressed: () async {
List<DateTime>? dateRange = await
YCalendar<List<DateTime>>().showBottomSheet
(context);
if (dateRange != null) {
// 使用选中的日期范围
String start = DateFormat('yyyy-MM-dd').
format(dateRange[0]);
String end = dateRange.length > 1 ?
DateFormat('yyyy-MM-dd').format(dateRange
[1]) : start;
print('选中范围: $start 至 $end');
}
},
child: Text('范围选择'),
)
添加预设日期选项
final DateTime nowTime = DateTime.now();
final Map<String, List<DateTime>> presets = {
'本周': DateUtil.getThisWeek(nowTime),
'上周': DateUtil.getLastWeek(nowTime),
'下周': DateUtil.getNextWeek(nowTime),
'本月': DateUtil.getThisMonth(nowTime),
'上月': DateUtil.getLastMonth(nowTime),
'下月': DateUtil.getNextMonth(nowTime),
};
List<DateTime>? dateRange = await
YCalendar<List<DateTime>>(
presets: presets,
).showBottomSheet(context);
⚙️ 自定义配置
YCalendar<DateTime>(
title: "选择日期", // 日历标题
color: Colors.blue, // 主题颜色
minDate: DateTime(2023, 1, 1), // 最小可选日期
maxDate: DateTime(2023, 12, 31), // 最大可选日
期
defaultDate: DateTime.now(), // 默认选中日期
round: BorderRadius.vertical(top: Radius.
circular(20.0)), // 圆角设置
showConfirm: true, // 是否显示确认按
钮
closeOnClickOverlay: true, // 点击遮罩层是否
关闭
confirmText: "确定", // 确认按钮文字
height: 400.0, // 日历高度
).showBottomSheet(context)
📋 API 参数
| 参数 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| title | String | "日期选择" | 日历标题 |
| color | Color? | null | 主题颜色，影响按钮和选中日期的颜色 |
| minDate | DateTime? | 去年 1 月 | 最小可选日期 |
| maxDate | DateTime? | 明年 12 月 | 最大可选日期 |
| defaultDate | T? | null | 默认选中的日期 |
| round | BorderRadiusGeometry | BorderRadius.vertical(top: Radius.circular(20.0)) | 圆角设置 |
| showConfirm | bool | true | 是否显示确认按钮 |
| closeOnClickOverlay | bool | true | 点击遮罩层是否关闭 |
| confirmText | String | "确定" | 确认按钮文字 |
| height | double | 400.0 | 日历高度 |
| presets | Map<String, List>? | null | 预设日期选项 |
💡 技术亮点
- 泛型设计：使用泛型 YCalendar 支持不同类型的日期选择（单日期或日期范围）
- 灵活的日期计算：提供丰富的日期计算工具方法
- 自适应布局：使用 Flutter 布局系统实现自适应界面
- 高度可定制：提供多种自定义选项，满足不同场景需求
- 简洁的 API：简单易用的 API 设计，降低使用门槛
🔍 应用场景
- 酒店/机票预订应用中的日期选择
- 日程管理应用中的日期范围选择
- 任何需要日期输入的表单
- 日历视图展示
