Swiper

Usage

MDSwiper:

    MDSwiperItem:

    MDSwiperItem:

    MDSwiperItem:

Example

from kivymd.app import MDApp
from kivy.lang.builder import Builder

kv = '''
<MySwiper@MDSwiperItem>

    FitImage:
        source: "guitar.png"
        radius: [20,]

MDScreen:

    MDTopAppBar:
        id: toolbar
        title: "MDSwiper"
        elevation: 4
        pos_hint: {"top": 1}

    MDSwiper:
        size_hint_y: None
        height: root.height - toolbar.height - dp(40)
        y: root.height - self.height - toolbar.height - dp(20)

        MySwiper:

        MySwiper:

        MySwiper:

        MySwiper:

        MySwiper:
'''


class Main(MDApp):
    def build(self):
        return Builder.load_string(kv)

Main().run()

Warning

The width of MDSwiperItem is adjusted automatically. Consider changing that by width_mult.

Warning

The width of MDSwiper is automatically adjusted according to the width of the window.

MDSwiper provides the following events for use:

__events__ = (
    "on_swipe",
    "on_pre_swipe",
    "on_overswipe_right",
    "on_overswipe_left",
    "on_swipe_left",
    "on_swipe_right"
)

MDSwiper:
    on_swipe: print("on_swipe")
    on_pre_swipe: print("on_pre_swipe")
    on_overswipe_right: print("on_overswipe_right")
    on_overswipe_left: print("on_overswipe_left")
    on_swipe_left: print("on_swipe_left")
    on_swipe_right: print("on_swipe_right")

Example

from kivy.lang.builder import Builder

from kivymd.app import MDApp

kv = '''
<MagicButton@MagicBehavior+MDIconButton>


<MySwiper@MDSwiperItem>

    RelativeLayout:

        FitImage:
            source: "guitar.png"
            radius: [20,]

        MDBoxLayout:
            adaptive_height: True
            spacing: "12dp"

            MagicButton:
                id: icon
                icon: "weather-sunny"
                user_font_size: "56sp"
                opposite_colors: True

            MDLabel:
                text: "MDLabel"
                font_style: "H5"
                size_hint_y: None
                height: self.texture_size[1]
                pos_hint: {"center_y": .5}
                opposite_colors: True


MDScreen:

    MDTopAppBar:
        id: toolbar
        title: "MDSwiper"
        elevation: 4
        pos_hint: {"top": 1}

    MDSwiper:
        size_hint_y: None
        height: root.height - toolbar.height - dp(40)
        y: root.height - self.height - toolbar.height - dp(20)
        on_swipe: self.get_current_item().ids.icon.shake()

        MySwiper:

        MySwiper:

        MySwiper:

        MySwiper:

        MySwiper:
'''


class Main(MDApp):
    def build(self):
        return Builder.load_string(kv)


Main().run()

How to automatically switch a SwiperItem?

Use method set_current which takes the index of MDSwiperItem as argument.

Example

MDSwiper:
    id: swiper

    MDSwiperItem: # First widget with index 0

    MDSwiperItem: # Second widget with index 1

MDRaisedButton:
    text: "Go to Second"
    on_release: swiper.set_current(1)

API - kivymd.uix.swiper.swiper

class kivymd.uix.swiper.swiper.MDSwiperItem(*args, **kwargs)

MDSwiperItem is a BoxLayout but it’s size is adjusted automatically.

class kivymd.uix.swiper.swiper.MDSwiper(*args, **kwargs)

ScrollView class. For more information, see in the ScrollView class documentation.

items_spacing

The space between each MDSwiperItem.

items_spacing is an NumericProperty and defaults to 20dp.

transition_duration

Duration of switching between MDSwiperItem.

transition_duration is an NumericProperty and defaults to 0.2.

size_duration

Duration of changing the size of MDSwiperItem.

transition_duration is an NumericProperty and defaults to 0.2.

size_transition

The type of animation used for changing the size of MDSwiperItem.

size_transition is an StringProperty and defaults to out_quad.

swipe_transition

The type of animation used for swiping.

swipe_transition is an StringProperty and defaults to out_quad.

swipe_distance

Distance to move before swiping the MDSwiperItem.

swipe_distance is an NumericProperty and defaults to 70dp.

width_mult

This number is multiplied by items_spacing x2 and then subtracted from the width of window to specify the width of MDSwiperItem. So by decreasing the width_mult the width of MDSwiperItem increases and vice versa.

width_mult is an NumericProperty and defaults to 3.

swipe_on_scroll

Wheter to swipe on mouse wheel scrolling or not.

swipe_on_scroll is an BooleanProperty and defaults to True.

add_widget(self, widget, index=0)

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.

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

remove_widget(self, widget)

Remove a widget from the children of this widget.

Parameters:

widget: Widget

Widget to remove from our children list.

>>> from kivy.uix.button import Button
>>> root = Widget()
>>> button = Button()
>>> root.add_widget(button)
>>> root.remove_widget(button)

set_current(self, index)

Switch to given MDSwiperItem index.

get_current_index(self)

Returns the current MDSwiperItem index.

get_current_item(self)

Returns the current MDSwiperItem instance.

get_items(self)

Returns the list of MDSwiperItem children.

Note

Use get_items() to get the list of children instead of MDSwiper.children.

on_swipe(self)

on_pre_swipe(self)

on_overswipe_right(self)

on_overswipe_left(self)

on_swipe_left(self)

on_swipe_right(self)

swipe_left(self)

swipe_right(self)

on_scroll_start(self, touch, check_children=True)

on_touch_down(self, 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.

on_touch_up(self, touch)

Receive a touch up event. The touch is in parent coordinates.

See on_touch_down() for more information.