在 Kivy 的 BoxLayout 中定位多个小部件。答案

【问题标题】：Positioning multiple widgets in a BoxLayout in Kivy.在 Kivy 的 BoxLayout 中定位多个小部件。
【发布时间】：2017-03-19 05:30:57
【问题描述】：

我在水平 boxlayout 中有两个小部件。 Afaik 他们都将伸展以填满盒子布局的一半。如何在 boxlayout 中调整小部件的大小和重新定位？是否值得将每个小部件放在自己的 boxlayout 中，这样它就不会受到旁边的小部件的影响？到目前为止，这是我的代码：

from kivy.app import App
from kivy.uix.label import Label
from kivy.lang import Builder
from kivy.properties import ListProperty
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.dropdown import DropDown
from kivy.uix.button import Button
from kivy.uix.textinput import TextInput

from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition

class ShoppingListScreen(Screen):
    pass

class theScreenManager(ScreenManager):
    pass

root_widget = Builder.load_string('''
#:import FadeTransition kivy.uix.screenmanager.FadeTransition

theScreenManager:
    ShoppingListScreen:

<ShoppingListScreen>:
    BoxLayout:
        orientation: 'vertical'

        BoxLayout:
            orientation: 'horizontal'
            size_hint: 1, .3
            Button:
                text: '<'
                size_hint: .1, 1
                font_size: 75
                background_normal: ""
                background_color: 0.18, .5, .92, 1
                on_release: app.root.current = 'main' 

            Label:
                text: 'Login'
                halign: 'left'
                font_size: 50
                canvas.before:
                    Color:
                        rgb: 0.18, .5, .92
                    Rectangle:
                        pos: self.pos
                        size: self.size
            Widget:
                size_hint: .1, 1
                canvas.before:
                    Color:
                        rgb: 0.18, .5, .92
                    Rectangle:
                        pos: self.pos
                        size: self.size
        BoxLayout:
            orientation: 'vertical'
            canvas.before:
                Color:
                    rgb: 1, 1, 1
                Rectangle:
                    pos: self.pos
                    size: self.size
            BoxLayout:
                orientation: 'horizontal'
                padding_left: 250
                Label:
                    text: 'Username:'
                    font_size: 25
                    color: 0.18, .5, .92, 1
                    size_hint: .2, .5
                    pos_hint: {'top': 1}
                TextInput:
                    size_hint: .3, .1
        Button:
            text: 'Register'
            font_size: 35
            size_hint: 1, .3
            background_normal: ""
            background_color: 0.18, .5, .92, 1
            #on_release: app.root.current = 'main' 

        Label:
            text: 'Support'
            color: 0.18, .5, .92, 1
            halign: 'left'
            font_size: 25
            size_hint: 1, .3
            canvas.before:
                Color:
                    rgb: 1, 1, 1
                Rectangle:
                    pos: self.pos
                    size: self.size


''')

class temprecipeapp(App):
    def build(self):
        return root_widget

if __name__ == "__main__":
    temprecipeapp().run()

如果您运行此文件，您将看到用户名和文本输入框处于交叉位置。我试图让它们居中并将它们放在一起。我该怎么做呢？

【问题讨论】：

标签： python kivy

【解决方案1】：

也许这会有所帮助：
我只是导入 GridLayout 并使用 Label:Usename 和 TextInput 将部分从 BoxLayout 更改为 GridLayout。

from kivy.app import App
from kivy.uix.label import Label
from kivy.lang import Builder
from kivy.properties import ListProperty
from kivy.uix.boxlayout import BoxLayout
from kivy.uix.gridlayout import GridLayout
from kivy.uix.dropdown import DropDown
from kivy.uix.button import Button
from kivy.uix.textinput import TextInput

from kivy.uix.screenmanager import ScreenManager, Screen, FadeTransition

class ShoppingListScreen(Screen):
    pass

class theScreenManager(ScreenManager):
    pass

root_widget = Builder.load_string('''
#:import FadeTransition kivy.uix.screenmanager.FadeTransition

theScreenManager:
    ShoppingListScreen:

<ShoppingListScreen>:
    BoxLayout:
        orientation: 'vertical'

        BoxLayout:
            orientation: 'horizontal'
            size_hint: 1, .3
            Button:
                text: '<'
                size_hint: .1, 1
                font_size: 75
                background_normal: ""
                background_color: 0.18, .5, .92, 1
                on_release: app.root.current = 'main' 

            Label:
                text: 'Login'
                halign: 'left'
                font_size: 50
                canvas.before:
                    Color:
                        rgb: 0.18, .5, .92
                    Rectangle:
                        pos: self.pos
                        size: self.size
            Widget:
                size_hint: .1, 1
                canvas.before:
                    Color:
                        rgb: 0.18, .5, .92
                    Rectangle:
                        pos: self.pos
                        size: self.size
        GridLayout:
            cols: 2
            rows: 1
            size_hint: 1, .1
            canvas.before:
                Color:
                    rgb: 1, 1, 1
                Rectangle:
                    pos: self.pos
                    size: self.size            

            Label:
                text: 'Username:'
                font_size: 25
                size_hint: .3, 1
                color: 0.18, .5, .92, 1             
                pos_hint: {'center': 1}

            TextInput:
                size_hint: .7, 1
                font_size: 25
        Button:
            text: 'Register'
            font_size: 35
            size_hint: 1, .3
            background_normal: ""
            background_color: 0.18, .5, .92, 1
            #on_release: app.root.current = 'main' 

        Label:
            text: 'Support'
            color: 0.18, .5, .92, 1
            halign: 'left'
            font_size: 25
            size_hint: 1, .3
            canvas.before:
                Color:
                    rgb: 1, 1, 1
                Rectangle:
                    pos: self.pos
                    size: self.size


''')

class temprecipeapp(App):
    def build(self):
        return root_widget

if __name__ == "__main__":
    temprecipeapp().run()

【讨论】：