Kivy - 使用自定义行布局滚动项目列表

Question

我需要在kivy项目列表中创建自定义行布局。 每行应该有：标签（带文字环绕）和两个小图像（并排），下面的图像缩放到全宽（按比例高度）。 我怎样才能做到这一点？我已经尝试过（代码！）：

from kivy.app import App
from kivy.uix.scrollview import ScrollView
from kivy.uix.gridlayout import GridLayout
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.relativelayout import RelativeLayout
from kivy.uix.boxlayout import BoxLayout


from kivy.uix.label import Label
from kivy.uix.image import Image


import kivy
kivy.require('1.0.7')

from kivy.app import App
from kivy.uix.scatter import ScatterPlane
from kivy.uix.image import Image
from os.path import join




class SMApp(App):

    def build(self):
        layout = GridLayout(cols=1, padding=10, spacing=10,
                size_hint=(None, None), width=500)



        for i in range(80):
           la = GridLayout(cols=3, padding=10, spacing=10,
                size_hint=(None, None), width=500)
           btn = Label(text=str(i), size_hint_y=None, pos=(50,-200*i))
           filename = join(kivy.kivy_data_dir, 'logo', 'kivy-icon-256.png')
           l1 = Image(source=filename, size_hint_y=None)#,# pos=(0,-200*i), size=(50,50))
           l3 = Image(source=filename, size_hint_y=None)#, pos=(100,-200*i), size=(50,50))

           l2 = Image(source="las.jpg", size_hint_y=None, pos=(0,-200*i-100),  size=(1200,100))

           la.add_widget(btn)
           la.add_widget(l1)
           la.add_widget(l3)
           layout.add_widget(la)
           la2 = GridLayout(cols=1, padding=10, spacing=10,
                 size_hint=(None, None), width=500)

           la2.add_widget(l2)
           layout.add_widget(la2)
        layout.bind(minimum_height=layout.setter('height'))
        root = ScrollView(size_hint=(None, None), size=(500, 320),
                pos_hint={'center_x': .5, 'center_y': .5}, do_scroll_x=False)


        root.add_widget(layout)

        return root

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

但是不能缩放图像＆＃34; las.jpg＆＃34;到全宽。

我尝试以其他方式（CODE2）：

from kivy.app import App
from kivy.lang import Builder
from kivy.uix.floatlayout import FloatLayout


from kivy.app import App
from kivy.lang import Builder
from kivy.uix.floatlayout import FloatLayout

Builder.load_string("""
<Boxes>:
    ScrollView:
        GridLayout:
            cols: 1
            BoxLayout:
                orientation: 'vertical'
                padding: 10
                BoxLayout:
                    orientation: 'horizontal'
                    Button:
                        text: "1"
                BoxLayout:
                    orientation: 'horizontal'
                    Button:
                        text: "2"
                    Button:
                        text: "3"
                    Button:
                        text: "4"
                BoxLayout:
                    orientation: 'horizontal'
                    Button:
                        text: "5"
                    Button:
                        text: "6"
                BoxLayout:
                    orientation: 'horizontal'
                    Button:
                        text: "7"
                    Button:
                        text: "8"
                    Button:
                        text: "9"
                    Button:
                        text: "10"
                BoxLayout:
                    orientation: 'horizontal'
                    Button:
                        text: "7"
                    Button:
                        text: "8"
                    Button:
                        text: "9"
                    Button:
                        text: "10"
                BoxLayout:
                    orientation: 'horizontal'
                    Button:
                        text: "7"
                    Button:
                        text: "8"
                    Button:
                        text: "9"
                    Button:
                        text: "10"

""")


class Boxes(FloatLayout):
    pass

class TestApp(App):
    def build(self):
        return Boxes()

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

在这种情况下，行中的列数可以不同，但​​滚动 不起作用（所有小部件都适合屏幕，但我需要滚动）

//编辑 我尝试了代码（CODE2中的方法）：

import kivy

from kivy.app import App
from kivy.lang import Builder
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.label import Label
from kivy.uix.image import Image
from os.path import join
from kivy.uix.gridlayout import GridLayout


Builder.load_string("""
<Boxes>:
    ScrollView:
        GridLayout:
            cols: 1
            id: gridlayout
            BoxLayout:
                orientation: 'vertical'
                id: verticalbox

""")





class Boxes(FloatLayout):
    pass

class TestApp(App):
    def build(self):
        widgets = Boxes()
        verticalbox = widgets.ids["verticalbox"]
        repeat = 10
        widgets.ids["gridlayout"].size_hint_y = repeat

        for a in range(0, repeat):

            layout1 = BoxLayout(orientation='horizontal')
            filename = join(kivy.kivy_data_dir, 'logo', 'kivy-icon-256.png')

            l1 = Image(source=filename, size_hint_y=None)#,# pos=(0,-200*i), size=(50,50))
            l3 = Image(source=filename, size_hint_y=None)#, pos=(100,-200*i), size=(50,50))

            btn1 = Label(text="aaaa", size_hint_y=None)
            btn2 = Label(text="aaaa", size_hint_y=None)
            btn3 = Label(text="aaaa", size_hint_y=None)

            layout1.add_widget(btn1)
            layout1.add_widget(btn2)
            layout1.add_widget(btn3)

            layout2 = BoxLayout(orientation='horizontal')

            btn4 = Label(text="avvvvvvvvvvvaaaaaaaaaaaaaggggggggggggggggggggggggggzzzzzzzzzzzzzzzzzzzzzzzzaaaaaaaaaaaaaaaaaa", size_hint_y=None)
            layout2.add_widget(btn4)

            layout3 = BoxLayout(orientation='horizontal')


            l2 = Image(source="jezioro.jpg")


            layout3.add_widget(l2)



            verticalbox.add_widget(layout1)
            verticalbox.add_widget(layout2)
            verticalbox.add_widget(layout3)



        return widgets

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

滚动有效，但图像l2不会缩放到屏幕宽度，它会缩放到 btn2宽度。但是，在另一行中，btn4正在缩放！为什么呢？

有什么想法吗？