Create a menu in Holoviz Panel

Hi folks,
I am wondering how we can create a fancy menu (clickable items/components) in Holoviz and get it all clickable. similar to Word or other software that has a menu on the top or left/right side of the user interface, that each menu is responsible for a specific action/job.

Any solution except the “Tab” widget would be appreciated.

Best regards.

2 Likes

Hi @BlueBit

For a basic menu you can use the MenuButton.

Here is an example

panel-menu

import panel as pn

pn.extension(notifications=True)

file_options = ["New File", "Save"]
file_menu = pn.widgets.MenuButton(
    name="File", items=file_options, button_type="light", width=75, margin=0
)

help_options = ["License", "About"]
help_menu = pn.widgets.MenuButton(
    name="Help", items=help_options, button_type="light", width=75, margin=0
)


def selection(clicked):
    pn.state.notifications.success(clicked)


pn.bind(selection, file_menu.param.clicked, watch=True)
pn.bind(selection, help_menu.param.clicked, watch=True)

pn.Row(
    file_menu,
    help_menu,
    styles={"border-bottom": "1px solid black"},
    sizing_mode="stretch_width",
).servable()
2 Likes

I’ve updated the documentation of MenuButton and its been released with Panel 1.3.2. Check it out MenuButton.