[gtk.popover_menu.PopoverMenu] is a subclass of [gtk.popover.Popover] that implements menu behavior.

!An example GtkPopoverMenu

[gtk.popover_menu.PopoverMenu] treats its children like menus and allows switching between them. It can open submenus as traditional, nested submenus, or in a more touch-friendly sliding fashion. The property [gtk.popover_menu.PopoverMenu.flags] controls this appearance.

[gtk.popover_menu.PopoverMenu] is meant to be used primarily with menu models, using [gtk.popover_menu.PopoverMenu.newFromModel]. If you need to put other widgets such as a [gtk.spin_button.SpinButton] or a [gtk.switch_.Switch] into a popover, you can use [gtk.popover_menu.PopoverMenu.addChild].

For more dialog-like behavior, use a plain [gtk.popover.Popover].

Menu models

The XML format understood by [gtk.builder.Builder] for [gio.menu_model.MenuModel] consists of a toplevel <menu> element, which contains one or more <item> elements. Each <item> element contains <attribute> and <link> elements with a mandatory name attribute. <link> elements have the same content model as <menu>. Instead of <link name="submenu"> or <link name="section">, you can use <submenu> or <section> elements.

<menu id='app-menu'>
 <section>
   <item>
     <attribute name='label' translatable='yes'>_New Window</attribute>
     <attribute name='action'>app.new</attribute>
   </item>
   <item>
     <attribute name='label' translatable='yes'>_About Sunny</attribute>
     <attribute name='action'>app.about</attribute>
   </item>
   <item>
     <attribute name='label' translatable='yes'>_Quit</attribute>
     <attribute name='action'>app.quit</attribute>
   </item>
 </section>
</menu>

Attribute values can be translated using gettext, like other [gtk.builder.Builder] content. <attribute> elements can be marked for translation with a translatable="yes" attribute. It is also possible to specify message context and translator comments, using the context and comments attributes. To make use of this, the [gtk.builder.Builder] must have been given the gettext domain to use.

The following attributes are used when constructing menu items:

• "label": a user-visible string to display
• "use-markup": whether the text in the menu item includes Pango markup
• "action": the prefixed name of the action to trigger
• "target": the parameter to use when activating the action
• "icon" and "verb-icon": names of icons that may be displayed
• "submenu-action": name of an action that may be used to track

whether a submenu is open

• "hidden-when": a string used to determine when the item will be hidden.

Possible values include "action-disabled", "action-missing", "macos-menubar". This is mainly useful for exported menus, see [gtk.application.Application.setMenubar].

• "custom": a string used to match against the ID of a custom child added with

[gtk.popover_menu.PopoverMenu.addChild], [gtk.popover_menu_bar.PopoverMenuBar.addChild], or in the ui file with <child type="ID">.

The following attributes are used when constructing sections:

• "label": a user-visible string to use as section heading
• "display-hint": a string used to determine special formatting for the section.

Possible values include "horizontal-buttons", "circular-buttons" and "inline-buttons". They all indicate that section should be displayed as a horizontal row of buttons.

• "text-direction": a string used to determine the [gtk.types.TextDirection] to use

when "display-hint" is set to "horizontal-buttons". Possible values include "rtl", "ltr", and "none".

The following attributes are used when constructing submenus:

• "label": a user-visible string to display
• "icon": icon name to display

Menu items will also show accelerators, which are usually associated with actions via [gtk.application.Application.setAccelsForAction], [gtk.widget_class.WidgetClass.addBindingAction] or [gtk.shortcut_controller.ShortcutController.addShortcut].

CSS Nodes

[gtk.popover_menu.PopoverMenu] is just a subclass of [gtk.popover.Popover] that adds custom content to it, therefore it has the same CSS nodes. It is one of the cases that add a .menu style class to the main popover node.

Menu items have nodes with name button and class .model. If a section display-hint is set, the section gets a node box with class horizontal plus a class with the same text as the display hint. Note that said box may not be the direct ancestor of the item buttons. Thus, for example, to style items in an inline-buttons section, select .inline-buttons button.model. Other things that may be of interest to style in menus include label nodes.

Accessibility

[gtk.popover_menu.PopoverMenu] uses the [gtk.types.AccessibleRole.Menu] role, and its items use the [gtk.types.AccessibleRole.MenuItem], [gtk.types.AccessibleRole.MenuItemCheckbox] or [gtk.types.AccessibleRole.MenuItemRadio] roles, depending on the action they are connected to.

Fluent builder for [gtk.popover_menu.PopoverMenu]