Flutter日历,可以自定义风格UI,kotlin可选参数

//支持自定义绘制
DayWidgetBuilder dayWidgetBuilder; //创建日历item
WeekBarItemWidgetBuilder weekBarItemWidgetBuilder; //创建顶部的weekbar

//构造函数
CalendarController(
{int selectMode = Constants.MODE_SINGLE_SELECT,
DayWidgetBuilder dayWidgetBuilder = defaultCustomDayWidget,
WeekBarItemWidgetBuilder weekBarItemWidgetBuilder = defaultWeekBarWidget,
int minYear = 1971,
int maxYear = 2055,
int minYearMonth = 1,
int maxYearMonth = 12,
int nowYear = -1,
int nowMonth = -1,
int minSelectYear = 1971,
int minSelectMonth = 1,
int minSelectDay = 1,
int maxSelectYear = 2055,
int maxSelectMonth = 12,
int maxSelectDay = 30,
Set selectedDateTimeList = EMPTY_SET,
DateModel selectDateModel,
int maxMultiSelectCount = 9999,
Map<DateTime, Object> extraDataMap = EMPTY_MAP})

利用controller添加监听事件

比如月份切换事件、点击选择事件。

//月份切换监听
void addMonthChangeListener(OnMonthChange listener) {
this.monthChange = listener;
}
//点击选择监听
void addOnCalendarSelectListener(OnCalendarSelect listener) {
this.calendarSelect = listener;
}
//多选超出指定范围
void addOnMultiSelectOutOfRangeListener(OnMultiSelectOutOfRange listener) {
this.multiSelectOutOfRange = listener;
}
//多选超出限制个数
void addOnMultiSelectOutOfSizeListener(OnMultiSelectOutOfSize listener) {
this.multiSelectOutOfSize = listener;
}

利用controller来控制日历的切换,支持配置动画

//跳转到指定日期
void moveToCalendar(int year, int month, int day,
{bool needAnFlutter日历,可以自定义风格UI,kotlin可选参数
imation = false,
Duration duration = const Duration(milliseconds: 500),
Curve curve = Curves.ease});
//切换到下一年
void moveToNextYear();
//切换到上一年
void moveToPreviousYear();
//切换到下一个月份,
void moveToNextMonth();
//切换到上一个月份
void moveToPreviousMonth();

利用controller来获取日历的一些数据信息

// 获取当前的月份
DateTime getCurrentMonth();
//获取被选中的日期,多选
Set getMultiSelectCalendar();
//获取被选中的日期,单选
DateModel getSingleSelectCalendar();

自定义UI

包括自定义WeekBar、自定义日历Item,默认使用的都是DefaultXXXWidget。

只要继承对应的Base类,实现相应的方法,然后只需要在配置Controller的时候,实现相应的Builder方法就可以了。

//支持自定义绘制
DayWidgetBuilder dayWidgetBuilder; //创建日历item
WeekBarItemWidgetBuilder weekBarItemWidgetBuilder; //创建顶部的weekbar

自定义WeekBar

继承BaseWeekBar,重写getWeekBarItem(index)方法就可以。随便你怎么实现,只需要返回一个Widget就可以了。

class DefaultWeekBar extends BaseWeekBar {
const DefaultWeekBar({Key key}) : super(key: key);
@override
Widget getWeekBarItem(int index) {
/**

  • 自定义Widget
    */
    return new Container(
    height: 40,
    alignment: Alignment.center,
    child: new Text(
    Constants.WEEK_LIST[index],
    style: topWeekTextStyle,
    ),
    );
    }
    }

自定义日历Item:

提供两种方法,一种是利用组合widget的方式来创建,一种是利用Canvas来自定义绘制Item。最后只需要在CalendarController的构造参数中进行配置就可以了。

  • 继承BaseCombineDayWidget,重写getNormalWidget(DateModel dateModel) 和getSelectedWidget(DateModel dateModel)就可以了,返回对应的widget就行。

class DefaultCombineDayWidget extends BaseCombineDayWidget {
DefaultCombineDayWidget(DateModel dateModel) : super(dateModel);

@override
Widget getNormalWidget(DateModel dateModel) {
//实现默认状态下的UI
}

@override
Widget getSelectedWidget(DateModel dateModel) {
//绘制被选中的UI
}
}

  • 继承BaseCustomDayWidget,重写drawNormal和drawSelected的两个方法就可以了,利用canvas自己绘制Item。

class DefaultCustomDayWidget extends BaseCustomDayWidget {
DefaultCustomDayWidget(DateModel dateModel) : super(dateModel);
@override
void drawNormal(DateModel dateModel, Canvas canvas, Size size) {
//实现默认状态下的UI
defaultDrawNormal(dateModel, canvas, size);
}
@override
void drawSelected(DateModel dateModel, Canvas canvas, Size size) {
//绘制被选中的UI
defaultDrawSelected(dateModel, canvas, size);
}
}

DateModel实体类

日历所用的日期的实体类DateModel,有下面这些属性。

/**

  • 日期的实体类
    */
    class DateModel {
    int year;
    int month;
    int day = 1;
    int lunarYear;
    int lunarMonth;
    int lunarDay;
    String lunarString; //农历字符串
    String solarTerm; //24节气
    String gregorianFestival; //公历节日
    String traditionFestival; //传统农历节日
    bool isCurrentDay; //是否是今天
    bool isLeapYear; //是否是闰年
    bool isWeekend; //是否是周末
    int leapMonth; //是否是闰月
    Object extraData; //自定义的额外数据
    bool isInRange = false; //是否在范围内,比如可以实现在某个范围外,设置置灰的功能
    bool isSelected; //是否被选中,用来实现一些标记或者选择功能
    @override
    String toString() {
    return ‘DateModel{year: $year, month: $month, day: $day}’;
    ol isInRange = false; //是否在范围内,比如可以实现在某个范围外,设置置灰的功能
    bool isSelected; //是否被选中,用来实现一些标记或者选择功能
    @override
    String toString() {
    return ‘DateModel{year: $year, month: $month, day: $day}’;
上一篇:PHP & 理解 Laravel 中 Event & Listener 的作用和使用


下一篇:LTC 主网钱包linux安装(付款的加密货币 基于区块链技术)