How to fix calendar when touching date however mis-jumping to other month?


When touching for selecting date in the month on the calendar,
but sometime calendar sends mis-jumping signal and changes to other month. (as the following video)

How to fix this calendar’s mis-jumping ?
Thank you.

What MCU/Processor/Board and compiler are you using?

  • ESP32
  • lvgl 6.0.2

What do you want to achieve?

I don’t want the calendar occurs mis-jumping
to other month that doesn’t be clicked.

What have you tried so far?

Code to reproduce

static lv_style_t style_header;
static lv_style_t style_header_pr;
static lv_style_t style_day_names;
static lv_style_t style_bg;
static lv_style_t style_inactive;
static lv_style_t style_week_box;
static lv_style_t style_today_box;

void create_calendar(lv_color_t color){
  lv_obj_t *calendar = lv_calendar_create(lv_scr_act(),NULL);

  lv_calendar_date_t today = { 2019, 8, 21 };
  lv_calendar_set_today_date (calendar, &today);
  lv_calendar_set_showed_date(calendar, &today);
  lv_obj_set_event_cb(calendar, [](lv_obj_t *calendar, lv_event_t event){
    if(event == LV_EVENT_CLICKED ){
      lv_calendar_date_t* pr_date = lv_calendar_get_pressed_date(calendar);
      if(pr_date) {
        Serial.printf("clicked : %02d/%02d/%04d\n", pr_date->day, pr_date->month, pr_date->year);
        lv_calendar_set_today_date (calendar, pr_date);
        lv_calendar_set_showed_date(calendar, pr_date);

  lv_style_copy( &style_header,     lv_calendar_get_style(calendar, LV_CALENDAR_STYLE_HEADER));
  lv_style_copy( &style_header_pr,  lv_calendar_get_style(calendar, LV_CALENDAR_STYLE_HEADER_PR));
  lv_style_copy( &style_day_names,  lv_calendar_get_style(calendar, LV_CALENDAR_STYLE_DAY_NAMES));
  lv_style_copy( &style_bg,         lv_calendar_get_style(calendar, LV_CALENDAR_STYLE_BG));
  lv_style_copy( &style_inactive,   lv_calendar_get_style(calendar, LV_CALENDAR_STYLE_INACTIVE_DAYS));
  lv_style_copy( &style_week_box,   lv_calendar_get_style(calendar, LV_CALENDAR_STYLE_WEEK_BOX));
  lv_style_copy( &style_today_box,  lv_calendar_get_style(calendar, LV_CALENDAR_STYLE_TODAY_BOX));

  style_header.body.main_color    = color;
  style_header.body.grad_color    = color;
  style_header.text.font          = &lv_font_roboto_22;

  style_header_pr.body.main_color = color;
  style_header_pr.body.grad_color = color;
  style_header_pr.text.font       = &lv_font_roboto_22;

  style_day_names.text.font       = &lv_font_roboto_22;

  style_bg.text.font              = &lv_font_roboto_22;
  style_inactive.text.font        = &lv_font_roboto_22;

  style_week_box.body.main_color = lv_color_mix(color, LV_COLOR_WHITE, 160);
  style_week_box.body.grad_color = lv_color_mix(color, LV_COLOR_WHITE, 160);
  style_week_box.text.font       = &lv_font_roboto_22;

  style_today_box.body.main_color = color;
  style_today_box.body.grad_color = lv_color_mix(color, LV_COLOR_BLACK, 128);
  style_today_box.text.font       = &lv_font_roboto_22;

  lv_calendar_set_style(calendar, LV_CALENDAR_STYLE_HEADER,       &style_header);
  lv_calendar_set_style(calendar, LV_CALENDAR_STYLE_HEADER_PR,    &style_header_pr);
  lv_calendar_set_style(calendar, LV_CALENDAR_STYLE_DAY_NAMES,    &style_day_names);
  lv_calendar_set_style(calendar, LV_CALENDAR_STYLE_BG,           &style_bg);
  lv_calendar_set_style(calendar, LV_CALENDAR_STYLE_INACTIVE_DAYS,&style_inactive);
  lv_calendar_set_style(calendar, LV_CALENDAR_STYLE_WEEK_BOX,     &style_week_box);
  lv_calendar_set_style(calendar, LV_CALENDAR_STYLE_TODAY_BOX,    &style_today_box);


Screenshot and/or video

Current showed month is set to August 2019.
At 00:08 on the video occurs mis-jumping to July 2019

What does the Serial.printf line output when it fails? Is it the same date that you clicked or a date in July?

When it fails, pr_date is NULL .
Then Serial.printf 's output doesn’t show anything.

Could it be a touchpad issue? Can you print all the read data in your touch_read function?

I use touch function from TFT_eSPI library.
The touchpad_read function is the following code.

static bool touchpad_read(lv_indev_drv_t * indev_drv, lv_indev_data_t * data)
//    static TP_Point p;
    uint16_t t_x = 0, t_y = 0;

    /*Save the pressed coordinates and the state*/
    if(_tft->getTouch(&t_x, &t_y)) {
        data->state = LV_INDEV_STATE_PR;
    } else {
        data->state = LV_INDEV_STATE_REL;

    /*Set the last pressed coordinates*/
    data->point.x = t_x;
    data->point.y = t_y;

    /*Return `false` because we are not buffering and no more data to read*/
    return false;

checkout this thread

there might be something useful in this thread

You should save the last pressed coordinate and use it as released. Or do not set the coordinates when the TP is released. For example:

   /*Save the pressed coordinates and the state*/
    if(_tft->getTouch(&t_x, &t_y)) {
        data->state = LV_INDEV_STATE_PR;
        /*Set the last pressed coordinates*/
        data->point.x = t_x;
        data->point.y = t_y;
    } else {
        data->state = LV_INDEV_STATE_REL;
1 Like

Issue is solved!
Thank you.

How to writing the touch pad driver and using it? I get it a little from the post.

Please open a new How-to post and fill out the template.