Search code examples
pythonpython-3.xkivykivy-language

ScrollView not scrolling GridLayout


I have a GridLayout which takes some Card widgets that are basically RoundedRectangles and are supposed to be filled with specific information, the problem is that the GridLayout can take many cards and I want the user to scroll the widget. Intuitively, I defined it inside a ScrollView to scroll the gridlayout, however, the scrollview does not work. I suspect that the problem is that the gridlayout's height is not actually changing and not adapting to its children but how can I achieve this? My Python code:

from kivy.app import App
from kivy.uix.widget import Widget
from kivy.lang import Builder


Builder.load_file("design.kv")


class MyLayout(Widget):
    pass


class MainApp(App):
    def build(self):
        return MyLayout()


if __name__ == "__main__":
    MainApp().run()

My KV code:

#:kivy 2.0.0
<Card@Widget>:
    size_hint_y: None
    height: (self.parent.height - self.parent.padding[1] * 3) / 2
    canvas:
        Color:
            rgba: 1, 1, 1, 1
        RoundedRectangle:
            size: self.size
            pos: self.pos
            radius: [5]
<MyLayout>:
    ScrollView:
        size: root.size
        do_scroll_x: False
        do_scroll_y: True

        GridLayout:
            id: song_menu
            cols: 2
            size_hint_y: None
            height: self.parent.height
            padding: 10
            spacing: 10
            canvas.before:
                Color:
                    rgba: 1, 0, 0, 1
                Rectangle:
                    size: self.size
                    pos: self.pos

            Card:
            Card:
            Card:
            Card:
            Card:
            Card:

EDIT: I forgot to mention that I have already tried height: self.minimum_height, however, an absurd thing happens. The gridlayout has a weird behavior and does not show up. Basically I get this in the terminal:

[CRITICAL] [Clock       ] Warning, too much iteration done before the next frame. Check your code, or increase the Clock.max_iteration attribute

Solution

  • The GridLayout height isn't adjusting because you have constrained it with:

     height: self.parent.height
    

    Try replacing that with:

    height: self.minimum_height