zsh_calendar

Creator: coderz1093

Last updated:

0 purchases

zsh_calendar Image
zsh_calendar Images
Add to Cart

Description:

zsh calendar

zsh_calendar #
A new Flutter package project.
日历组件,支持周日切换,支持滑动收缩,支持上下页跳转,支持跳到某个日期,支持边界效果, 日历中每个日期、周的widget都可自定义 #
This project is a starting point for a Dart
package,
a library module containing code that can be shared easily across
multiple Flutter or Dart projects.
For help getting started with Flutter, view our
online documentation, which offers tutorials,
samples, guidance on mobile development, and a full API reference.
@[TOC](zsh_calendar 日历组件,支持周日切换,支持滑动收缩,支持上下页跳转,支持跳到某个日期,支持边界效果, 日历中每个日期、周的widget都可自定义)
附上
github 地址:
pub.dev 地址
效果 #
可高度自定义的日历,日历中每个日期、周都可以自定义样式,
实现了

项目1跳转到某个日期功能,
上下月跳转功能
左右滑动切换功能
周日历和月日历切换功能
上下滑动收缩功能

效果1:

效果2:

使用方法 #
导入文件 #
方式1: 将代码下载下来,将里面的lib/src下的文件夹导入到自己的项目中
方式2: pubspec.yaml 添加
dependencies:
zsh_calendar: ^0.0.1
copied to clipboard
然后控制台执行: flutter pub get 既可
使用 #
在要使用zsh_calendar的地方写:
import 'package:zsh_calendar/zsh_calendar.dart';
copied to clipboard
带收缩日历用CalendarSliverDelegate,他是SliverPersistentHeader的代理,外层用CustomScrollView包裹,
如下:
CustomScrollView(

slivers: [
Consumer<MedicHistoryProvider>(
builder: (context, MedicHistoryProvider counter, _) {

return SliverPersistentHeader(

delegate: CalendarSliverDelegate(
startTime: DateTime(2020, 2, 3),
endTime: DateTime(2021, 2, 3),
currentPageTime: counter.firstCurrentPageTime,
calendarController: _calendarController,
weekdayHeader: CalendarWeekday(
7,
30,
builder: (int weekday) {
return Container(
child: Text(
weekList[weekday-1],
style: TextStyle(
fontSize: 14,
),
),
);
}
),
dayWidgetBuilder:(DateTime date, bool isLastMonthDay, bool isNextMonthDay) {

bool isSame = date.year == Provider.of<MedicHistoryProvider>(context, listen: false).firstCurrentPageTime.year
&& date.month == Provider.of<MedicHistoryProvider>(context, listen: false).firstCurrentPageTime.month
&& date.day == Provider.of<MedicHistoryProvider>(context, listen: false).firstCurrentPageTime.day;

return InkWell(

child: Column(
children: <Widget>[

Container(

margin: EdgeInsets.only(top: (MediaQuery.of(context).size.width/7-10)/4),
width: (MediaQuery.of(context).size.width/7-10)/2,
height: (MediaQuery.of(context).size.width/7-10)/2,
decoration: isSame ? BoxDecoration(
borderRadius: BorderRadius.circular((MediaQuery.of(context).size.width/7-10)/2),
color: Colors.yellow,
) : null,
child: Center(
child: Text(
date.day.toString(),
style: TextStyle(
fontSize: 14,
color: isSame ? Colors.white : Colors.blue,
),
),
)
),
Offstage(
offstage: isLastMonthDay || isNextMonthDay,
child: Container(

margin: EdgeInsets.only(top: 2),
decoration: BoxDecoration(

borderRadius: BorderRadius.circular(5),
color: Colors.yellow,
),
width: 5,
height: 5,
),
)
],
),
onTap: (){
historyProvider.setFirstCurrentPageTime(date);
_calendarController.goToDate(dateTime: date);

},
);
},
currentPageDate: (DateTime pageTime) {

historyProvider.setFirstCurrentPageTime(pageTime);

},
),
pinned: true,
);
}),


],
),
copied to clipboard
不带收缩功能的,用CalendarCarousel组件,参数和上面一样,shrinkageHeight不需要设置,除非你想要它收缩

更多效果以及完整代码在github #

License

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Files In This Product:

Customer Reviews

There are no reviews.