Set group focus to new object

Description

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

ESP32 lvgl v6

What do you want to achieve?

Hi All , i want to set focus to newly created object. I have a six buttons and my goal is to fade buttons,
except selected.

What have you tried so far?

I tried to create new object that “covers” buttons with alpha, and then to create desired button over the new object. My problem is that i cant set focus to newly created button and gndbtn_a_event_cb(…) cant be executed.

Code to reproduce

main.c

lv_disp_drv_t disp_drv;
	lv_disp_drv_init(&disp_drv);
	disp_drv.flush_cb = ili9341_flush;
	disp_drv.buffer = &disp_buf;
	lv_disp_drv_register(&disp_drv);
	
	lv_indev_t * enc_main_indev;
	lv_indev_drv_t indev_main;
	lv_indev_drv_init(&indev_main);
	indev_main.read_cb = rot_enc_get_data;
	indev_main.type = LV_INDEV_TYPE_ENCODER;
	enc_main_indev = lv_indev_drv_register(&indev_main);
    g = lv_group_create ();
    lv_indev_set_group (enc_main_indev, g);

    ui_create(g);
	esp_register_freertos_tick_hook(lv_tick_task);

main_ui.c

void ui_create (lv_group_t * g)
{
.......
  gndbtn = lv_imgbtn_create (lv_scr_act (), NULL);
  lv_obj_set_pos (gndbtn, 10, 90);
  lv_imgbtn_set_src(gndbtn, LV_BTN_STATE_REL, &gnd_img);
  lv_imgbtn_set_src(gndbtn, LV_BTN_STATE_PR, &gnd_toggle_img);
  lv_imgbtn_set_src(gndbtn, LV_BTN_STATE_TGL_REL, &gnd_toggle_img);
  lv_imgbtn_set_src(gndbtn, LV_BTN_STATE_TGL_PR, &gnd_toggle_img);
  lv_obj_set_event_cb(gndbtn, event_handler_gnd);
  lv_group_add_obj (g, gndbtn);
........

first button callback code

static void event_handler_gnd(lv_obj_t * obj, lv_event_t event)
{
	printf("GND Event :%d \n",event);
	static lv_style_t modal_style;
	lv_obj_t *bobj;
    lv_obj_t *gndbtn_a=NULL;

	switch (event)
	{
			case LV_EVENT_FOCUSED:
					 lv_imgbtn_set_src(gndbtn, LV_BTN_STATE_REL, &gnd_toggle_img);
					 break;
			case LV_EVENT_DEFOCUSED:
					 lv_imgbtn_set_src(gndbtn, LV_BTN_STATE_REL, &gnd_img);
					 break;
			case LV_EVENT_CLICKED:
				   ;;
				     break;
			case LV_EVENT_VALUE_CHANGED:
					lv_style_copy(&modal_style, &lv_style_plain_color);
					modal_style.body.main_color = modal_style.body.grad_color = LV_COLOR_BLACK;
					modal_style.body.opa = LV_OPA_50;
					bobj = lv_obj_create(lv_scr_act(), NULL);
					lv_obj_set_style(bobj, &modal_style);
					lv_obj_set_pos(bobj, 10, 90);
					lv_obj_set_size(bobj, 240, 145);
					lv_obj_set_opa_scale_enable(bobj, true); 
					gndbtn_a = lv_imgbtn_create (bobj, NULL);
					lv_obj_set_pos (gndbtn_a, 0, 0);
					lv_imgbtn_set_src(gndbtn_a, LV_BTN_STATE_REL, &gnd_img);
					lv_obj_set_event_cb(gndbtn_a, gndbtn_a_event_cb);
					lv_group_focus_obj(gndbtn_a);								 
				    break;
					 
	}
	
}

New button callback

static void gndbtn_a_event_cb(lv_obj_t *obj, lv_event_t evt)
{
	if(evt == LV_EVENT_VALUE_CHANGED){
			lv_obj_del_async(lv_obj_get_parent(gndbtn_a));
		gndbtn_a = NULL; 
	}
}

To fade the button you can use the style.body.opa property. Learn more about the style:

To manually focus on an object you can use lv_group_focus_obj.

Thanks ! I did it.

1 Like