How do I make a component clickable?

How-to
1

Description

In the lv_demo_printer.c file, I tried to rebuild the component in the scan1_open function, but can’t click, please see the code,tks

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

visual_studio

What LVGL version are you using?

V7.6.0

What do you want to achieve?

I want to make a component clickable in the scan1_open function

What have you tried so far?

lv_obj_set_click

Code to reproduce

/*You code here*/
static void scan1_open(const char * btn_txt)
{
    lv_demo_printer_anim_out_all(lv_scr_act(), 0);

    lv_demo_printer_anim_bg(0, LV_DEMO_PRINTER_BLUE, LV_DEMO_PRINTER_BG_NORMAL);

    uint32_t delay = 200;

    lv_obj_t * back = add_back(back_to_home_event_cb);
    lv_obj_t* list = add_list(NULL);
    lv_demo_printer_anim_in(back, delay);

    lv_obj_t* title = add_update("LVGL Study Test Demo", lv_usr_search_event_cb);
    lv_demo_printer_anim_in(title, delay);
    delay += LV_DEMO_PRINTER_ANIM_DELAY;

#if 0
    LV_IMG_DECLARE(lv_demo_printer_img_scan_example);
    scan_img = lv_img_create(lv_scr_act(), NULL);
    lv_img_set_src(scan_img, &lv_demo_printer_img_scan_example);
    lv_obj_align(scan_img, NULL, LV_ALIGN_IN_TOP_LEFT, 40, 100);
    lv_obj_set_style_local_radius(scan_img, LV_IMG_PART_MAIN, LV_STATE_DEFAULT, 10);
    lv_obj_set_style_local_clip_corner(scan_img, LV_IMG_PART_MAIN, LV_STATE_DEFAULT, true);
    lv_obj_set_style_local_image_recolor_opa(scan_img, LV_IMG_PART_MAIN, LV_STATE_DEFAULT, 80);
#endif

#define OBJ_LIST_SIZE_X 410
#define OBJ_LIST_SIZE_Y 345

#if 1
    lv_obj_t *obj_list = lv_page_create(lv_scr_act(), NULL);
    lv_obj_set_size(obj_list, OBJ_LIST_SIZE_X, OBJ_LIST_SIZE_Y);
    lv_obj_align(obj_list, NULL, LV_ALIGN_IN_TOP_LEFT, 40, 100);    //F2F6FC
    //lv_obj_set_click(lv_page_get_scrl(obj_list), true);
    //lv_obj_move_background(obj_list);
    lv_obj_set_style_local_bg_color(obj_list, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, lv_color_hex(0xDCDFE6));
    lv_obj_set_style_local_bg_opa(obj_list, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, LV_OPA_80);
    lv_obj_set_style_local_radius(obj_list, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, 2);
#else
    lv_obj_t* obj_list = lv_obj_create(lv_scr_act(), NULL);
    lv_obj_set_size(obj_list, OBJ_LIST_SIZE_X, OBJ_LIST_SIZE_Y);
    lv_obj_align(obj_list, NULL, LV_ALIGN_IN_TOP_LEFT, 40, 100);    //F2F6FC
    lv_obj_set_style_local_bg_color(obj_list, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, lv_color_hex(0xDCDFE6));
#endif

#define OBJ_SUB_SIZE_X  100
#define OBJ_SUB_SIZE_Y  100
#define SUB_COUNT_X 3
#define SUB_COUNT_Y 3

#define OBJ_SUB_X_OFS(a,b,c,d)    ((a-b*c-d*2)/2)
#define OBJ_SUB_Y_OFS(a,b,c)    ((a-b*c)/(c+1))

    uint8_t obj_sub_y_ofs = OBJ_SUB_Y_OFS(OBJ_LIST_SIZE_Y, OBJ_SUB_SIZE_Y, SUB_COUNT_Y);
    uint8_t obj_sub_x_ofs = OBJ_SUB_Y_OFS(OBJ_LIST_SIZE_X, OBJ_SUB_SIZE_X, SUB_COUNT_X);

    //uint8_t obj_sub_x_ofs = OBJ_SUB_X_OFS(OBJ_LIST_SIZE_X, OBJ_SUB_SIZE_X, SUB_COUNT_X, obj_sub_y_ofs);

    printf(">> obj_sub_x_ofs: %d\r\n    obj_sub_y_ofs: %d\r\n", obj_sub_x_ofs, obj_sub_y_ofs);

    lv_obj_t* obj_sub1 = lv_obj_create(obj_list, NULL);
    //lv_obj_reset_style_list(obj_sub1,LV_OBJ_PART_MAIN);
    //lv_obj_move_foreground(obj_sub1);
    lv_obj_set_click(obj_sub1,true);
    lv_obj_set_size(obj_sub1, OBJ_SUB_SIZE_X, OBJ_SUB_SIZE_Y);
    lv_obj_align(obj_sub1, NULL, LV_ALIGN_IN_TOP_LEFT, obj_sub_x_ofs, obj_sub_y_ofs);
    //lv_obj_set_style_local_radius(obj_sub1, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, 1);
    //lv_obj_set_style_local_bg_opa(obj_sub1, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, LV_OPA_50);
    lv_obj_set_style_local_radius(obj_sub1, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, 10);
    //lv_obj_set_style_local_bg_color(obj_sub1, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, LV_COLOR_BLUE);

    lv_obj_t* obj_sub2 = lv_obj_create(obj_list, obj_sub1);
    lv_obj_align(obj_sub2, obj_sub1, LV_ALIGN_OUT_RIGHT_MID, obj_sub_x_ofs, 0);

    lv_obj_t* obj_sub3 = lv_obj_create(obj_list, obj_sub1);
    lv_obj_align(obj_sub3, obj_sub2, LV_ALIGN_OUT_RIGHT_MID, obj_sub_x_ofs, 0);

#if 1
    //--------
    lv_obj_t* obj_sub4 = lv_obj_create(obj_list, obj_sub1);
    lv_obj_align(obj_sub4, obj_sub1, LV_ALIGN_OUT_BOTTOM_MID, 0, obj_sub_y_ofs);

    lv_obj_t* obj_sub5 = lv_obj_create(obj_list, obj_sub1);
    lv_obj_align(obj_sub5, obj_sub4, LV_ALIGN_OUT_RIGHT_MID, obj_sub_x_ofs, 0);

    lv_obj_t* obj_sub6 = lv_obj_create(obj_list, obj_sub1);
    lv_obj_align(obj_sub6, obj_sub5, LV_ALIGN_OUT_RIGHT_MID, obj_sub_x_ofs, 0);

    //--------
    lv_obj_t* obj_sub7 = lv_obj_create(obj_list, obj_sub1);
    lv_obj_align(obj_sub7, obj_sub4, LV_ALIGN_OUT_BOTTOM_MID, 0, obj_sub_y_ofs);

    lv_obj_t* obj_sub8 = lv_obj_create(obj_list, obj_sub1);
    lv_obj_align(obj_sub8, obj_sub7, LV_ALIGN_OUT_RIGHT_MID, obj_sub_x_ofs, 0);

    lv_obj_t* obj_sub9 = lv_obj_create(obj_list, obj_sub1);
    lv_obj_align(obj_sub9, obj_sub8, LV_ALIGN_OUT_RIGHT_MID, obj_sub_x_ofs, 0);

    //--------
    lv_obj_t* obj_sub10 = lv_obj_create(obj_list, obj_sub1);
    lv_obj_align(obj_sub10, obj_sub7, LV_ALIGN_OUT_BOTTOM_MID, 0, obj_sub_y_ofs);

    lv_obj_t* obj_sub11 = lv_obj_create(obj_list, obj_sub1);
    lv_obj_align(obj_sub11, obj_sub10, LV_ALIGN_OUT_RIGHT_MID, obj_sub_x_ofs, 0);

    lv_obj_t* obj_sub12 = lv_obj_create(obj_list, obj_sub1);
    lv_obj_align(obj_sub12, obj_sub11, LV_ALIGN_OUT_RIGHT_MID, obj_sub_x_ofs, 0);

#endif

    lv_demo_printer_anim_in(obj_list, delay);
    delay += LV_DEMO_PRINTER_ANIM_DELAY;

    lv_obj_t * next_btn = lv_btn_create(lv_scr_act(), NULL);
    lv_theme_apply(next_btn, (lv_theme_style_t)LV_DEMO_PRINTER_THEME_BTN_CIRCLE);
    lv_obj_set_size(next_btn, 160, 60);
    lv_obj_align(next_btn, NULL, LV_ALIGN_OUT_RIGHT_BOTTOM, 40, 0);
    if(strcmp(btn_txt, "NEXT") == 0) {
        lv_obj_set_event_cb(next_btn, scan_next_event_cb);
        lv_obj_set_style_local_value_str(next_btn, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, "NEXT");
        lv_obj_set_style_local_value_font(next_btn, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, lv_theme_get_font_subtitle());
    } else if(strcmp(btn_txt, "SAVE") == 0) {
        lv_obj_set_event_cb(next_btn, scan_save_event_cb);
        lv_obj_set_style_local_value_str(next_btn, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, "SAVE");
        lv_obj_set_style_local_value_font(next_btn, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, lv_theme_get_font_subtitle());
        lv_obj_set_style_local_bg_color(next_btn, LV_OBJ_PART_MAIN, LV_STATE_DEFAULT, LV_DEMO_PRINTER_GREEN);
        lv_obj_set_style_local_bg_color(next_btn, LV_OBJ_PART_MAIN, LV_STATE_PRESSED, lv_color_darken(LV_DEMO_PRINTER_GREEN, LV_OPA_20));

    }

    lv_demo_printer_anim_in(scan_img, delay);
    delay += LV_DEMO_PRINTER_ANIM_DELAY;

    //lv_demo_printer_anim_in(settings_box, delay);
    //delay += LV_DEMO_PRINTER_ANIM_DELAY;

    lv_demo_printer_anim_in(next_btn, delay);
    delay += LV_DEMO_PRINTER_ANIM_DELAY;
}

Screenshot and/or video

objdisclick
objdisclick800×510 9.88 KB

2

You also need to set a callback function to be executed when the click happens.

        lv_obj_set_click(obj_sub1, true);
        lv_obj_set_event_cb(obj_sub1, my_obj_sub1_event_cb);
3

Do you mean to change the click effect in the form of callback?It is possible to run Page and OBj directly without lv_demo_PRINTER, which I guess is related to theme Settings

obj
obj801×510 4.15 KB
obj1
obj1769×718 14.6 KB
obj2
obj2597×535 5.78 KB