Kivy Scroll View 不滚动

Question

I use kivys scroll view widget for the first time and I am not sure how I get this to run. I want to scroll up and done trough the different labels.

How can I achieve this ?

Which attributes are needed for the scroll view widget ? Can I use any layout for it ?

Thanks

This Code that does not work at the moment:

<YearLabel@ButtonBehavior+Label>:
<YearScreen>:
    canvas.before:
        Color:
            rgba: 1,1,1,0.25
        Rectangle:
            pos: self.pos
            size: self.size


    canvas.after:
        Color:
            rgba : 0,0,0,1
        Rectangle:
            pos: 160,1560
            size: 419,60


    ScrollView:
        scroll_timeout: 250
        scroll_distance: 20
        do_scroll_y: True
        do_scroll_x: False
        height: 100
        GridLayout:
            cols : 1
            spacing: 10
            padding: 10
            height: 50
            YearLabel:
                id: year_label
                font_name: "Fonts/sans-serif.ttf"
                text : "2020"
                color: 0,0,0,1
                pos : 0,1200
                font_size: "120sp"

            YearLabel:
                id: year_label
                font_name: "Fonts/sans-serif.ttf"
                text : "2021"
                color: 0,0,0,1
                pos: 0,900
                font_size: "120sp"
            YearLabel:
                id: year_label
                font_name: "Fonts/sans-serif.ttf"
                text : "2022"
                color: 0,0,0,1
                pos: 0,600
                font_size: "120sp"

            YearLabel:
                id: year_label
                font_name: "Fonts/sans-serif.ttf"
                text : "2023"
                color: 0,0,0,1
                pos: 0,300
                font_size: "120sp"

            YearLabel:
                id: year_label
                font_name: "Fonts/sans-serif.ttf"
                text : "2024"
                color: 0,0,0,1
                pos: 0,0
                font_size: "120sp"

            YearLabel:
                id: year_label
                font_name: "Fonts/sans-serif.ttf"
                text : "2025"
                color: 0,0,0,1
                pos: 0,-300
                font_size: "120sp"

            YearLabel:
                id: year_label
                font_name: "Fonts/sans-serif.ttf"
                text : "2026"
                color: 0,0,0,1
                pos: 0,-600
                font_size: "120sp"

            YearLabel:
                id: year_label
                font_name: "Fonts/sans-serif.ttf"
                text : "2027"
                color: 0,0,0,1
                pos: 0,-900
                font_size: "120sp"

            YearLabel:
                id: year_label
                font_name: "Fonts/sans-serif.ttf"
                text : "2028"
                color: 0,0,0,1
                pos: 0,-1200
                font_size: "120sp"

            YearLabel:
                id: year_label
                font_name: "Fonts/sans-serif.ttf"
                text : "2029"
                color: 0,0,0,1
                pos: 0,-1500
                font_size: "120sp"


            YearLabel:
                id: year_label
                font_name: "Fonts/sans-serif.ttf"
                text : "2030"
                color: 0,0,0,1
                pos: 0,-1800
                font_size: "120sp"

Answer 1

The ScrollView will not work if its child (the GridLayout ) is smaller than the ScrollView . Typically, the GridLayout would be large enough to hold all its children (the YearLabels ). Conveniently, the GridLayout can calculate that size. Here is a modified version of your kv that uses it:

ScrollView:
    scroll_timeout: 250
    scroll_distance: 20
    do_scroll_y: True
    do_scroll_x: False
    GridLayout:
        cols : 1
        spacing: 10
        padding: 10
        size_hint_y: None  # required since we are setting height
        height: self.minimum_height  # let GridLayout calculate height

Also, I removed the height: 100 from the ScrollView , since it had no effect.

In order for the GridLayout to calculate minimum_height , all its children must have well defined heights . So, I added to your YearLabel rule:

<YearLabel@ButtonBehavior+Label>:
    size_hint: 1, None
    height: dp(100)