ESP32 LVGL8.1 ——Calendar 日历 (Calendar 25)

提示：本博客作为学习笔记，有错误的地方希望指正

前言：匆匆忙忙，时光是一把岁月的杀猪刀，慢慢的改变我们的模样，2021年已经过去，迎接崭新的2022，无论过去，不问将来。新的一年元旦快乐！！

一、Calendar 简介

1.1概述 Overview

  Calendar对象是一个经典的日历，它可以:
• 在一个7x7矩阵中显示任意月份的天数
• 显示日期的名称
•突出当前的一天(今天)
• 突出显示任何用户定义的日期
  Calendar被添加到默认组(如果设置了它)。此外，日历是一个可编辑的对象，允许选择和单击日期与编码器导航。
  为了使Calendar灵活，默认情况下它不显示当前的年或月。取而代之的是，可以附加到日历的外部“标题”区域。

1.2部分和风格 Parts and Styles

  calendar对象在其内部使用Button矩阵对象将日期安排到一个矩阵中。
• LV_PART_MAIN 日历的背景。它使用了所有与背景相关的样式属性。
• LV_PART_ITEMS指的是日期和日期的名称。设置按钮矩阵控件标志来区分按钮，并添加一个自定义
  折叠项事件来修改按钮的属性：
    日期名称没有边界，没有背景，用灰色绘制
    前一个月和下一个月的天数有LV_BTNMATRIX_CTRL_DISABLED标志
    今天有一个更厚的边框与主题的原色
    高亮的日子有一些不透明的主题原色。

1.3使用 Usage

  一些函数使用lv_calendar_date_t类型，这是一个带有年、月和日字段的结构。

1.3.1当前日期 Current date

  要设置当前日期(今天)，使用lv_calendar_set_today_date(calendar, year, month, day)函数。月需要在1…12
rangeand day in 1…31范围。

1.3.2高亮显示天数 Highlighted days

  高亮显示的日期列表应该存储在lv_calendar_date_t数组中，该数组由lv_calendar_set_highlighted_dates(calendar,highlighted_dates, date_num)加载。
  只有数组指针会被保存，因此数组应该是静态或全局变量。

1.3.3天的名称 Name of the days

  天数的名称可以用lv_calendar_set_day_names(calendar, day_names)调整，其中day_names看起来像const char *day_names[7] = {“Su”， “Mo”，…};只保存日期名称的指针，因此元素应该是静态、全局或常量变量。

1.4事件 Events

  LV_EVENT_VALUE_CHANGED表示单击数据。Lv_calendar_get_pressed_date (calendar， &date)告诉当前按下的是哪一天。如果有有效的按下的数据，返回LV_RES_OK，否则LV_RES_INV。

1.5按键 Keys

• LV_KEY_RIGHT/UP/LEFT/RIGHT在按钮之间导航到日期
• LV_KEY_ENTER 按下/释放选定日期

1.6页眉 Headers

1.6.1 箭头按键 Arrow buttons

  lv_calendar_header_arrow_crea te (pare nt, calend ar, button_size)创建一个页眉，页眉的两侧包含一个左右箭头，以及其中包含当前年份和月份的文本。

1.6.2 下拉 Drop-down

  Lv_calendar_header_dropdown_create (calendar)创建了一个包含2个下拉列表的标题
一年，一个月。

二、Calendar API

lv_obj_t * lv_calendar_create(lv_obj_t * parent);															//创建日历
void lv_calendar_set_today_date(lv_obj_t * obj, uint32_t year, uint32_t month, uint32_t day);				//设定今天的日期
void lv_calendar_set_showed_date(lv_obj_t * obj, uint32_t year, uint32_t month);							//设置当前显示
void lv_calendar_set_highlighted_dates(lv_obj_t * obj, lv_calendar_date_t highlighted[], uint16_t date_num);//设置突出显示的日期
void lv_calendar_set_day_names(lv_obj_t * obj, const char ** day_names);									//设置天的名称
lv_obj_t * lv_calendar_get_btnmatrix(const lv_obj_t * obj);													//获取日历的按钮矩阵对象
const lv_calendar_date_t * lv_calendar_get_today_date(const lv_obj_t * calendar);							//得到今天的日期
const lv_calendar_date_t * lv_calendar_get_showed_date(const lv_obj_t * calendar);							//获取当前显示的内容
lv_calendar_date_t * lv_calendar_get_highlighted_dates(const lv_obj_t * calendar);							//获取突出显示的日期
uint16_t lv_calendar_get_highlighted_dates_num(const lv_obj_t * calendar);									//获得突出显示的日期的数量
lv_res_t lv_calendar_get_pressed_date(const lv_obj_t * calendar, lv_calendar_date_t * date);				//获得按压数据
lv_obj_t * lv_calendar_header_dropdown_create(lv_obj_t * parent);											//创建一个日历标题，带有下拉框来选择年和月

三、示例

值得注意的是LVGL8 版本和8.1版本中的lv_calendar_header_dropdown_create(); 的这个API有些不同

3.1示例日历的基本显示

/*************************************************
 *  函数名称 :  calendar_event_handler
 *  参    数 ： 无
 *  函数功能 ： 日历回调显示
 *************************************************/
static void calendar_event_handler(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)){       //获取日期
         LV_LOG_USER("Click date:%02d.%02d.%d",date.day,date.month,date.year);
      }
   }
}
/*************************************************
 *  函数名称 :  Calendar_show
 *  参    数 ： 无
 *  函数功能 ： 日历显示
 *************************************************/
void Calendar_show()
{
   lv_obj_t * calendar = lv_calendar_create(lv_scr_act());  //创建日历对象
   lv_obj_set_size(calendar,185,185);                       //设置尺寸
   lv_obj_align(calendar,LV_ALIGN_CENTER,0,27);             //设置位置
   lv_obj_add_event_cb(calendar,calendar_event_handler,LV_EVENT_ALL,NULL); //设置回调函数

   lv_calendar_set_today_date(calendar,2022,01,01);         //设置今天日期
   lv_calendar_set_showed_date(calendar,2022,01);           //设置当前日期

   static lv_calendar_date_t highlighted_days[3];
   highlighted_days[0].year  = 2022;
   highlighted_days[0].month = 01;
   highlighted_days[0].day   = 01;

   highlighted_days[1].year  = 2022;
   highlighted_days[1].month = 01;
   highlighted_days[1].day   = 01;

   highlighted_days[2].year  = 2022;
   highlighted_days[2].month = 01;
   highlighted_days[2].day   = 01;

   lv_calendar_set_highlighted_dates(calendar,highlighted_days,3);   //设置高亮日期   
   lv_calendar_header_dropdown_create(lv_scr_act(),calendar);        //创建一个日历标题，带有下拉框来选择年和月 LVGL8.0 
//   lv_calendar_header_dropdown_create(calendar);        			//创建一个日历标题，带有下拉框来选择年和月 LVGL8.1 
   lv_calendar_set_showed_date(calendar,2022,01);                    //设置当前显示
}