Menu¶
See also
Menus display a list of choices on temporary surfaces.
Usage¶
from kivy.lang import Builder
from kivymd.app import MDApp
from kivymd.uix.menu import MDDropdownMenu
KV = '''
Screen:
MDRaisedButton:
id: button
text: "PRESS ME"
pos_hint: {"center_x": .5, "center_y": .5}
on_release: app.menu.open()
'''
class Test(MDApp):
def __init__(self, **kwargs):
super().__init__(**kwargs)
self.screen = Builder.load_string(KV)
menu_items = [{"icon": "git", "text": f"Item {i}"} for i in range(5)]
self.menu = MDDropdownMenu(
caller=self.screen.ids.button, items=menu_items, width_mult=4
)
def build(self):
return self.screen
Test().run()
Warning
Do not create the MDDropdownMenu object when you open
the menu window. Because on a mobile device this one will be very slow!
Customization of menu item¶
You must create a new class that inherits from the RightContent class:
class RightContentCls(RightContent):
pass
Now in the KV rule you can create your own elements that will be displayed in the menu item on the right:
<RightContentCls>
disabled: True
MDIconButton:
icon: root.icon
user_font_size: "16sp"
pos_hint: {"center_y": .5}
MDLabel:
text: root.text
font_style: "Caption"
size_hint_x: None
width: self.texture_size[0]
text_size: None, None
Now create menu items as usual, but add the key right_content_cls whose
value is the class RightContentCls that you created:
menu_items = [
{
"right_content_cls": RightContentCls(
text=f"R+{i}", icon="apple-keyboard-command",
),
"icon": "git",
"text": f"Item {i}",
}
for i in range(5)
]
self.menu = MDDropdownMenu(
caller=self.screen.ids.button, items=menu_items, width_mult=4
)
Full example¶
from kivy.lang import Builder
from kivymd.app import MDApp
from kivymd.uix.menu import MDDropdownMenu, RightContent
KV = '''
<RightContentCls>
disabled: True
MDIconButton:
icon: root.icon
user_font_size: "16sp"
pos_hint: {"center_y": .5}
MDLabel:
text: root.text
font_style: "Caption"
size_hint_x: None
width: self.texture_size[0]
text_size: None, None
Screen:
MDRaisedButton:
id: button
text: "PRESS ME"
pos_hint: {"center_x": .5, "center_y": .5}
on_release: app.menu.open()
'''
class RightContentCls(RightContent):
pass
class Test(MDApp):
def __init__(self, **kwargs):
super().__init__(**kwargs)
self.screen = Builder.load_string(KV)
menu_items = [
{
"right_content_cls": RightContentCls(
text=f"R+{i}", icon="apple-keyboard-command",
),
"icon": "git",
"text": f"Item {i}",
}
for i in range(5)
]
self.menu = MDDropdownMenu(
caller=self.screen.ids.button, items=menu_items, width_mult=4
)
def build(self):
return self.screen
Test().run()
Menu with MDToolbar¶
Warning
The MDDropdownMenu does not work with the standard
MDToolbar. You can use your own
CustomToolbar and bind the menu window output to its elements.
from kivy.lang import Builder
from kivymd.app import MDApp
from kivymd.uix.menu import MDDropdownMenu
from kivymd.theming import ThemableBehavior
from kivymd.uix.behaviors import RectangularElevationBehavior
from kivymd.uix.boxlayout import MDBoxLayout
KV = '''
<CustomToolbar>:
size_hint_y: None
height: self.theme_cls.standard_increment
padding: "5dp"
spacing: "12dp"
MDIconButton:
id: button_1
icon: "menu"
pos_hint: {"center_y": .5}
on_release: app.menu_1.open()
MDLabel:
text: "MDDropdownMenu"
pos_hint: {"center_y": .5}
size_hint_x: None
width: self.texture_size[0]
text_size: None, None
font_style: 'H6'
Widget:
MDIconButton:
id: button_2
icon: "dots-vertical"
pos_hint: {"center_y": .5}
on_release: app.menu_2.open()
Screen:
CustomToolbar:
id: toolbar
elevation: 10
pos_hint: {"top": 1}
'''
class CustomToolbar(
ThemableBehavior, RectangularElevationBehavior, MDBoxLayout,
):
def __init__(self, **kwargs):
super().__init__(**kwargs)
self.md_bg_color = self.theme_cls.primary_color
class Test(MDApp):
def __init__(self, **kwargs):
super().__init__(**kwargs)
self.screen = Builder.load_string(KV)
self.menu_1 = self.create_menu(
"Button menu", self.screen.ids.toolbar.ids.button_1
)
self.menu_2 = self.create_menu(
"Button dots", self.screen.ids.toolbar.ids.button_2
)
def create_menu(self, text, instance):
menu_items = [{"icon": "git", "text": text} for i in range(5)]
return MDDropdownMenu(caller=instance, items=menu_items, width_mult=5)
def build(self):
return self.screen
Test().run()
Position menu¶
Bottom position¶
See also
from kivy.clock import Clock
from kivy.lang import Builder
from kivymd.app import MDApp
from kivymd.uix.menu import MDDropdownMenu
KV = '''
Screen
MDTextField:
id: field
pos_hint: {'center_x': .5, 'center_y': .5}
size_hint_x: None
width: "200dp"
hint_text: "Password"
on_focus: if self.focus: app.menu.open()
'''
class Test(MDApp):
def __init__(self, **kwargs):
super().__init__(**kwargs)
self.screen = Builder.load_string(KV)
menu_items = [{"icon": "git", "text": f"Item {i}"} for i in range(5)]
self.menu = MDDropdownMenu(
caller=self.screen.ids.field,
items=menu_items,
position="bottom",
callback=self.set_item,
width_mult=4,
)
def set_item(self, instance):
def set_item(interval):
self.screen.ids.field.text = instance.text
Clock.schedule_once(set_item, 0.5)
def build(self):
return self.screen
Test().run()
Center position¶
from kivy.lang import Builder
from kivymd.app import MDApp
from kivymd.uix.menu import MDDropdownMenu
KV = '''
Screen
MDDropDownItem:
id: drop_item
pos_hint: {'center_x': .5, 'center_y': .5}
text: 'Item 0'
on_release: app.menu.open()
'''
class Test(MDApp):
def __init__(self, **kwargs):
super().__init__(**kwargs)
self.screen = Builder.load_string(KV)
menu_items = [{"icon": "git", "text": f"Item {i}"} for i in range(5)]
self.menu = MDDropdownMenu(
caller=self.screen.ids.drop_item,
items=menu_items,
position="center",
callback=self.set_item,
width_mult=4,
)
def set_item(self, instance):
self.screen.ids.drop_item.set_item(instance.text)
def build(self):
return self.screen
Test().run()
