Tabview and background

How-to
1

Description

when using tabview, buttons hidden, adding a background, everything shifts right and down, scroll bars are added
see example pic, I don’t have this issue on the splash screen I have at the start
images is 32x32 mosaic
I have the same issue if I add a graph and position at 0.0, I need to position at 5.5 to get rid of the shift&scrollbars
is there a setting ? there seems to be some border?

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

esp32 Arduino ide

IMG_3902
IMG_3902.JPG2592×1936 1.1 MB

What do you want to achieve?

What have you tried so far?

Code to reproduce

Add a code snippet which can run in the simulator. It should contain only the relevant code that compiles without errors when separated from your main code base.

The code block(s) should be formatted like:

/*You code here*/

Screenshot and/or video

If possible, add screenshots and/or videos about the current state.

2

Hello, I have had the same problem. There seems to be a 5 pix border or something around the edge. I just offset the x and y by 5 on all the button or images around the edge and that fixed it.

good luck.

3

Please send a code snippet as requested in the template.

4

this is the code that adds the background image to the tab

// lv_obj_t * img2 = lv_img_create(tabmain, NULL);
// lv_img_set_src(img2, &backg1);
// lv_obj_set_size(img2, 480, 320);
// lv_obj_set_pos(img2, 0, 0);

I get the same if I simply add a graph and position anywhere from 0,0 to 4,4, this is actually the demo code from the documentation

chart_ana1 = lv_chart_create(tabana1, NULL);
lv_obj_set_size(chart_ana1, 350, 250);
lv_obj_align(chart_ana1, NULL, LV_ALIGN_IN_TOP_LEFT, 0, 0);

lv_chart_set_type(chart_ana1, LV_CHART_TYPE_POINT | LV_CHART_TYPE_LINE); /Show lines and points too/
lv_chart_set_series_opa(chart_ana1, LV_OPA_70); /Opacity of the data series/
lv_chart_set_series_width(chart_ana1, 4); /Line width and point radious/

lv_chart_set_range(chart_ana1, 0, 100);

/Add two data series/
lv_chart_series_t * ser1 = lv_chart_add_series(chart_ana1, LV_COLOR_RED);
lv_chart_series_t * ser2 = lv_chart_add_series(chart_ana1, LV_COLOR_GREEN);

/Set the next points on ‘dl1’/
lv_chart_set_next(chart_ana1, ser1, 10);
lv_chart_set_next(chart_ana1, ser1, 10);
lv_chart_set_next(chart_ana1, ser1, 10);
lv_chart_set_next(chart_ana1, ser1, 10);
lv_chart_set_next(chart_ana1, ser1, 10);
lv_chart_set_next(chart_ana1, ser1, 10);
lv_chart_set_next(chart_ana1, ser1, 10);
lv_chart_set_next(chart_ana1, ser1, 30);
lv_chart_set_next(chart_ana1, ser1, 70);
lv_chart_set_next(chart_ana1, ser1, 90);

/Directly set points on ‘dl2’/
ser2->points[0] = 90;
ser2->points[1] = 70;
ser2->points[2] = 65;
ser2->points[3] = 65;
ser2->points[4] = 65;
ser2->points[5] = 65;
ser2->points[6] = 65;
ser2->points[7] = 65;
ser2->points[8] = 65;
ser2->points[9] = 65;

lv_chart_refresh(chart_ana1); /Required after direct set/

5

tabview code, nothing special

tabview = lv_tabview_create(lv_scr_act(), NULL);
lv_obj_t *tabmain = lv_tabview_add_tab(tabview, “”);
lv_obj_t *tabsetup = lv_tabview_add_tab(tabview, “”);
lv_obj_t *tabcalibtft = lv_tabview_add_tab(tabview, “”);
lv_obj_t *tabgen1 = lv_tabview_add_tab(tabview, “”);
lv_obj_t *tabgen2 = lv_tabview_add_tab(tabview, “”);
lv_obj_t *tabgen3 = lv_tabview_add_tab(tabview, “”);
lv_obj_t *tabswp1 = lv_tabview_add_tab(tabview, “”);
lv_obj_t *tabfm1 = lv_tabview_add_tab(tabview, “”);
lv_obj_t *tabpwr1 = lv_tabview_add_tab(tabview, “”);
lv_obj_t *tabana1 = lv_tabview_add_tab(tabview, “”);

lv_tabview_set_btns_hidden(tabview, true);

6

Your tabmain is a page widget.
You must set lv_page_set_style(...) to set padding value to 0
(such as padding_top, padding_left to 0 )

Learn more
lv_page_set_style(...)
https://docs.littlevgl.com/en/html/object-types/page.html#_CPPv417lv_page_set_styleP8lv_obj_t15lv_page_style_tPK10lv_style_t

and padding at
https://docs.littlevgl.com/en/html/overview/style.html#body-style-properties

2 Likes
7

thanks, got it sorted by using the padding properties, the scrollbar was still active and had to be disabled
2300 lines of code and still going…