Description
Identify state of object to remove outline
What MCU/Processor/Board and compiler are you using?
esp32
What LVGL version are you using?
8.3 simulator
What do you want to achieve?
i want to use grid layout. In screen there are some area from all sides (few pixels) that remain white while i have applied background,eliminated padding and border.
What have you tried so far?
I have a screen created by lv_obj_create(NULL) in which i have created a container to use grid layout that covers the size of the screen, it has also transparent background, no padding , no border.
Between the main container and the edge of the screen there are some pixels width that stay white and i can not remove them or find them in order to remove or set transparent.
After making the container smaller than the screen it is somehow obvious that this is the outline of the container.
At that point i can say that i have tried to set outline width to 0 or change the color to identify that this is really the problem but it did not worked. I assume this is cause of the selector when i add the style to the screen.
The selector is LV_PART_MAIN | LV_STATE_DEFAULT but is probably not ok.
In another part of program that i was trying to create a button the same issue on hidding the outline existed and i have found that this “set_outline_width” function in style has to be set in LV_STATE_FOCUSED_KEY in button to remove the outline either if the button is not even selected , just when screen is loaded.
So how can i identify the Proper state to remove the outline?
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:
---- main function
ui=(ui_t){
.main_page = lv_obj_create(NULL),
.settings_page = lv_obj_create(NULL),
}
lv_obj_set_size(ui.main_page, 480, 320);
str_set_mv_backgourd();
str_init_mv_layout()
lv_scr_load(ui.main_page);
-------------------
void str_set_mv_backgourd(){
static lv_style_t bg_style;
lv_style_init(&bg_style);
lv_style_set_border_width(&bg_style, 0);
lv_style_set_pad_all(&bg_style, 0);
lv_style_set_outline_pad(&bg_style, 0);
lv_style_set_outline_width(&bg_style, 0);
lv_style_set_radius(&bg_style, 0);
lv_style_set_bg_color(&bg_style, lv_palette_darken(LV_PALETTE_BLUE,4));
lv_style_set_bg_grad_color(&bg_style, lv_color_black());
lv_style_set_bg_grad_dir(&bg_style, LV_GRAD_DIR_HOR);
lv_obj_add_style(ui.main_page, &bg_style, LV_PART_MAIN | LV_STATE_DEFAULT);
}
void str_init_mv_layout(){
static lv_coord_t row_dsc[] = {40, LV_GRID_FR(1), 75, LV_GRID_TEMPLATE_LAST};
static lv_coord_t col_dsc[] = {LV_GRID_FR(1), 140, 140, LV_GRID_TEMPLATE_LAST};
static lv_style_t layout_style;
lv_style_init(&layout_style);
lv_style_set_width(&layout_style, 480);
lv_style_set_height(&layout_style, 320);
lv_style_set_radius(&layout_style, 0);
lv_style_set_pad_all(&layout_style, 0);
lv_style_set_bg_opa(&layout_style, LV_OPA_TRANSP);
static lv_style_t layout_cell_style;
lv_style_init(&layout_cell_style);
lv_style_set_pad_all(&layout_cell_style, 0);
lv_obj_t * cont = lv_obj_create(ui.main_page);
lv_obj_add_style(cont, &layout_style, LV_PART_MAIN | LV_STATE_DEFAULT);
lv_obj_set_grid_dsc_array(cont, col_dsc, row_dsc);
lv_obj_set_grid_align(cont, LV_GRID_ALIGN_SPACE_EVENLY, LV_GRID_ALIGN_SPACE_EVENLY);
lv_obj_center(cont);
lv_obj_t * header = lv_obj_create(cont);
lv_obj_set_size(header, LV_SIZE_CONTENT, LV_SIZE_CONTENT);
lv_obj_add_style(header, &layout_cell_style, LV_PART_MAIN | LV_STATE_DEFAULT);
lv_obj_set_grid_cell(header, LV_GRID_ALIGN_STRETCH, 0, 3, LV_GRID_ALIGN_STRETCH, 0, 1);
lv_obj_t * a_grid = lv_obj_create(cont);
lv_obj_set_size(f_grid, LV_SIZE_CONTENT, LV_SIZE_CONTENT);
lv_obj_set_grid_cell(f_grid, LV_GRID_ALIGN_STRETCH, 0, 1, LV_GRID_ALIGN_STRETCH, 1, 1);
lv_obj_t * b_grid = lv_obj_create(cont);
lv_obj_set_size(b_grid, LV_SIZE_CONTENT, LV_SIZE_CONTENT);
lv_obj_set_grid_cell(b_grid, LV_GRID_ALIGN_STRETCH, 1, 1, LV_GRID_ALIGN_STRETCH, 1, 1);
lv_obj_t * c_grid = lv_obj_create(cont);
lv_obj_set_size(c_grid, LV_SIZE_CONTENT, LV_SIZE_CONTENT);
lv_obj_set_grid_cell(c_grid, LV_GRID_ALIGN_STRETCH, 2, 1, LV_GRID_ALIGN_STRETCH, 1, 1);
lv_obj_t * footer = lv_obj_create(cont);
lv_obj_set_size(footer, LV_SIZE_CONTENT, LV_SIZE_CONTENT);
lv_obj_set_grid_cell(footer, LV_GRID_ALIGN_STRETCH, 0, 3, LV_GRID_ALIGN_STRETCH, 2, 1);
}
typedef struct {
lv_obj_t* main_page;
lv_obj_t* settings_page;
}ui_t;
Screenshot and/or video
I am placing 2 printscreens. One has 2 different runs with and without background. The other is just the problem marked.
