Toolbar¶
KivyMD provides the following toolbar positions for use:
Top¶
from kivy.lang import Builder
from kivymd.app import MDApp
KV = '''
MDBoxLayout:
orientation: "vertical"
MDToolbar:
title: "MDToolbar"
MDLabel:
text: "Content"
halign: "center"
'''
class Test(MDApp):
def build(self):
return Builder.load_string(KV)
Test().run()
Change toolbar color¶
MDToolbar:
title: "MDToolbar"
md_bg_color: app.theme_cls.accent_color
Change toolbar text color¶
MDToolbar:
title: "MDToolbar"
specific_text_color: app.theme_cls.accent_color
Shadow elevation control¶
MDToolbar:
title: "Elevation 10"
elevation: 10
Bottom¶
Usage¶
from kivy.lang import Builder
from kivymd.app import MDApp
KV = '''
MDBoxLayout:
# Will always be at the bottom of the screen.
MDBottomAppBar:
MDToolbar:
title: "Title"
icon: "git"
type: "bottom"
left_action_items: [["menu", lambda x: x]]
'''
class Test(MDApp):
def build(self):
return Builder.load_string(KV)
Test().run()
Event on floating button¶
Event on_action_button
:
MDBottomAppBar:
MDToolbar:
title: "Title"
icon: "git"
type: "bottom"
left_action_items: [["menu", lambda x: x]]
on_action_button: app.callback(self.icon)
Floating button position¶
Mode:
’free-end’
’free-center’
’end’
’center’
MDBottomAppBar:
MDToolbar:
title: "Title"
icon: "git"
type: "bottom"
left_action_items: [["menu", lambda x: x]]
mode: "end"
MDBottomAppBar:
MDToolbar:
title: "Title"
icon: "git"
type: "bottom"
left_action_items: [["menu", lambda x: x]]
mode: "free-end"
Custom color¶
MDBottomAppBar:
md_bg_color: 0, 1, 0, 1
MDToolbar:
title: "Title"
icon: "git"
type: "bottom"
left_action_items: [["menu", lambda x: x]]
icon_color: 0, 1, 0, 1
Tooltips¶
You can add MDTooltips to the Toolbar icons by ading a text string to the toolbar item, as shown below
from kivy.lang import Builder
from kivymd.app import MDApp
from kivymd.uix.snackbar import Snackbar
KV = '''
MDBoxLayout:
orientation: "vertical"
MDToolbar:
title: "MDToolbar"
left_action_items: [["menu", "This is the navigation"]]
right_action_items: [["dots-vertical", lambda x: app.callback(x), "this is the More Actions"]]
MDLabel:
text: "Content"
halign: "center"
'''
class Test(MDApp):
def build(self):
return Builder.load_string(KV)
def callback(self, button):
Snackbar(text="Hello World").open()
Test().run()
See also
API - kivymd.uix.toolbar
¶
- class kivymd.uix.toolbar.MDActionBottomAppBarButton(**kwargs)¶
Base class for all round buttons, bringing in the appropriate on-touch behavior
- class kivymd.uix.toolbar.MDActionTopAppBarButton(**kwargs)¶
Base class for all round buttons, bringing in the appropriate on-touch behavior
- class kivymd.uix.toolbar.NotchedBox(**kw)¶
FakeRectangularElevationBehavio`r is a shadow mockup for widgets. Improves performance using cached images inside `kivymd.images dir
This class cast a fake Rectangular shadow behaind the widget.
You can either use this behavior to overwrite the elevation of a prefab widget, or use it directly inside a new widget class definition.
Use this class as follows for new widgets:
class NewWidget( ThemableBehavior, FakeCircularElevationBehavior, SpecificBackgroundColorBehavior, # here you add the other front end classes for the widget front_end, ): [...]
With this method each class can draw it’s content in the canvas in the correct order, avoiding some visual errors.
FakeCircularElevationBehavior will load prefabricated textures to optimize loading times.
Also, this class allows you to overwrite real time shadows, in the sence that if you are using a standard widget, like a button, MDCard or Toolbar, you can include this class after the base class to optimize the loading times.
As an example of this flexibility:
class Custom_rectangular_Card( MDCard, FakeRectangularElevationBehavior ): [...]
Note
About rounded corners: be careful, since this behavior is a mockup and will not draw any rounded corners.
- elevation¶
Elevation value.
elevation
is anNumericProperty
and defaults to 6.
- notch_radius¶
- notch_center_x¶
- class kivymd.uix.toolbar.MDToolbar(**kwargs)¶
- Events
- on_action_button
Method for the button used for the
MDBottomAppBar
class.
- left_action_items¶
The icons on the left of the toolbar. To add one, append a list like the following:
left_action_items: [`'icon_name'`, callback, tooltip text]
where ‘icon_name’ is a string that corresponds to an icon definition,
callback
is the function called on a touch release event andtooltip text` is the text to be displayed in the tooltip. Both the ``callback
andtooltip text
are optional but the order must be preserved.left_action_items
is anListProperty
and defaults to [].
- right_action_items¶
The icons on the left of the toolbar. Works the same way as
left_action_items
.right_action_items
is anListProperty
and defaults to [].
- title¶
Text toolbar.
title
is anStringProperty
and defaults to ‘’.
- anchor_title¶
Position toolbar title. Available options are: ‘left’, ‘center’, ‘right’.
anchor_title
is anOptionProperty
and defaults to ‘left’.
- mode¶
Floating button position. Only for
MDBottomAppBar
class. Available options are: ‘free-end’, ‘free-center’, ‘end’, ‘center’.mode
is anOptionProperty
and defaults to ‘center’.
- round¶
Rounding the corners at the notch for a button. Onle for
MDBottomAppBar
class.round
is anNumericProperty
and defaults to ‘10dp’.
- icon¶
Floating button. Onle for
MDBottomAppBar
class.icon
is anStringProperty
and defaults to ‘android’.
- icon_color¶
Color action button. Onle for
MDBottomAppBar
class.icon_color
is anColorProperty
and defaults to [].
- type¶
When using the
MDBottomAppBar
class, the parametertype
must be set to ‘bottom’:MDBottomAppBar: MDToolbar: type: "bottom"
Available options are: ‘top’, ‘bottom’.
type
is anOptionProperty
and defaults to ‘top’.
- opposite_colors¶
- on_type(self, instance, value)¶
- on_action_button(self, *args)¶
- on_md_bg_color(self, instance, value)¶
- on_left_action_items(self, instance, value)¶
- on_right_action_items(self, instance, value)¶
- set_md_bg_color(self, instance, value)¶
- update_action_bar(self, action_bar, action_bar_items)¶
- update_md_bg_color(self, *args)¶
- update_opposite_colors(self, instance, value)¶
- update_action_bar_text_colors(self, *args)¶
- on_icon(self, instance, value)¶
- on_icon_color(self, instance, value)¶
- on_mode(self, instance, value)¶
- remove_notch(self)¶
- set_notch(self)¶
- remove_shadow(self)¶
- set_shadow(self, *args)¶
- class kivymd.uix.toolbar.MDBottomAppBar(**kwargs)¶
Float layout class. See module documentation for more information.
- md_bg_color¶
Color toolbar.
md_bg_color
is anColorProperty
and defaults to [0, 0, 0, 0].
- add_widget(self, widget, index=0, canvas=None)¶
Add a new widget as a child of this widget.
- Parameters
- widget:
Widget
Widget to add to our list of children.
- index: int, defaults to 0
Index to insert the widget in the list. Notice that the default of 0 means the widget is inserted at the beginning of the list and will thus be drawn on top of other sibling widgets. For a full discussion of the index and widget hierarchy, please see the Widgets Programming Guide.
New in version 1.0.5.
- canvas: str, defaults to None
Canvas to add widget’s canvas to. Can be ‘before’, ‘after’ or None for the default canvas.
New in version 1.9.0.
- widget:
>>> from kivy.uix.button import Button >>> from kivy.uix.slider import Slider >>> root = Widget() >>> root.add_widget(Button()) >>> slider = Slider() >>> root.add_widget(slider)