Align widgets in button

How-to
1

Description

I’m new to LVGL and I’m trying to draw a button with n widgets inside.
I have a code that partially works. Indeed, in the example, it is not possible to click anywhere on the button.
Do you have a solution or an example to achieve this?

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

SDL

What LVGL version are you using?

v8.2

What do you want to achieve?

I’m trying to draw a button with n widgets center inside.

Code to reproduce

    lv_obj_t * btn1 = lv_btn_create(lv_scr_act());
    lv_obj_center(btn1);
    lv_obj_set_size(btn1, 200, 200);

    lv_obj_t * layout = lv_obj_create(btn1);
    lv_obj_remove_style_all(layout);
    lv_obj_set_style_bg_opa(layout, LV_OPA_TRANSP, LV_STATE_DEFAULT);

    lv_obj_t * title = lv_label_create(layout);
    lv_label_set_text(title, "Title");
    lv_obj_t * sep = lv_obj_create(layout);
    lv_obj_set_size(sep, lv_pct(90), 1);
    lv_obj_set_style_bg_color(sep, LV_COLOR_MAKE(255, 0, 0), LV_STATE_DEFAULT);
    lv_obj_t * sub_title = lv_label_create(layout);
    lv_label_set_text(sub_title, "Subtitle");
    lv_obj_center(sep);
    lv_obj_align_to(title, sep, LV_ALIGN_OUT_TOP_MID, 0, -10);
    lv_obj_align_to(sub_title, sep, LV_ALIGN_OUT_BOTTOM_MID, 0, 10);
    lv_obj_center(layout);

Screenshot and/or video

Example