beeware / toga

A Python native, OS native GUI toolkit.
https://toga.readthedocs.io/en/latest/
BSD 3-Clause "New" or "Revised" License
4.28k stars 663 forks source link

Grid layout #2162

Open bruno-rino opened 10 months ago

bruno-rino commented 10 months ago

What is the problem or limitation you are having?

The Pack layout is nice, but sometimes you want a table-like layout.

A good example is a form, with labels on the left and input widgets on the right. The labels should only take as much space as they require, and the input widgets should be left aligned.

Describe the solution you'd like

A Grid widget that resembles the CSS Grid specification.

This will mean adapting the pack algorithm.

Describe alternatives you've considered

  1. A simpler Grid that does not try to follow the CSS Grid spec. Something that just lays out widgets in rows and columns, with colspans or rowspans. This would probably already cover most use cases.

  2. A separate Grid layout from Pack (e.g. specified in a widget as style=Grid(...). This would avoid further complexity in the pack algorithm. But a refactoring of pack.py would probably be required to maximise code reuse.

Additional context

No response

freakboy3742 commented 10 months ago

I don't deny the use case; grids are very handy for layout purposes.

I have a mild hesitation to support adding this to Toga's builtin layout, because it would draw development effort away from Colosseum, which is what I consider the "end game" for Toga's layout. That said - Pack exists because Colosseum was taking too long to develop, and in all honesty, it's not seeming likely it will get significant attention any time soon. So - pragmatically, I can see how adding support for a CSS3-grid subset, akin to how Pack is (currently) a CSS3-flexbox subset, could be a workable middle ground.

Regarding implementation, my gut reaction is that I don't think the answer is a completely standalone "Grid()" style object. I think grid is just another option on display - it's currently pack or none; grid would be another option. That's because you can put a pack layout inside a grid layout, and my immediate impression is that it would be difficult (if not impossible) to completely separate the two. That said, I also haven't looked into the problem in depth, so I'd be happy to be proven wrong if a split implementation is workable.

If someone wants to take a look at this problem: Step 1 will be proposing a workable CSS3-grid subset, with a mapping to strict CSS3 that can be used for reference purposes. Having a defined mapping to "pure" CSS3 is an important part of the process - firstly, for debugging purposes, but also for platforms like Web that only have CSS-based rendering options.