Wie benutzt man pos_hint mit FloatLayout in kivy?

Question

Ich versuche, Etiketten und Knopf in meinem Test UI auszurichten diese meine kv-Datei Ich bin in der Lage zu erfolgreich erstellen Etiketten Foo, boo und Leiste ist

<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 aber wenn verwenden ich pos_hint es Gibt leere Ausgabe zurück?

Answer 1

Sie erhalten eine "leere" Ausgabe, da der Text der Beschriftungen nicht auf dem Bildschirm angezeigt wird (und die Beschriftungen selbst sind transparent).

1. Da Ihr Layout <test> hat keine size_hint, so dass es auf dem Verzug (1,1) nimmt, die sie die Größe des Window (die 800 x 600 ist) macht.
2. Ihre Etiketten haben auch keine size_hint, so dass sie standardmäßig auf die size ihrer Eltern - das Layout, so dass sie am Ende size [800, 600] haben. Der Text in den Beschriftungen ist standardmäßig zentriert und ihr Hintergrund ist transparent. (Vielleicht sollten Sie diese mit den Tasten zuerst versuchen, so dass Sie eine visuelle Darstellung der Größen haben)
3. Damit ist der Text ein Etikett mit pos = (0,0) in der Mitte des Bildschirms erscheint

Dann haben wir die pos_hint verschiedene Argumente (die unten stehende Beschreibung für Dinge außerhalb einer FloatLayout möglicherweise nicht genau sein) unter:

pos_hint:{"right":v1,"top":v2} setzt die pos zu (self.parent.right*v1 - self.width, self.parent.top*v2 - self.height) - Sie top und right von th setzen Das Widget, das Sie platzieren. So Ihre Etiketten solche negativen bekommen koordiniert, dass ihre Texte nie auf dem Bildschirm angezeigt (da unten links 0,0 ist)

dann haben wir pos_hint:{"x":v1,"y":v2} (die Sie finden können nützlicher für Ihren Fall) und pos_hint:{"center_x":v1,"center_y":v2}. Sie sollten in der Lage sein, herauszufinden, wie sie arbeiten, bedenkt, dass die Größe beeinflusst, wie die Dinge aussieht, da pos nur die untere linke Koordinate setzt .. Sie können mit dieser .kv-Datei:

#: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