Is it possible in kivy GridLayout to specify a particular grid for a particular widget

Question

I have been using PyQt since a long time and i know that if we use QGridLayout in PyQt we can specify a particular widget at a particular grid.

for example

grid = QtGui.QGridLayout()
grid.setSpacing(10)
grid.addWidget(self.Banner,0,0,1,4,QtCore.Qt.AlignTop | QtCore.Qt.AlignCenter)
grid.addWidget(self.RefNo,1,0,1,2)
grid.addWidget(self.RefNoText,1,2,1,2)

where self.banner, self.Refno and self.RefNoText are some widgets. As in this case we can specify widget, then row no. For it and column no. For it. Is it possible in Kivy to do that?

I tried in Kivy but it seems that in Kivy we have to specify rows and columns in starting and then on adding widgets they are arranged by themselves?

Any ideas?

Answer 1

In Kivy, when we add widgets to a GridLayout, we just specify either the rows, columns or both.

We then leave the positioning to Kivy which automatically fills it as per our specifications.

Look at Official Documentation for GridLayout

There is a really nice .gif which explains how widgets are arranged in a GridLayout.

So, the answer to your question is NO. We cannot specify where we want to place a widget, however, all that we can do is add widgets to the GridLayout in such a manner that it positions it correctly.

Initially, I found difficulties in making a widget occupy more space than once cell, like this:

<2 cells><1cell>
+--------+-----+
|Big     |     |
|Widget  |     |
+--------+-----+
|   |    |     |
|   |    |     |
+---+----+-----+

However, this can be solved making the entire row a BoxLayout. Like so:

<1 big BoxLayout>
+--------+-----+
|Big     |     |
|Widget  |     |
+--------+-----+
|   |    |     |
|   |    |     |
+---+----+-----+
<1 more BoxLayout>

This way, each BoxLayout occupies only one cell. The spacing of the widgets can be customized with the BoxLayout and then be placed in the Grid.

Here's how to do that in Kv:

<MyGrid>
    cols=1 # Actually, you can just use a vertical box

    BoxLayout:

        BigWidget:
            # Properties
        SmallWidget:
            # Properties

    BoxLayout:

        SmallWidget:
            # Properties
        SmallWidget:
            # Properties
        SmallWidget:
            # Properties

Kivy will automatically fill the Grid with 1 column

So, by nesting layouts you can get the desired output.

Answer 2

Kivy's GridLayout is simply different to PyQt's, and isn't suitable for this particular purpose.

A natural alternative would be to use a FloatLayout, placing widgets via pos_hint and size_hint. You could even create a FloatLayout subclass that automatically handles positioning in a grid.

As it happens, I've previously created exactly this, you can find my code here. My SparseGridLayout uses a child widget's col and row attributes to position it appropriately. You could also override add_widget to precisely duplicate the qt syntax if you like, but the important thing to understand is how I have used a FloatLayout to place widgets.