Kivy - Layouts



The Kivy application window holds one widget at a time. Hence, if you try to add two buttons, only the second will be displayed. On the other hand, a good GUI needs different widgets i.e. labels, text input boxes, buttons etc. to be ergonomically placed. For this purpose, Kivy framework provides layouts. Layout itself is a widget capable of holding other widgets inside it. Layout therefore is called as a container widget

In Kivy, different types of layout containers are available. All of them implement Layout interface, defined in the "kivy.uix.layout" module. The Layout interface itself inherits the Widget class.

Two of the most important methods of this interface are −

  • add_widget()

  • remove_widget()

add_widget()

This method is used to Add a new widget as a child of this layout. Its syntax is like this −

add_widget(self, widget, *args, **kwargs)

Parameters

  • widget − Widget to add to our list of children.

  • index − index to insert the widget in the list. Notice that the default of 0 means the widget is inserted at the beginning of the list and will thus be drawn on top of other sibling widgets.

  • canvas − Canvas to add widget's canvas to. Can be 'before', 'after' or None for the default canvas.

remove_widget

This method is used to remove a widget from the children of this widget. Here is its syntax −

remove_widget(self, widget, *args, **kwargs)

Where, the parameter "widget" stands for the widget that is to be removed from the children list.

Note that Layout is an interface, and hence it can not be used directly. The Layout classes that implement these methods are the concrete classes as in the following list −

Sr.No Methods & Description
1

AnchorLayout

Widgets can be anchored to the 'top', 'bottom', 'left', 'right' or 'center'.

2

BoxLayout

Widgets are arranged sequentially, in either a 'vertical' or a 'horizontal' orientation.

3

FloatLayout

Widgets are essentially unrestricted.

4

RelativeLayout

Child widgets are positioned relative to the layout.

5

GridLayout

Widgets are arranged in a grid defined by the rows and cols properties.

6

PageLayout

Used to create simple multi-page layouts, in a way that allows easy flipping from one page to another using borders.

7

ScatterLayout

Widgets are positioned similarly to a RelativeLayout, but they can be translated, rotated and scaled.

8

StackLayout

Widgets are stacked in a lr-tb (left to right then top to bottom) or tb-lr order.

In the subsequent chapters, we shall discuss each of these layouts in detail with relevant examples.

Advertisements