一、概述
此控件特点:
- 以7x7矩阵的形式展示任何一个月的日期,即在一个7行7列的网格中呈现。
- 显示星期的名称,即每一列对应一个特定的星期几(如周一、周二等)。
- 高亮显示当前日期(即今天)。
- 支持高亮用户自定义的日期,允许用户突出显示特定的日期以供关注或标记。
二、部件和样式
2.1、使用底层按钮矩阵(lv_btnmatrix)对象
此控件内部采用了 lv_btnmatrix 对象作为基础结构,以此来组织和排列日历中的日期及星期名称,形成一个矩阵布局。
2.2、包含组件元素
- LV_PART_MAIN:日历的整体背景。
- LV_PART_ITEMS:日历中的具体日期以及星期名称。由于底层采用 lv_btnmatrix,每个日期和星期名称都表现为一个按钮。针对这些按钮,设置了特定的控制标志和添加了自定义绘制事件,以实现特定的样式效果。
三、相关函数
1、void lv_calendar_set_today_date(lv_obj_t *obj, uint32_t year, uint32_t month, uint32_t day)
设置当前日期。
2、void lv_calendar_set_showed_date(lv_obj_t *obj, uint32_t year, uint32_t month)
显示的年份和月份。
lv_obj_t * obj = lv_calendar_create(lv_scr_act());
lv_calendar_set_today_date(obj, 2024, 4, 3);
lv_obj_set_size(obj, 300, 300);
lv_obj_center(obj);
lv_calendar_set_showed_date(obj, 2024, 4);
3、void lv_calendar_set_highlighted_dates(lv_obj_t *obj, lv_calendar_date_t highlighted[], uint16_t date_num)
设置日历控件特定日期高亮显示。参数3是要高亮显示的日期数量。
lv_obj_t * obj = lv_calendar_create(lv_scr_act());
lv_calendar_set_today_date(obj, 2024, 4, 3);
lv_obj_set_size(obj, 300, 300);
lv_obj_center(obj);
lv_calendar_set_showed_date(obj, 2024, 4);
static lv_calendar_date_t highlighted_dates[] =
{
{ .year = 2024, .month = 4, .day = 9 },
{ .year = 2024, .month = 4, .day = 21 },
{ .year = 2024, .month = 4, .day = 26 }
};
lv_calendar_set_highlighted_dates(obj, highlighted_dates, 3);
4、void lv_calendar_set_day_names(lv_obj_t *obj, const char **day_names)
设置星期名称。
lv_obj_t * obj = lv_calendar_create(lv_scr_act());
lv_calendar_set_today_date(obj, 2024, 4, 3);
lv_obj_set_size(obj, 600, 300);
lv_obj_center(obj);
lv_calendar_set_showed_date(obj, 2024, 4);
static lv_calendar_date_t highlighted_dates[] =
{
{ .year = 2024, .month = 4, .day = 9 },
{ .year = 2024, .month = 4, .day = 21 },
{ .year = 2024, .month = 4, .day = 26 }
};
lv_calendar_set_highlighted_dates(obj, highlighted_dates, 3);
lv_obj_set_style_text_font(obj,&lv_font_siyuanheiti16,LV_PART_MAIN);
static const char *day_names[] =
{
"星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"
};
lv_calendar_set_day_names(obj, day_names);
5、lv_obj_t *lv_calendar_get_btnmatrix(const lv_obj_t *obj)
获取其内部用于显示日期和星期名称的按钮矩阵。
6、const lv_calendar_date_t *lv_calendar_get_today_date(const lv_obj_t *calendar)
获取今天的日期。
7、const lv_calendar_date_t *lv_calendar_get_showed_date(const lv_obj_t *calendar)
获取当前显示的日期,即用户当前看到的年份、月份组合。
8、lv_calendar_date_t *lv_calendar_get_highlighted_dates(const lv_obj_t *calendar)
获取所有高亮日期。
9、uint16_t lv_calendar_get_highlighted_dates_num(const lv_obj_t *calendar)
获取高亮显示日期数量。
10、lv_obj_t * lv_calendar_header_arrow_create(lv_obj_t * parent)
设置箭头形式的日历头。
lv_obj_t * obj = lv_calendar_create(lv_scr_act());
lv_calendar_set_today_date(obj, 2024, 4, 3);
lv_obj_set_size(obj, 600, 300);
lv_obj_center(obj);
lv_calendar_set_showed_date(obj, 2024, 4);
static lv_calendar_date_t highlighted_dates[] =
{
{ .year = 2024, .month = 4, .day = 9 },
{ .year = 2024, .month = 4, .day = 21 },
{ .year = 2024, .month = 4, .day = 26 }
};
lv_calendar_set_highlighted_dates(obj, highlighted_dates, 3);
lv_obj_set_style_text_font(obj,&lv_font_siyuanheiti16,LV_PART_MAIN);
static const char *day_names[] =
{
"星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"
};
lv_calendar_set_day_names(obj, day_names);
lv_calendar_header_arrow_create(obj);
11、lv_obj_t * lv_calendar_header_dropdown_create(lv_obj_t * parent)
设置下拉列表形式的日历头。
lv_obj_t * obj = lv_calendar_create(lv_scr_act());
static const char *day_names[] =
{
"星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"
};
lv_calendar_set_day_names(obj, day_names);
lv_calendar_set_today_date(obj, 2024, 4, 3);
lv_calendar_set_showed_date(obj, 2024, 02);
lv_obj_set_size(obj, 600, 300);
lv_obj_center(obj);
static lv_calendar_date_t highlighted_dates[] =
{
{ .year = 2024, .month = 4, .day = 9 },
{ .year = 2024, .month = 4, .day = 21 },
{ .year = 2024, .month = 4, .day = 26 }
};
lv_calendar_set_highlighted_dates(obj, highlighted_dates, 3);
lv_obj_set_style_text_font(obj,&lv_font_siyuanheiti16,LV_PART_MAIN);
lv_calendar_header_dropdown_create(obj);
lv_calendar_set_showed_date(obj, 2024, 04);
可能需要在源码添加年份:
这里也要改成最新年份:
12、 lv_res_t lv_calendar_get_pressed_date(const lv_obj_t *calendar, lv_calendar_date_t *date)
获取日历控件当前被按下的日期。
返回值:
- LV_RES_OK:有一个有效的按下日期。参数2已填充了当前被按下的日期信息。
- LV_RES_INV:当前没有被按下的日期。可能是用户未进行任何按压操作,或者已取消了之前的按压状态。
static void event_handler3(lv_event_t * e)
{
lv_event_code_t code = lv_event_get_code(e);
lv_obj_t * obj = lv_event_get_current_target(e);
if(code == LV_EVENT_VALUE_CHANGED)
{
lv_calendar_date_t date;
if(lv_calendar_get_pressed_date(obj, &date))
{
std::cout<<"选中日期:"<<(int)date.year<<(int)date.month<<(int)date.day<<std::endl;
}
}
}
int main(int argc, char **argv)
{
lv_init();
hal_init();
lv_log_register_print_cb(esp32_log_cb);
lv_obj_t * obj = lv_calendar_create(lv_scr_act());
static const char *day_names[] =
{
"星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"
};
lv_calendar_set_day_names(obj, day_names);
lv_calendar_set_today_date(obj, 2024, 4, 3);
lv_calendar_set_showed_date(obj, 2024, 02);
lv_obj_set_size(obj, 600, 300);
lv_obj_center(obj);
static lv_calendar_date_t highlighted_dates[] =
{
{ .year = 2024, .month = 4, .day = 9 },
{ .year = 2024, .month = 4, .day = 21 },
{ .year = 2024, .month = 4, .day = 26 }
};
lv_calendar_set_highlighted_dates(obj, highlighted_dates, 3);
lv_obj_set_style_text_font(obj,&lv_font_siyuanheiti16,LV_PART_MAIN);
lv_calendar_header_dropdown_create(obj);
lv_calendar_set_showed_date(obj, 2024, 04);
lv_obj_add_event_cb(obj, event_handler3, LV_EVENT_ALL, NULL);
while (1)
{
lv_timer_handler();
usleep(5 * 1000);
}
return 0;
}