Using FloatLayout

One of the most common layouts is FloatLayout because it allows us to place the children widgets with arbitrary locations and size. The current recipe will use these particularities of FloatLayouts to organize an app with three buttons, one near the inferior left edge, the other one at the center, and the last one at the superior right edge.

Getting ready

This recipe is related to the previous recipe, Organizing with layouts, so it is important to read it and compare it with this recipe. The main difference is how the root widget is now the layout by itself.

How to do it…

In this recipe, we use the following steps to achieve the final goal:

1. In the KV file, define three buttons and set the size_hint and pos_hint properties:

   <MyW>:
       Button:
           id: label1
           size_hint: .2, .2
           pos_hint: {'center_x':.5, 'center_y': .5}
           text: 'B2'
       Button:
           id: label2
           size_hint: .1, .1
           pos_hint: {'x':.1, 'y': .1}
           text: 'B1'
       Button...