Kivy:获取一个固定大小的小部件显示在窗口的中心

时间:2014-05-19 15:17:10

标签: python kivy

我已经把头发拉了几个小时。我有一个子类RelativeLayout的自定义小部件,它需要具有固定的大小。我希望这个小部件显示在窗口的中心。我还希望在其周围显示其他正常的小部件(即按钮)。在花了一整天把事情放在第一位的中心之后,我现在发现在添加一个按钮时它会抵制我尝试让它表现出来的所有尝试。请有人看看我的.kv文件并告诉我哪里出错了?

#:kivy 1.8.0

# This is my fixed-size widget
<DrawableGrid>:
    # Note: this is just an example size to keep things simple
    size: 500, 500
    canvas:
        Color:
            rgba: 1, 0, 0, 1
        Rectangle:
            pos: self.pos
            size: self.size

# This subclasses BoxLayout    
CustomLayout:
    orientation: "vertical"

    # I put my DrawableGrid inside an AnchorLayout in the hope that it might
    # behave in some way like the documentation says it does. No such luck.
    # This should be taking up the entire top half of the window.
    AnchorLayout:
        size_hint: 1, 1
        # This anchor_x/anchor_y stuff seemingly does nothing.
        anchor_x: "center"
        anchor_y: "center"

        # This should be appearing as a red rectangle of size 500x500
        DrawableGrid:
            # This next line was needed to set a custom size in the first place
            size_hint: 0, 0

    # This appears exactly as expected, filling the bottom half of the window.
    Button:
        id: next_button
        text: "Next"

所以,重申一下,我现在想要的是:

  • 窗口水平分成两半(即上半部分和下半部分)
  • 上半部分应该包含我的自定义小部件,大小为500x500,居中,没有别的。这应显示为红色方块。
  • 下半部分应包含一个带有文字&#39; Next&#39;的按钮,填满整个下半部分。

我真正得到的是: Screenshot (正如你所看到的,红色广场显然不存在)

我已经尝试了许多不同的方式(有些比其他方式更多的hacky)来完成这项工作,但无济于事。有人可以建议我如何解决这个问题吗?

2 个答案:

答案 0 :(得分:1)

我认为你想要一个垂直的BoxLayout作为你的根小部件。 root中的第一个小部件是RelativeLayout,第二个小部件是你的按钮。这将为您提供50/50分屏。 RelativeLayout将包含您的500x500小部件,其位置为(self.parent.width-self.width)/ 2,(self.parent.height-self.height)/ 2

注意:在下面的代码示例中,我使用100x100作为小部件,因为500x500不适合我的屏幕。

from kivy.app import App
from kivy.lang import Builder
from kivy.uix.boxlayout import BoxLayout


kv = """
<Test>:
    orientation: "vertical"
    RelativeLayout:
        GridLayout:
            pos: (self.parent.width-self.width)/2, (self.parent.height-self.height)/2
            size_hint: None, None
            size: 100, 100
            canvas:
                Color:
                    rgba: 1, 0, 0, 1
                Rectangle:
                    pos: self.pos
                    size: self.size

    Button:
        text: "Next"
"""

Builder.load_string(kv)


class Test(BoxLayout):
    def __init__(self, **kwargs):
        super(Test, self).__init__(**kwargs)


class TestApp(App):
    def build(self):
        return Test()

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

答案 1 :(得分:0)

RelativeLayout将所有孩子定位在布局的位置。这包括所有绘图说明 - 因为所有孩子都是。所有布局的孩子都在canvas上绘制,因此canvas中使用的位置必须相对于布局本身!因此,当您在canvas中说明在self.pos处绘制矩形时,该位置就像其他任何子项一样被翻译(换句话说,矩形是在self.pos + self.pos绘制的)。如果您将矩形pos更改为0, 0,那么它将按预期绘制。

为了帮助解释,以下是RelativeLayout的默认样式(来自kivy/data/style.kv):

<RelativeLayout>:
    canvas.before:
        PushMatrix
        Translate:
            xy: self.pos
    canvas.after:
        PopMatrix

您放入canvas的任何内容都发生在canvas.beforecanvas.after之间。