GridContainer automatically change number of columns based on parent size

:information_source: Attention Topic was automatically imported from the old Question2Answer platform.
:bust_in_silhouette: Asked By Juxxec


I have the following scene:

I have configured the GridContainer to expand when the size of its parent - the PanelConaiter changes. See the demo project.

I have the GridContainer configured to have only 1 column of items. Is there a way to have the GridContainer automatically change the number of columns when its parent is resized, so that more icons fit per row? If it helps, the size of the items inside the grid container is fixed at 32x32 pixels.

Example project:

Looking for the exact same. It would be great to have an option to make the grids adjust the amount of columns based on what fits.

Does anyone have any suggestions? An option to do this either through scripts or nodes would be great!

Arecher | 2019-09-10 11:15

:bust_in_silhouette: Reply From: MrBlack

A easy solution would be to get the size of the grid container, then divide that by the children width.

var child_size = Grid.get_child(0).size
var old_column_amount = Grid.columns
var new_column_amount = floor(size.x / child_size.x)
if new_column_amount != old_column_amount:
    Grid.columns = new_column_amount
:bust_in_silhouette: Reply From: idbrii

New feature: this PR from Geometror adds the H and V FlowContainers which relayout children on resize. In 4.x and backported to 3.5.

animation demonstrating flow container