Reference Manual: (offline | online) Quickstart: (offline | online)

# ui.grid

Function: ui.grid( | cols, rows, padding=0, transpose=False, **properties)

This creates a layout that places widgets in an evenly spaced grid. New widgets are added to this grid until ui.close is called. Widgets are added by going from left to right within a single row, and down to the start of the next row when a row is full. All cells must be filled (that is, exactly col * rows widgets must be added to the grid.)

The children of this widget should have a fixed size that does not vary based on the space allocated to them. Failure to observe this restriction could lead to really odd layouts, or things being rendered off screen. This condition is relaxed in the appropriate dimension if xfill or yfill is set.

Each cell of the grid is exactly the same size. By default, the grid is the smallest size that can accommodate all of its children, but it can be expanded to consume all available space in a given dimension by setting xfill or yfill to True, as appropriate. (Otherwise, xfill and yfill are inherited from the style.)

cols - The number of columns in this grid.

rows - The number of rows in this grid.

padding - The amount of space to leave between rows and columns.

xfill - True if the grid should consume all available width.

yfill - True if the grid should consume all available height.

transpose - If True, grid will fill down columns before filling across rows.

## Example

    python:
        # Actually draw a slot.
        ui.grid(config.file_page_cols,
                config.file_page_rows,
                 style='file_picker_grid',
                 transpose=True) # slots

        for i in range(0, file_page_length):
            entry(i)

        ui.close() # slots

Reference Manual: (offline | online) Quickstart: (offline | online)