Snackbar#

See also

Material Design spec, Snackbars

Snackbars provide brief messages about app processes at the bottom of the screen.

https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/snackbar.png

Usage#

from kivy.lang import Builder

from kivymd.app import MDApp

KV = '''
#:import Snackbar kivymd.uix.snackbar.Snackbar


MDScreen:

    MDRaisedButton:
        text: "Create simple snackbar"
        on_release: Snackbar(text="This is a snackbar!").open()
        pos_hint: {"center_x": .5, "center_y": .5}
'''


class Test(MDApp):
    def build(self):
        return Builder.load_string(KV)


Test().run()
https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/snackbar-simple.gif

Usage with snackbar_x, snackbar_y#

Snackbar(
    text="This is a snackbar!",
    snackbar_x="10dp",
    snackbar_y="10dp",
    size_hint_x=(
        Window.width - (dp(10) * 2)
    ) / Window.width
).open()
https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/snackbar-padding.gif

Control width#

Snackbar(
    text="This is a snackbar!",
    snackbar_x="10dp",
    snackbar_y="10dp",
    size_hint_x=.5
).open()
https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/snackbar-percent-width.png

Custom text color#

Snackbar(
    text="[color=#ddbb34]This is a snackbar![/color]",
    snackbar_y="10dp",
    snackbar_y="10dp",
    size_hint_x=.7
).open()
https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/snackbar-custom-color.png

Usage with button#

snackbar = Snackbar(
    text="This is a snackbar!",
    snackbar_x="10dp",
    snackbar_y="10dp",
)
snackbar.size_hint_x = (
    Window.width - (snackbar.snackbar_x * 2)
) / Window.width
snackbar.buttons = [
    MDFlatButton(
        text="UPDATE",
        text_color=(1, 1, 1, 1),
        on_release=snackbar.dismiss,
    ),
    MDFlatButton(
        text="CANCEL",
        text_color=(1, 1, 1, 1),
        on_release=snackbar.dismiss,
    ),
]
snackbar.open()
https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/snackbar-button.png

Using a button with custom color#

Snackbar(
    ...
    bg_color=(0, 0, 1, 1),
).open()
https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/snackbar-button-custom-color.png

Custom usage#

from kivy.lang import Builder
from kivy.animation import Animation
from kivy.clock import Clock
from kivy.metrics import dp

from kivymd.app import MDApp
from kivymd.uix.snackbar import Snackbar


KV = '''
MDScreen:

    MDFloatingActionButton:
        id: button
        x: root.width - self.width - dp(10)
        y: dp(10)
        on_release: app.snackbar_show()
'''


class Test(MDApp):
    def __init__(self, **kwargs):
        super().__init__(**kwargs)
        self.screen = Builder.load_string(KV)
        self.snackbar = None
        self._interval = 0

    def build(self):
        return self.screen

    def wait_interval(self, interval):
        self._interval += interval
        if self._interval > self.snackbar.duration + 0.5:
            anim = Animation(y=dp(10), d=.2)
            anim.start(self.screen.ids.button)
            Clock.unschedule(self.wait_interval)
            self._interval = 0
            self.snackbar = None

    def snackbar_show(self):
        if not self.snackbar:
            self.snackbar = Snackbar(text="This is a snackbar!")
            self.snackbar.open()
            anim = Animation(y=dp(72), d=.2)
            anim.bind(on_complete=lambda *args: Clock.schedule_interval(
                self.wait_interval, 0))
            anim.start(self.screen.ids.button)


Test().run()
https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/snackbar-custom-usage.gif

Custom Snackbar#

from kivy.lang import Builder
from kivy.core.window import Window
from kivy.properties import StringProperty, NumericProperty

from kivymd.app import MDApp
from kivymd.uix.button import MDFlatButton
from kivymd.uix.snackbar import BaseSnackbar

KV = '''
<CustomSnackbar>

    MDIconButton:
        pos_hint: {'center_y': .5}
        icon: root.icon
        opposite_colors: True

    MDLabel:
        id: text_bar
        size_hint_y: None
        height: self.texture_size[1]
        text: root.text
        font_size: root.font_size
        theme_text_color: 'Custom'
        text_color: 'ffffff'
        shorten: True
        shorten_from: 'right'
        pos_hint: {'center_y': .5}


MDScreen:

    MDRaisedButton:
        text: "SHOW"
        pos_hint: {"center_x": .5, "center_y": .45}
        on_press: app.show()
'''


class CustomSnackbar(BaseSnackbar):
    text = StringProperty(None)
    icon = StringProperty(None)
    font_size = NumericProperty("15sp")


class Test(MDApp):
    def build(self):
        return Builder.load_string(KV)

    def show(self):
        snackbar = CustomSnackbar(
            text="This is a snackbar!",
            icon="information",
            snackbar_x="10dp",
            snackbar_y="10dp",
            buttons=[MDFlatButton(text="ACTION", text_color=(1, 1, 1, 1))]
        )
        snackbar.size_hint_x = (
            Window.width - (snackbar.snackbar_x * 2)
        ) / Window.width
        snackbar.open()


Test().run()
https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/snackbar-custom.png

API - kivymd.uix.snackbar.snackbar#

class kivymd.uix.snackbar.snackbar.BaseSnackbar(**kwargs)#
Events:
on_open

Called when a dialog is opened.

on_dismiss

When the front layer rises.

Abstract base class for all Snackbars. This class handles sizing, positioning, shape and events for Snackbars

All Snackbars will be made off of this BaseSnackbar.

BaseSnackbar will always try to fill the remainder of the screen with your Snackbar.

To make your Snackbar dynamic and symetric with snackbar_x.

Set size_hint_x like below:

size_hint_z = (
    Window.width - (snackbar_x * 2)
) / Window.width
duration#

The amount of time that the snackbar will stay on screen for.

duration is a NumericProperty and defaults to 3.

auto_dismiss#

Whether to use automatic closing of the snackbar or not.

auto_dismiss is a BooleanProperty and defaults to ‘True’.

bg_color#

Snackbar background.

bg_color is a ColorProperty and defaults to None.

buttons#

Snackbar buttons.

buttons is a ListProperty and defaults to ‘[]’

radius#

Snackbar radius.

radius is a ListProperty and defaults to ‘[5, 5, 5, 5]’

snackbar_animation_dir#

Snackbar animation direction.

Available options are: “Top”, “Bottom”, “Left”, “Right”

snackbar_animation_dir is an OptionProperty and defaults to ‘Bottom’.

snackbar_x#

The snackbar x position in the screen

snackbar_x is a NumericProperty and defaults to 0dp.

snackbar_y#

The snackbar x position in the screen

snackbar_y is a NumericProperty and defaults to 0dp.

dismiss(self, *args)#

Dismiss the snackbar.

open(self)#

Show the snackbar.

on_open(self, *args)#

Called when a dialog is opened.

on_dismiss(self, *args)#

Called when the dialog is closed.

on_buttons(self, instance, value)#
class kivymd.uix.snackbar.snackbar.Snackbar(**kwargs)#

Snackbar inherits all its functionality from BaseSnackbar

text#

The text that will appear in the snackbar.

text is a StringProperty and defaults to ‘’.

font_size#

The font size of the text that will appear in the snackbar.

font_size is a NumericProperty and defaults to ’15sp’.