选项卡 kivy/KivyMD 中的 ScrollView

Question

Question was updated

I have a code:

from kivy.lang import Builder
from kivy.uix.floatlayout import FloatLayout
from kivymd.app import MDApp
from kivymd.uix.tab import MDTabsBase

KV = '''
BoxLayout:
    orientation: "vertical"

    MDToolbar:
        left_action_items: [["menu", lambda x: x]]
        title: "Smart home & its components"

    MDTabs:
        id: tabs
        on_tab_switch: app.on_tab_switch(*args)
        Tab:
            text: 'Smart home'
            FitImage:
                source: 'smarthome.png'
        Tab:
            text: 'Smart garage'
            ScrollView:
                do_scroll_x: False
                FitImage:
                    size_hint: (None, None)
                    size: root.size
                    source: 'garage.jpg'
                Button:
                    size_hint: (None, None)
                    size: (100, 100)
                Button:
                    size_hint: (None, None)
                    size: (100, 100)


<Tab>:
'''


class Tab(FloatLayout, MDTabsBase):
    pass


class Example(MDApp):
    def build(self):
        return Builder.load_string(KV)

    def on_tab_switch(self, instance_tabs, instance_tab, instance_tab_label, tab_text):
        pass


Example().run()

'''


class Tab(FloatLayout, MDTabsBase):
    pass


class Example(MDApp):
    def build(self):
        return Builder.load_string(KV)

    def on_tab_switch(self, instance_tabs, instance_tab, instance_tab_label, tab_text):
        pass


Example().run()

part of code:

Button:
    size_hint: (None, None)
    size: (100, 100)
Button:
    size_hint: (None, None)
    size: (100, 100)
            

When i run the code without this part, i get scrollable image in the second tab, but when i run code with this part of code, i get error.
Error:

Exception: ScrollView accept only one widget

I understand why i got error and that ScrollView accept only one widget, but if it possible, how to put Buttons under my scrollable image?
Thank u

Answer 1

ScrollView:
    do_scroll_x: False
    
    MDList:
    
        FitImage:
            size_hint: (None, None)
            size: root.size
            source: 'garage.jpg'
        Button:
            size_hint: (None, None)
            size: (100, 100)
        Button:
            size_hint: (None, None)
            size: (100, 100)

Answer 2

from kivy.lang import Builder
from kivy.properties import StringProperty

from kivymd.app import MDApp
from kivymd.uix.boxlayout import MDBoxLayout
from kivymd.uix.label import MDLabel
from kivymd.uix.tab import MDTabsBase

KV = '''
MDBoxLayout:
    orientation: "vertical"

    MDToolbar:
        title: "Example Tabs Toolbar"

    MDTabs:
        id: tabs
        on_tab_switch: app.on_tab_switch(*args)
        
        Tab:
            text: 'Smart home'
            source: 'image.png'
                
        Tab:
            text: 'Smart garage'
            source: 'image.png'

<Tab>:
    orientation: "vertical"

    FitImage:
        source: root.source

    ScrollView:
    
        MDList:
            id: box

'''


class Tab(MDBoxLayout, MDTabsBase):
    source = StringProperty()


class Example(MDApp):
    def build(self):
        return Builder.load_string(KV)

    def on_start(self):
        self.root.ids.tabs.switch_tab('Smart garage')

    def on_tab_switch(self, instance_tabs, instance_tab, instance_tab_label, tab_text):
        instance_tab.ids.box.clear_widgets()
        for i in range(20):
            instance_tab.ids.box.add_widget(
                MDLabel(text=f"Text {i}", halign="center")
            )


Example().run()