Tooltip#

#

Tooltips display brief labels or messages.

https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/tooltip-m3-preview.png
  • Use tooltips to add additional context to a button or other UI element

  • Two types: plain and rich

  • Use plain tooltips to describe elements or actions of icon buttons

  • Use rich tooltips to provide more details, like describing the value of a feature

  • Rich tooltips can include an optional title, link, and buttons

KivyMD provides two types of tooltip:

  1. Plain tooltip

  2. Rich tooltip

https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/tooltip-m3-type.png

Usage of tooltip plain#

from kivy.lang import Builder
from kivy.properties import StringProperty

from kivymd.uix.button import MDButton
from kivymd.uix.tooltip import MDTooltip
from kivymd.app import MDApp

KV = '''
<YourTooltipClass>

    MDTooltipPlain:
        text:
            "Grant value is calculated using the closing stock price \\n" \
            "from the day before the grant date. Amounts do not \\n" \
            "reflect tax witholdings."


<TooltipMDIconButton>

    MDButtonText:
        text: root.text


MDScreen:
    md_bg_color: self.theme_cls.backgroundColor

    TooltipMDIconButton:
        text: "Tooltip button"
        pos_hint: {"center_x": .5, "center_y": .5}
'''


class YourTooltipClass(MDTooltip):
    '''Implements your tooltip base class.'''


class TooltipMDIconButton(YourTooltipClass, MDButton):
    '''Implements a button with tooltip behavior.'''

    text = StringProperty()


class Example(MDApp):
    def build(self):
        self.theme_cls.primary_palette = "Olive"
        return Builder.load_string(KV)


Example().run()
https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/tooltip-m3-plain-usage.gif

The anatomy of a plain tooltip#

https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/tooltip-m3-plain-anatomy.png

Usage of tooltip rich#

from kivy.lang import Builder
from kivy.properties import StringProperty

from kivymd.uix.button import MDButton
from kivymd.uix.tooltip import MDTooltip
from kivymd.app import MDApp

KV = '''
<YourTooltipClass>

    MDTooltipRich:
        id: tooltip
        auto_dismiss: False

        MDTooltipRichSubhead:
            text: "Add others"

        MDTooltipRichSupportingText:
            text:
                "Grant value is calculated using the closing stock price \\n" \
                "from the day before the grant date. Amounts do not \\n" \
                "reflect tax witholdings."

        MDTooltipRichActionButton:
            on_press: tooltip.dismiss()

            MDButtonText:
                text: "Learn more"


<TooltipMDIconButton>

    MDButtonText:
        text: root.text


MDScreen:
    md_bg_color: self.theme_cls.backgroundColor

    TooltipMDIconButton:
        text: "Tooltip button"
        pos_hint: {"center_x": .5, "center_y": .5}
'''


class YourTooltipClass(MDTooltip):
    '''Implements your tooltip base class.'''


class TooltipMDIconButton(YourTooltipClass, MDButton):
    '''Implements a button with tooltip behavior.'''

    text = StringProperty()


class Example(MDApp):
    def build(self):
        self.theme_cls.primary_palette = "Olive"
        return Builder.load_string(KV)


Example().run()
https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/tooltip-m3-rich-usage.gif

The anatomy of a plain tooltip#

https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/tooltip-m3-rich-anatomy.png

API - kivymd.uix.tooltip.tooltip#

class kivymd.uix.tooltip.tooltip.MDTooltip(**kwargs)#

Tooltip class.

For more information, see in the TouchBehavior class documentation.

Events:
on_open:

Fired when the tooltip opens.

on_dismiss:

Fired when the tooltip is closed.

tooltip_display_delay#

Tooltip display delay.

Note

This property only works on desktop.

tooltip_display_delay is an BoundedNumericProperty and defaults to 0, min of 0 & max of 4.

shift_y#

Y-offset of tooltip to the top.

shift_y is an NumericProperty and defaults to 0.

shift_right#

Shifting the tooltip to the right.

New in version 1.0.0.

shift_right is an NumericProperty and defaults to 0.

shift_left#

Shifting the tooltip to the left.

New in version 1.0.0.

shift_left is an NumericProperty and defaults to 0.

delete_clock(widget, touch, *args)#

Removes a key event from touch.ud.

adjust_tooltip_position() tuple#

Returns the coordinates of the tooltip that fit into the borders of the screen.

display_tooltip(*args) None#

Adds a tooltip widget to the screen and animates its display.

animation_tooltip_show(*args) None#

Animation of opening tooltip on the screen.

animation_tooltip_dismiss(*args) None#

Animation of closing tooltip on the screen.

New in version 1.0.0.

remove_tooltip(*args) None#

Removes the tooltip widget from the screen.

add_widget(widget, *args, **kwargs)#

Add a new widget as a child of this widget.

on_long_touch(touch, *args) None#

Fired when the widget is pressed for a long time.

on_enter(*args) None#

Fired when mouse enter the bbox of the widget.

on_leave(*args) None#

Fired when the mouse goes outside the widget border.

on_open() None#

Default display event handler.

Changed in version 2.0.0: Rename from on_show to on_open.

on_dismiss() None#

Default dismiss event handler.

New in version 1.0.0.

class kivymd.uix.tooltip.tooltip.MDTooltipPlain(*args, **kwargs)#

Tooltip plain class.

New in version 2.0.0.

For more information, see in the MDLabel and ScaleBehavior classes documentation.

class kivymd.uix.tooltip.tooltip.MDTooltipRichSupportingText(*args, **kwargs)#

Implements supporting text for the MDTooltipRich class.

New in version 2.0.0.

For more information, see in the MDLabel class documentation.

class kivymd.uix.tooltip.tooltip.MDTooltipRichSubhead(*args, **kwargs)#

Implements subhead text for the MDTooltipRich class.

New in version 2.0.0.

For more information, see in the MDLabel class documentation.

class kivymd.uix.tooltip.tooltip.MDTooltipRichActionButton(*args, **kwargs)#

Implements action button for the MDTooltipRich class.

New in version 2.0.0.

For more information, see in the MDButton class documentation.

on_enter() None#

Fired when mouse enter the bbox of the widget.

on_leave() None#

Fired when the mouse goes outside the widget border.

class kivymd.uix.tooltip.tooltip.MDTooltipRich(*args, **kwargs)#

Tooltip rich class.

New in version 2.0.0.

For more information, see in the DeclarativeBehavior and ThemableBehavior and BackgroundColorBehavior and CommonElevationBehavior and ScaleBehavior and StateLayerBehavior and BoxLayout and classes documentation.

auto_dismiss#

This property determines if the view is automatically dismissed when the cursor goes outside of the tooltip body.

auto_dismiss is a BooleanProperty and defaults to True.

on_leave() None#

Fired when the mouse goes outside the widget border.

dismiss() None#

Hides the tooltip.