Page MenuHome

UI Layout: GridFlow

Authored by Bastien Montagne (mont29) on Dec 4 2016, 12:47 PM.
"Love" token, awarded by 0o00o0oo."Love" token, awarded by -L0Lock-."Love" token, awarded by stephen_leger."Love" token, awarded by codemanx."Mountain of Wealth" token, awarded by januz."Mountain of Wealth" token, awarded by sybren."Like" token, awarded by michaelknubben."Like" token, awarded by duarteframos.



The idea of the grid flow layout share some aspects with our column flow one, and the spreadsheet concept.

You can fill it with sub-items either column by column, or row by row.

You can enforce a specific number of columns, use purely auto-computed one (based on available width), or auto-compute number of columns multiple of specified value.

Columns and rows can be even, or adapt to needed space by their sub-items.

Unlike column flow, there is always only one item per row and column (per cell).

The auto-compute of columns number tries to be smart and 'fill' its rows and columns as best as possible. E.g. if you have a row-major gridflow layout with four items, it will never go to a three-columns layout (because 4 items fill better either 2×2, 4×1 or 1×4 grids).

Only piece of code to review here (if you feel like doing so ;) ) is the UILayoutGridFlow related one.

This patch also has some py ui script tweaks, and some hacks in UI code, done for experimental purpose and discussion/proposal, those are by no mean intended to be committed, quite obviously.

I started working on this layout with the idea of getting something usable in panels to e.g. display sets of images or other assets. Ideally, I ’d also like to use it to replace manual drawing of entries in file browser or UIList (especially the grid case), but there are more issues to solve here first (we need to get auto-computed grid size back from the layout engine, to handle amount of items to draw, scrolling, etc.).

Also, found on the way it could be an interesting solution for 'resize layout' issue (e.g. with panels, often large ones waste a lot of space, while narrow ones become unusable), so did very quick experiment with Influence panel of textures (very easy case of course, gif, click to see animation):

Main issue here currently is that UI code reports fixed huge 'ideal' dimension for its buttons in many, many case, instead of checking their actual required width. Not sure why, this needs more investigation.

Diff Detail

rB Blender
Build Status
Buildable 1743
Build 1743: arc lint + arc unit

Event Timeline

Bastien Montagne (mont29) retitled this revision from to Initial (and theorical) code for grid flow layout..
Bastien Montagne (mont29) updated this object.
Bastien Montagne (mont29) retitled this revision from Initial (and theorical) code for grid flow layout. to UI Layout: GridFlow.Dec 4 2016, 1:13 PM
Bastien Montagne (mont29) updated this object.
Julian Eisel (Severin) edited edge metadata.

From a quick glance, patch looks good, just the usual minor nitpickings :)

Ideally, I ’d also like to use it to replace manual drawing of entries in file browser

I guess you're only (or mainly) referring to file browser thumbnail display mode? For the other ones (and for non-grid uiLists) my uiTable API work should be better suited.


Guess this is a good case where C99 compound literals can be useful to avoid having to pass a bunch of arguments as NULL. (Like here)


I realize there's no real benefit of it other than having an abstraction in between, but this could just use BLI_array_alloca?


Some of these ints are in fact booleans, would it confuse RNA if we use bool instead?

This revision is now accepted and ready to land.Feb 10 2017, 5:56 PM
-L0Lock- added a subscriber: -L0Lock-.
Bastien Montagne (mont29) marked 2 inline comments as done.Jun 3 2018, 6:24 PM
Bastien Montagne (mont29) added inline comments.

Yep, RNA prevents us from using bool (and const too, btw), unless we want to add a level of wrapper ;)

  • Merge branch 'master' into ui_layout_gridflow
  • Merge branch 'blender2.8' into ui_layout_gridflow
  • Some cleanup/refactor from code review.
  • Merge branch 'blender2.8' into ui_layout_gridflow
  • Deduplicate some code, new solution to the fixed-estimated-size problem.
  • Some more tweaks and cleanup.