How to disable outlining when you touch a button

How-to
,
1

Description

Shifts to the focus state when the button is touched.
A red outline will appear in the focus state to indicate that it is active.
I’d rather know how to disable them.

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

ESP32 , VScode+PlatformIO ,

What LVGL version are you using?

V7

What do you want to achieve?

I want to know how to prevent the red outline from appearing.
I’m not sure if that’s a change in style or a way of not being focused on…

What have you tried so far?

I tried changing the style.
As a result, the outline is displayed when the focus transitions.

Code to reproduce

//button setting
  obj_btn_A = lv_btn_create(footer, NULL);
  lv_obj_t * btn_A_label = lv_label_create(obj_btn_A, NULL);
  lv_label_set_text(btn_A_label, D_TEXT_footer1_BTN1);
  lv_obj_set_size(obj_btn_A, D_LCTD_SCREENWIDTH/3-1, 25);
  lv_obj_set_pos(obj_btn_A,2,5);
  lv_obj_set_event_cb(obj_btn_A, footer_btn_event_handler);
  //lv_obj_set_style(obj_btn_L, &lv_style_plain_color);

  static lv_style_t footer_btn_style;
  lv_style_init(&footer_btn_style);
  lv_style_set_bg_color(&footer_btn_style, LV_STATE_DEFAULT, LV_COLOR_WHITE);
  lv_style_set_bg_color(&footer_btn_style, LV_STATE_PRESSED, lv_color_make(98,185,142));
  lv_style_set_border_color(&footer_btn_style, LV_STATE_DEFAULT, LV_COLOR_GREEN);
  lv_style_set_border_color(&footer_btn_style, LV_STATE_PRESSED, LV_COLOR_GREEN);
  lv_style_set_outline_width(&footer_btn_style, LV_STATE_FOCUSED, 0);
  lv_obj_add_style(obj_btn_A, LV_BTN_PART_MAIN, &footer_btn_style);

Screenshot and/or video

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

2

Hi @WanakaWanaka,

I think the following will give you the desired outcome:

lv_obj_add_protect(obj_btn_A, LV_PROTECT_CLICK_FOCUS);

Kind Regards,

Pete

2 Likes
3

Thanks,@pete-pjb.
That code solved a lot of my problems.

1 Like