如何在 kivy 中使用 pos_hint 和 FloatLayout？

Question

我试图在我的测试中对齐标签和按钮UI这是我的 kv 文件

<test>:   

    Label:        
        text: "foo"
        color: 0,1,0,1
        #pos:120,20
        pos_hint:{"right":0.1,"top":1}
    Label:
        text:"boo"
        color: 0,0,1,1
        #pos:80,20
        pos_hint:{"right":0.1,"top":0.5}

    Label:
        text:"bar"
        color: 1,0,0,1
        #pos:20,120
        pos_hint:{"right":0.1,"top":0.1}
    Button:
        text:"goo"
        size_hint:0.1,0.1

我能够使用 pos 成功创建标签 foo、boo 和 bar，但是当我使用 pos_hint 时 returns空白输出?

Answer 1

您得到 "blank" 输出，因为标签的文本在屏幕外（并且标签本身是透明的）。

由于您的布局 <test> 没有 size_hint 所以它采用 (1,1) 的默认值使其成为 Window 的大小（即 800 x 600).
您的标签也没有 size_hint，因此它们默认使用其父级的 size - 布局，因此它们最终具有 size [800, 600]。标签中的文本默认居中，背景是透明的。（也许你应该先用按钮试试这个，这样你就有了尺寸的直观表示）
因此，文本带有pos = (0,0)的标签将出现在屏幕中央

然后我们让 pos_hint 接受不同的参数（下面的描述对于 FloatLayout 之外的事情可能不准确）：

pos_hint:{"right":v1,"top":v2} 将 pos 设置为 (self.parent.right*v1 - self.width, self.parent.top*v2 - self.height) - 您正在设置要放置的小部件的 top 和 right。因此你的标签得到这样的负坐标，它们的文本永远不会出现在屏幕上（因为左下角是 0,0）

然后我们有 pos_hint:{"x":v1,"y":v2}（您可能会发现它对您的情况更有用）和 pos_hint:{"center_x":v1,"center_y":v2}。你应该能够弄清楚它们是如何工作的，记住大小会影响外观，因为 pos 只设置左下角的坐标。你可以使用这个 .kv 文件：

#:kivy 1.0.9

<test>:   
    #size: (500, 500)
    #size_hint:(None, None)
    canvas:
        Color: 
            rgb: 1,0,0
        Rectangle:
            size: (5,5)
            pos: (0,0)

    Widget:
        id:wig
        pos: (250,250)
        canvas:
            Color: 
                rgb: 1,1,1
            Rectangle:
                size: (5,5)
                pos: self.pos

    Label:
        id: boo
        text:"boo"
        color: 0,0,1,1
        #size_hint:(1,1)
        pos_hint:{"center_x":1,"center_y":1}

    Label:
        id: foo
        text: "foo"
        color: 0,1,0,1
        #size_hint: (.6,.6)
        pos_hint:{"x":1,"y":1}

    Label:
        id: bar
        text:"bar"
        color: 1,0,0,1
        #size:(500,500)
        #size_hint:(None, None)
        pos_hint:{"right":1,"top":1}
        #pos:100, 10


    Button:
        text:"goo"
        size_hint:0.1,0.1
        pos:(1,1)
        #some debug info, i know the code is ugly
        on_press: print self.parent.size,'\n', self.parent.right, self.parent.top, self.parent.x, self.parent.y, self.parent.center_x, self.parent.center_y, "\n","bar_right_top:", bar.pos,"foo_x_y:", foo.pos,"boo_center:", boo.pos, "\nwhite square:", wig.pos, "\n", bar.size, foo.size, boo.size

如何在 kivy 中使用 pos_hint 和 FloatLayout？

How to use pos_hint with FloatLayout in kivy?

python

kivy

kivy-language