ImageList

ImageList#

#

See also

Material Design spec, Image lists

Image lists display a collection of images in an organized grid.

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

Usage#

MDSmartTile:
    [...]

    MDSmartTileImage:
        [...]

    MDSmartTileOverlayContainer:
        [...]

        # Content
        [...]

Anatomy#

https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/image-list-anatomy.png

Example#

from kivy.lang import Builder

from kivymd.app import MDApp

KV = '''
MDScreen:
    md_bg_color: self.theme_cls.backgroundColor

    MDSmartTile:
        pos_hint: {"center_x": .5, "center_y": .5}
        size_hint: None, None
        size: "320dp", "320dp"
        overlap: False

        MDSmartTileImage:
            source: "bg.jpg"
            radius: [dp(24), dp(24), 0, 0]

        MDSmartTileOverlayContainer:
            md_bg_color: 0, 0, 0, .5
            adaptive_height: True
            padding: "8dp"
            spacing: "8dp"
            radius: [0, 0, dp(24), dp(24)]

            MDIconButton:
                icon: "heart-outline"
                theme_icon_color: "Custom"
                icon_color: 1, 0, 0, 1
                pos_hint: {"center_y": .5}
                on_release:
                    self.icon = "heart" \
                    if self.icon == "heart-outline" else \
                    "heart-outline"

            MDLabel:
                text: "Ibanez GRG121DX-BKF"
                theme_text_color: "Custom"
                text_color: "white"
'''


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


Example().run()
https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/image-list-example.png

API break#

1.2.0 version#

MDSmartTile:
    [...]

    # Content.
    MDIconButton:
        [...]

    MDLabel:
        [...]

2.0.0 version#

MDSmartTile:
    [...]

    MDSmartTileImage:
        [...]

    MDSmartTileOverlayContainer:
        [...]

        # Content.
        [...]

API - kivymd.uix.imagelist.imagelist#

class kivymd.uix.imagelist.imagelist.MDSmartTileImage(**kwargs)#

Implements the tile image.

Changed in version 2.0.0: The SmartTileImage class has been renamed to MDSmartTileImage.

For more information, see in the RectangularRippleBehavior and ButtonBehavior and FitImage classes documentation.

on_touch_down(touch)#

Receive a touch down event.

Parameters:
touch: MotionEvent class

Touch received. The touch is in parent coordinates. See relativelayout for a discussion on coordinate systems.

Returns:

bool If True, the dispatching of the touch event will stop. If False, the event will continue to be dispatched to the rest of the widget tree.

class kivymd.uix.imagelist.imagelist.MDSmartTileOverlayContainer(*args, **kwargs)#

Implements a container for custom widgets to be added to the tile.

Changed in version 2.0.0: The SmartTileOverlayBox class has been renamed to MDSmartTileOverlayContainer.

For more information, see in the BoxLayout class documentation.

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

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.

Added 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.

Added in version 1.9.0.

>>> from kivy.uix.button import Button
>>> from kivy.uix.slider import Slider
>>> root = Widget()
>>> root.add_widget(Button())
>>> slider = Slider()
>>> root.add_widget(slider)
class kivymd.uix.imagelist.imagelist.MDSmartTile(*args, **kwargs)#

A tile for more complex needs.

For more information, see in the MDRelativeLayout class documentation.

Includes an image, a container to place overlays and a box that can act as a header or a footer, as described in the Material Design specs.

Events:
on_press

Fired when the button is pressed.

on_release

Fired when the button is released (i.e. the touch/click that pressed the button goes away).

overlay_mode#

Determines weather the information box acts as a header or footer to the image. Available are options: ‘footer’, ‘header’.

Changed in version 2.0.0: The box_position attribute has been renamed to overlay_mode.

https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/image-list-overlay-mode.png

overlay_mode is a OptionProperty and defaults to ‘footer’.

overlap#

Determines if the header/footer overlaps on top of the image or not.

https://github.com/HeaTTheatR/KivyMD-data/raw/master/gallery/kivymddoc/image-list-overlap.png

overlap is a BooleanProperty and defaults to True.

ripple_effect#
on_release(*args)#

Fired when the button is released (i.e. the touch/click that pressed the button goes away).

on_press(*args)#

Fired when the button is pressed.

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

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.

Added 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.

Added in version 1.9.0.

>>> from kivy.uix.button import Button
>>> from kivy.uix.slider import Slider
>>> root = Widget()
>>> root.add_widget(Button())
>>> slider = Slider()
>>> root.add_widget(slider)
Contents