Kivy ScreenManager 根大小问题

Question

我只是想设置我的菜单。我看起来不错，然后我发现了 ScreenManager 并决定使用它是一件好事。所以我将我的代码移植到一个新文件中进行尝试，但我的屏幕位置完全不正常。

我想要什么：

import kivy
kivy.require('1.9.1')
from kivy.app import App
from kivy.uix.tabbedpanel import TabbedPanel
from kivy.uix.tabbedpanel import TabbedPanelHeader
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.button import Button
from kivy.uix.label import Label
from kivy.uix.image import Image
from kivy.uix.widget import Widget
from kivy.uix.popup import Popup

class MainMenu(Widget):
    pass


class G_A_M_E_App(App):
    def build(self):
        return MainMenu()

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

及其 .kv 文件

#:kivy 1.9.1

<MainMenu>:

FloatLayout:
    width: root.width * 1/3
    height: root.height * 1/2
    center_x: root.width * 1/2
    center_y: root.height * 1/2

    canvas:
        Color:
            rgba: 0,0,1,.5
        Rectangle:
            size: self.size
            pos: self.pos



    Button:

        size_hint: (.5, .10)
        pos_hint: {'center_x': .5, 'center_y' : .90}
        text: 'Play'
        color: [1, 0, 0, 1]

        font_size: self.height * 5/6
        border: [25, 25, 25, 25]



    Button:

        size_hint: (.5, .10)
        pos_hint: {'center_x': .5, 'center_y' : .70}
        text: 'Load'
        color: [1, 0, 0, 1]

        font_size: self.height * 5/6
        border: [25, 25, 25, 25]


    Button:

        size_hint: (.5, .10)
        pos_hint: {'center_x': .5, 'center_y' : .50}
        text: 'New Game'
        color: [1, 0, 0, 1]

        font_size: self.height * 5/6
        border: [25, 25, 25, 25]


    Button:
        id: help
        size_hint: (.5, .10)
        pos_hint: {'center_x': .5, 'center_y' : .30}
        text: 'Help'
        color: [1, 0, 0, 1]

        font_size: self.height * 5/6
        border: [25, 25, 25, 25]
        on_press: root.helpm()


    Button:

        size_hint: (.5, .10)
        pos_hint: {'center_x': .5, 'center_y' : .10}
        text: 'Quit'
        color: [1, 0, 0, 1]

        font_size: self.height * 5/6
        border: [25, 25, 25, 25]

1 这是一个看起来不像的那个

import kivy
kivy.require('1.9.1')
from kivy.app import App
from kivy.lang import Builder
from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition
from kivy.uix.floatlayout import FloatLayout
from kivy.uix.button import Button
from kivy.uix.label import Label
from kivy.uix.image import Image
from kivy.uix.widget import Widget
from kivy.uix.popup import Popup


class StartMenu(Screen):
    pass

class NewGame(Screen):
    pass

class LoadGame(Screen):
    pass

class ScreenManager(ScreenManager):
    pass




sm = Builder.load_file("main.kv")

class G_A_M_E_App(App):
    def build(self):
        return sm
if __name__=='main__':
    G_A_M_E_App().run()

及其 .kv 文件

ScreenManager:
    StartMenu:
    NewGame:
    LoadGame:

<StartMenu>:
    name: 'start_menu'

    FloatLayout:
        width: root.width * 1/3
        height: root.height * 1/2
        center_x: root.width * 1/2
        center_y: root.height * 1/4

        canvas:
            Color:
                rgba: 0,0,1,.5
            Rectangle:
                size: root.size
                pos: root.pos



        Button:

            size_hint: (.5, .10)
            pos_hint: {'center_x': .5, 'center_y' : .90}
            text: 'Play'
            color: [1, 0, 0, 1]
            font_size: self.height * 5/6
            border: [25, 25, 25, 25]



        Button:

            size_hint: (.5, .10)
            pos_hint: {'center_x': .5, 'center_y' : .70}
            text: 'Load'
            color: [1, 0, 0, 1]
            font_size: self.height * 5/6
            border: [25, 25, 25, 25]


        Button:

            size_hint: (.5, .10)
            pos_hint: {'center_x': .5, 'center_y' : .50}
            text: 'New Game'
            color: [1, 0, 0, 1]
            font_size: self.height * 5/6
            border: [25, 25, 25, 25]


        Button:
            id: help
            size_hint: (.5, .10)
            pos_hint: {'center_x': .5, 'center_y' : .30}
            text: 'Help'
            color: [1, 0, 0, 1]
            font_size: self.height * 5/6
            border: [25, 25, 25, 25]


<NewGame>:
    name: 'new_game'

    Button:
        on_release: app.root.current = 'new'
        text: 'New Game'
        font_size: 50

<LoadGame>:
    name: 'load_game'

    Button:
        on_release: app.root.current = 'load'
        text: 'Load'
        font_size: 50

我没有更改任何大小的值，我仍然基于 root，我不确定是什么影响了它。

Screenshot of menu.

Answer 1

屏幕管理器是一个相对布局。这是正在发生的事情。 https://kivy.org/docs/api-kivy.uix.relativelayout.html#kivy-uix-relativelayout-common-pitfalls

Answer 2

尝试将按钮放置在 BoxLayout 中。像这样：

FloatLayout:
    canvas:
        Color:
            rgba: 0,0,1,.5
        Rectangle:
            size: root.size
            pos: root.pos
    BoxLayout:
        spacing: 20
        orientation: 'vertical'
        size_hint: (.5, .5)
        pos_hint: {'center_x':.5, 'center_y':.5}
        Button:
        Button: