Description
I am using a rotary encoder to navigate a group of buttons and a tabview. I like to highlight the outline of entire group of tabs of a tabview when the encoder focus goes there by making all the lines thicker and changing the background color.
What MCU/Processor/Board and compiler are you using?
Atmel ARM Cortex M7, GCC
What LVGL version are you using?
8.3
What do you want to achieve?
Make all the lines of a tabview thick when the focus state is on the whole group of tabs.
What have you tried so far?
I managed to make one tab of a time of the group get highlighted when I already selected the whole tabview and rotate the encoder. I can’t seem to find out how to get the below code fragment to highlight the whole tabview when my encoder goes from the buttons to the tabview. I tried all kinds of variations for the first and third arguments of the below function with no success.
lv_obj_set_style_border_width( (mainTabView), 6, LV_PART_MAIN | LV_STATE_FOCUSED |LV_STATE_FOCUS_KEY);
Code to reproduce
I posted the code below. It needs an embedded system with the encoder installed to work.
lv_obj_t *mainTabView = lv_tabview_create(lv_scr_act(), NULL);
/*Add 3 tabs (the tabs are page (lv_page) and can be scrolled*/
lv_obj_t *tab1 = lv_tabview_add_tab(mainTabView, "Tab 1");
lv_obj_t *tab2 = lv_tabview_add_tab(mainTabView, "Tab 2");
lv_obj_t *tab3 = lv_tabview_add_tab(mainTabView, "Tab 3");
/*Add content to the tabs*/
lv_obj_t * label = lv_label_create(tab1, NULL);
lv_label_set_text(label, "First tab");
label = lv_label_create(tab2, NULL);
lv_label_set_text(label, "Second tab");
label = lv_label_create(tab3, NULL);
lv_label_set_text(label, "Third tab");
lv_obj_set_style_bg_color( (mainTabView), lv_color_hex(0xf5f5f5), LV_PART_MAIN | LV_STATE_DEFAULT);
lv_obj_set_style_bg_color(lv_tabview_get_tab_btns(mainTabView), lv_color_hex(0xd3e6f6), LV_PART_ITEMS | LV_STATE_DEFAULT);
lv_obj_set_style_text_color(lv_tabview_get_tab_btns(mainTabView), lv_color_hex(0x000000), LV_PART_ITEMS | LV_STATE_DEFAULT);
lv_obj_set_style_bg_opa(lv_tabview_get_tab_btns(mainTabView), LV_OPA_COVER, LV_PART_ITEMS | LV_STATE_DEFAULT);
lv_obj_set_style_border_side(lv_tabview_get_tab_btns(mainTabView),LV_BORDER_SIDE_RIGHT|LV_BORDER_SIDE_LEFT |LV_BORDER_SIDE_BOTTOM|LV_BORDER_SIDE_TOP, LV_PART_ITEMS | LV_STATE_DEFAULT);
lv_obj_set_style_border_width(lv_tabview_get_tab_btns(mainTabView), 1, LV_PART_ITEMS | LV_STATE_DEFAULT);
lv_obj_set_style_border_color(lv_tabview_get_tab_btns(mainTabView), lv_color_hex(0x000000), LV_PART_ITEMS | LV_STATE_DEFAULT);
lv_obj_set_style_bg_color(lv_tabview_get_tab_btns(mainTabView), lv_color_hex(0xf5f5f5), LV_PART_ITEMS | LV_STATE_CHECKED);
lv_obj_set_style_text_color(lv_tabview_get_tab_btns(mainTabView), lv_color_hex(0x000000), LV_PART_ITEMS | LV_STATE_CHECKED);
lv_obj_set_style_bg_opa(lv_tabview_get_tab_btns(mainTabView), LV_OPA_COVER, LV_PART_ITEMS | LV_STATE_CHECKED);
lv_obj_set_style_border_side(lv_tabview_get_tab_btns(mainTabView),LV_BORDER_SIDE_RIGHT|LV_BORDER_SIDE_LEFT |LV_BORDER_SIDE_TOP, LV_PART_ITEMS | LV_STATE_CHECKED);
lv_obj_set_style_border_width(lv_tabview_get_tab_btns(mainTabView), 1, LV_PART_ITEMS | LV_STATE_CHECKED);
lv_obj_set_style_border_color(lv_tabview_get_tab_btns(mainTabView), lv_color_hex(0x000000), LV_PART_ITEMS | LV_STATE_CHECKED);
lv_obj_set_style_text_color(lv_tabview_get_tab_btns(mainTabView), lv_color_hex(0x808080), LV_PART_ITEMS | LV_STATE_FOCUSED |LV_STATE_FOCUS_KEY);
lv_obj_set_style_border_width(lv_tabview_get_tab_btns(mainTabView), 6, LV_PART_ITEMS | LV_STATE_FOCUSED |LV_STATE_FOCUS_KEY);
lv_obj_set_style_border_color(lv_tabview_get_tab_btns(mainTabView), lv_color_hex(0x808080), LV_PART_ITEMS | LV_STATE_FOCUSED |LV_STATE_FOCUS_KEY);