How best to create grid layouts with varying size components?

E.g.


Or
https://www.gtplanet.net/wp-content/uploads/2016/09/FH3-Expansion-Pass-860x484.jpg

Since UIGridLayout enforces constant size and I’d rather it be adaptable rather than hard coding it.

4 Likes

UIGridLayout is actually specifically designed to support this use case. Simply increase the size of your elements so that they fill multiple cells, and their size will be rounded up to a multiple of the cell size (plus in-between padding).

5 Likes

Nice, Thank you! Could this be added to the wiki entry for UIGridLayout?

2 Likes

It looks like there’s a few bugs, I just gave this a shot myself.

It only worked when I used a UISizeConstraint with MinSize (as opposed to just setting the Size), and it also appeared to not work when you have a UIAspectRatioConstraint parented to the UIGridLayout (which is important if you’re using scale sizing of the CellSize). Additionally, having multi-cell elements causes HorizontalAlignment=center to explode. There were also bugs that caused it to not readjust itself when a cell switched from single-cell to multi-cell as I was editing it. I’ll make sure all of these are filed and that we fix them. I think they’ll be fixed by the new UI backend we’re looking to ship in the coming months.

Yeah, I’ll file a ticket for it.

6 Likes

Thanks, thats probably saved me many hours of head scratching. Guess I’ll put in a hard coded version for now, with the intention to switch after the fixes are live.

1 Like

Ok, I can confirm. UIAspectRatioConstraint really doesn’t like UIGridLayout.


Is there an ETA on this? I’ve been having issues with the constraints that cell sizing has, and combining AspectRatio/SizeConstraint is still dysfunctional. Perhaps cell sizing could be optional? Like how UIListLayouts operate but in both the horizontal and vertical directions.