Question

我想在我的kivy应用程序上使用固定宽度的右侧边栏，该侧边栏带有按钮列表和一个用于绘制内容的主要区域，我不确定哪一种是正确的处理方式（即哪种布局），这就是我在哪里到目前为止：

layoutApp.py ...

from kivy.app import App

class layoutApp(App):
    pass

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

和 layoutApp.kv ...

BoxLayout:
    orientation: 'vertical'
    BoxLayout:
        Button:
            size_hint_x: 2
        BoxLayout:
            orientation: 'vertical'
            size_hint_x: 0.5
            Button:
            Button:
            Button:
            Button:

哪个会产生：

问题在于尺寸是相对的，即，右侧边栏的宽度会根据屏幕的抓取/调整大小而改变，这不是预期的行为。

谢谢！

Answer 1

您可以设置侧边栏的宽度，然后通过使用ids来设置较大的按钮宽度：

BoxLayout:
    id: top_box
    orientation: 'vertical'
    BoxLayout:
        Button:
            size_hint_x: None
            width: top_box.width - bottom_box.width
        BoxLayout:
            id: bottom_box
            orientation: 'vertical'
            size_hint_x: None
            width: 150
            Button:
            Button:
            Button:
            Button:

Answer 2

对@John_Anderson进行了细微的修改，顶部的按钮对齐了：

BoxLayout:
    id: top_box
    orientation: 'vertical'
    BoxLayout:
        Button:
            size_hint_x: None
            width: top_box.width - bottom_box.width
        BoxLayout:
            padding: 4
            id: bottom_box
            orientation: 'vertical'
            size_hint_x: None
            width: 200
            spacing: 2
            Button:
                id: button_1
                background_normal: ''
                background_color: .2, .2, .2, 1
                text: 'Button 1'
                color: .6, .6, .6, 1
                size_hint_x: None
                size_hint_y: None
                width: 192
                height: 40
            Button:
                id: button_2
                background_normal: ''
                background_color: .2, .2, .2, 1
                text: 'Button 2'
                color: .6, .6, .6, 1
                size_hint_x: None
                size_hint_y: None
                width: 192
                height: 40
            Button:
                id: button_3
                background_normal: ''
                background_color: .2, .2, .2, 1
                text: 'Button 3'
                color: .6, .6, .6, 1
                size_hint_x: None
                size_hint_y: None
                width: 192
                height: 40
            Button:
                id: button_4
                background_normal: ''
                background_color: .2, .2, .2, 1
                text: 'Button 4'
                color: .6, .6, .6, 1
                size_hint_x: None
                size_hint_y: None
                width: 192
                height: 40
            Widget:

结果：

Kivy侧边栏以及内容布局

2 个答案: