Kivy如何将列表元素垂直排列为独立标签并支持溢出滚动

核心思路 #

• 用ScrollView作为滚动容器承载超长列表内容，解决超出屏幕无法滚动的问题
• 滚动容器内部使用单列布局（推荐直接用MDList，适配后续替换MDCard的需求）
• 动态生成的列表元素需要添加到内部列表布局中，不要直接绑定到Screen上

修改后的完整代码 #

*.py #

import kivy
from kivy.app import App
from kivy.uix.label import Label
from kivy.lang import Builder
from kivy.uix.screenmanager import ScreenManager, Screen
from kivy.uix.scrollview import ScrollView
from kivymd.uix.list import MDList
from kivymd.uix.card import MDCard
from kivymd.app import MDApp

class FirstWindow(Screen):
    def __init__(self, **kwargs):
        super(FirstWindow, self).__init__(**kwargs)
        list1 = ['1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20']
        # 绑定kv文件中定义的列表容器
        list_container = self.ids.list_container
        for x in list1:
            # 当前使用Label展示，后续换MDCard直接替换这段逻辑即可
            list_container.add_widget(Label(text=x, size_hint_y=None, height=40))
            # 替换MDCard参考代码：
            # card = MDCard(size_hint_y=None, height=60, padding=10, pos_hint={"center_x":0.5})
            # card.add_widget(Label(text=x))
            # list_container.add_widget(card)

class WindowManager(ScreenManager):
    pass

kv = Builder.load_file('NearMe.kv')

class NearMeApp(MDApp):
    def build(self):
        return kv

if __name__ == '__main__':
    NearMeApp().run()

*.kv #

WindowManager:
    FirstWindow:

<FirstWindow>:
    name:"FirstWindow"
    GridLayout:
        cols:1
        size: root.width, root.height
        # 原有3列头部布局保留
        GridLayout:
            cols:3
            size_hint_y: None
            height: 50
            Label:
                text: "分类1"
            Label:
                text: "分类2"
            Label:
                text: "分类3"
        # 滚动容器
        ScrollView:
            MDList:
                id: list_container
                # 必须设置size_hint_y为None，高度随内容自动计算才能触发滚动
                size_hint_y: None
                height: self.minimum_height
                padding: 10
                spacing: 8

关键注意点 #

• 滚动容器内的布局必须设置size_hint_y: None，且绑定高度为self.minimum_height，否则ScrollView无法计算内容总高度，滚动功能不会生效
• 所有动态添加的列表元素（Label/MDCard）也需要设置size_hint_y: None和固定高度，避免布局高度计算异常
• 后续替换MDCard仅需要修改添加元素的逻辑，整体框架不需要调整

内容的提问来源于stack exchange，提问作者primitiveProgrammer