帶有屏幕管理器和網格布局的 Kivy 滾動視圖

Question

像許多其他問題一樣，我對滾動視圖有疑問。 我試圖有一堆不同的按鈕，去不同的屏幕，但按鈕坐在彼此的頂部，卡在角落里，或者只有一個按鈕出現，屏幕被切成兩半。

我試過在 TabbedPanelItem 之外使用屏幕管理器，給每個小部件一個大小，但沒有 size_hint_y 但無濟於事？ 是否不可能將屏幕管理器放在選項卡式面板中，還是不好的做法

Python 文件。

from kivy.app import App
from kivy.core.window import Window
from kivy.uix.screenmanager import ScreenManager, Screen 
from kivy.config import Config
from kivy.lang import Builder
Config.set('graphics', 'resizeable', 0)
Window.size = (375,700)

class MainScreen(Screen):
    pass
class FirstScreen(Screen):
    pass

class SecondScreen(Screen):
    pass
root = Builder.load_file("main.kv")
class myapp(App):
    def build(self):
        return root

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

主文件

TabbedPanel:
    do_default_tab: False

    TabbedPanelItem:
        text:"1"
        ScrollView:
            size: self.size
            FloatLayout: #gridlayout? #boxlayout?
                size_hint_y: None
                ScreenManager:
                    id: manager  

                    MainScreen:
                        name: 'main'

                        GridLayout:
                            spacing: 10
                            padding: 10
                            cols:1
                            row_default_height: 100
                            row_force_default: True
                            Button:
                                text: 'first'
                                on_press: manager.current = 'first'  
                                size_hint: 1, None
                                height: 100
                            Button:
                                text: 'Second'
                                on_press: manager.current = 'second'  
                                
                    FirstScreen:
                        name: 'first'
                    SecondScreen:
                        name: "second"
    TabbedPanelItem:
        text:"2"

    TabbedPanelItem:
        text:"3"
<FirstScreen>:
    BoxLayout:
        Label:
            text:"first"
        Button:
            text: 'Back to main'
            on_press: root.manager.current = 'main'

<SecondScreen>
    BoxLayout:
        Label:
            text:"second"
        Button:
            text: 'Back to main'
            on_press: root.manager.current = 'main'

Answer 1

你可以做你想做的，但它似乎有點復雜。 這是我認為可以做到的kv ：

TabbedPanel:
    do_default_tab: False

    TabbedPanelItem:
        text:"1"
        ScrollView:
            ScreenManager:
                id: manager  
                size_hint_y: None
                height: self.current_screen.height  # only seems to work for first Screen
                on_current_screen: self.height = self.current_screen.height  # required because above line failure

                MainScreen:
                    name: 'main'
                    size_hint_y: None
                    height: grid.height  # set this Screen height to the height of the GridLayout

                    GridLayout:
                        id: grid
                        size_hint_y: None
                        height: self.minimum_height  # set this height to the minimum required
                        spacing: 10
                        padding: 10
                        cols:1
                        row_default_height: 100
                        row_force_default: True
                        Button:
                            text: 'first'
                            on_press: manager.current = 'first'  
                            size_hint: 1, None
                            height: 100
                        Button:
                            text: 'Second'
                            on_press: manager.current = 'second'  
                            
                FirstScreen:
                    name: 'first'
                SecondScreen:
                    name: "second"
    TabbedPanelItem:
        text:"2"

    TabbedPanelItem:
        text:"3"
<FirstScreen>:
    size_hint_y: None
    height: 100   # must set its height
    BoxLayout:
        Label:
            text:"first"
        Button:
            text: 'Back to main'
            on_press: root.manager.current = 'main'

<SecondScreen>
    size_hint_y: None
    height: 100   # must set its height
    BoxLayout:
        Label:
            text:"second"
        Button:
            text: 'Back to main'
            on_press: root.manager.current = 'main'

需要注意的幾點：

• 您不需要Layout來包含ScreenManager 。
• 您需要根據當前Screen的高度來設置ScreenManager的高度。
• line height: self.current_screen.height應該在每次當前Screen改變時調整ScreenManager的高度，但它沒有。 所以我添加了on_current_screen: self.height = self.current_screen.height來調整當前Screen變化時的大小。
• 由於ScreenManager的高度取決於Screen的高度，所以每個Screen都必須有一個明確定義的高度。
• MainScreen高度由GridLayout高度確定， GridLayout高度使用self.minimum_height計算。