How to create sub menus in Complex menus

How-to
1

Description

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

ESP32-S3 PlatformIO

What LVGL version are you using?

8.4

What do you want to achieve?

I like to create sub menus in the sidebar of a complex menu. My code is based on the complex menu example. I like the sidebar menu to behave like in the simple menu example with several sub menus.

What have you tried so far?

I use to update the main page (right)
lv_menu_set_load_page_event(menuObj, menuEntry, subPage);

and
lv_obj_add_event_cb(menuEntry, menuClick_cb, LV_EVENT_CLICKED, userData);
to register a callback when an item is clicked

Inside the callback I use
lv_menu_set_sidebar_page(menuObj, subMenuPage);
to update the sidebar (left)

But then the sub menu is added to the sidebar from below and does NOT replace the current menu and does not add a back button.

I can clear the sidebar first and then add the sub menu
lv_menu_set_sidebar_page(menuObj, NULL);
but this kills the back button functionality.

My question

How to update the main page (right) AND the sidebar menu (left) at the same time if an item in the sidebar is clicked.

Code to reproduce

No code yet

2

Hi @Christian-Me,

To update the main page, you need to create a trigger (event) to update the menu list.
In official documentation ([Menu](Menu (lv_menu) — LVGL documentation?
highlight=menu)) There is an example.

Here is the code needed to create a new item, just as you can remove one.

    lv_obj_t * sub_page = lv_menu_page_create(menu, NULL);
    lv_obj_t * cont = lv_menu_cont_create(sub_page);
    lv_obj_t * label = lv_label_create(cont);
    lv_label_set_text_fmt(label, "Bla bla bla");

    cont = lv_menu_cont_create(main_page);
    label = lv_label_create(cont);
    lv_label_set_text_fmt(label, "Item %"LV_PRIu32, btn_cnt);
    lv_menu_set_load_page_event(menu, cont, sub_page);