LVGL扩大按钮点击范围

这是一个很常见的需求，取决于UI设计，按钮太小，用户可点击的区域就小，对于一些手指比较大的用户就会提出这样的一些需求，扩大按钮的点击区域。

在LVGL中，有现成的接口直接可以使用。

//LVGL7
void lv_obj_set_ext_click_area(lv_obj_t * obj, lv_coord_t left, lv_coord_t right, lv_coord_t top, lv_coord_t bottom);

//LVGL8
void lv_obj_set_ext_click_area(lv_obj_t * obj, lv_coord_t size);

LVGL7版本，可以对上下左右的点击区域分别做扩充，但是LVGL8版本就直接简化成对四个方向统一扩充一样的单位。

炬芯平台使用的LVGL版本是8.3，现在有个按钮只需要加大上下方向的点击范围，LVGL提供的接口用不了，就有点难受了。

那怎么办，只能自己实现了(这里简单的提供下思路，仅供参考)。

1.增加一个接口，判断用户点击的范围是否在扩充的位置上

#define EXTEND_SIZE  (20)

static void btn_is_press(lv_obj_t *obj, lv_point_t *point)
{
    // 获取对象的绝对坐标和尺寸
    lv_coord_t obj_x = lv_obj_get_x(obj);
    lv_coord_t obj_y = lv_obj_get_y(obj);
    lv_coord_t obj_width = lv_obj_get_width(obj);
    lv_coord_t obj_height = lv_obj_get_height(obj);
    //printf("BTN x,y = %d,%d w,h = %d,%d\n", obj_x, obj_y, obj_width, obj_height);
    

    // 上下扩展区域大小设置
    lv_coord_t top_extend = EXTEND_SIZE;
    lv_coord_t bottom_extend = EXTEND_SIZE;

    // 判断点击是否在扩展后的上下区域内
    if ((point->x >= obj_x) && (point->x <= obj_x + obj_width)  // X轴在按钮宽度内
        && (point->y >= obj_y - top_extend) && (point->y <= obj_y + obj_height + bottom_extend))   // Y轴扩展上下
    {
        // 触发按钮点击事件
        lv_event_send(obj, LV_EVENT_CLICKED, NULL);
    }
}

2.页面增加点击回调函数

#define BTN_Y_START   (300)
#define BTN_Y_END     (360)

static void page_event_handler(lv_event_t * e)
{
    lv_point_t point;
    lv_indev_t *indev = lv_indev_get_act();

    // 获取当前点击坐标
    lv_indev_get_point(indev, &point);  
    //printf("Click x = %d, y = %d\n",point.x, point.y);

    //与按钮坐标对比
    if( point.y >= (BTN_Y_START - EXTEND_SIZE) 
        &&  point.y <= (BTN_Y_END + EXTEND_SIZE) )
    {
        btn_is_press(page->btn, &point);
    }
}


void page_show(lv_obj_t *scr)
{
    ...
    lv_obj_add_flag(scr, LV_OBJ_FLAG_CLICKABLE);
    lv_obj_add_event_cb(scr, page_event_handler, LV_EVENT_SHORT_CLICKED, NULL);
    ...
}

通过给页面增加点击回调函数来判断当前用户点击的坐标，跟按钮扩充后的点击范围做对比，在点击范围内，手动触发按钮回调事件。