add support for flexboxes?

[SpaceCat-Chan]

flexboxes allow much easier creation of certain things, like elements that take all remaining horizontal space

are you planning on supporting flexboxes?

[mikke89]

First of all, did you try the RCSS tables support? We support flexible sizing there as an extension over CSS, so that might be enough to suit your needs.

I understand flexbox might be convenient in some situations. However, it's also a fairly complex feature that adds 12 new RCSS properties, and then we might also want to add grid support which is something like 15 additional properties.

I think our flexible size tables will cover many needs from flex boxes, so this is not a priority for me personally, their complexity to benefit ratio is too high as I see it. However, if someone comes up with a PR of a clean implementation of flexboxes, I'm happy to add it to the library.

[SpaceCat-Chan]

i don't fully understand how to use the flexible sizing extension, could you point me to an example?

[Dakror]

Check the documentation regarding the width & height calculation algorithm. This is more advanced than regular tables and you can create complex grids with it: https://mikke89.github.io/RmlUiDoc/pages/rcss/tables.html

Check here for the fr unit: https://css-tricks.com/introduction-fr-css-unit/

[mikke89]

So in essence, flexible size is achieved by using width ≥ 100%. A very basic example would be something like

<table>
<td width="150px">A</td>
<td width="100%">B</td>
<td width="200%">C</td>
</table>

Now column A is fixed at 150px wide, and column B and C fills the rest of the width, with C being twice the size of B.

[SpaceCat-Chan]

what if i don't know the width of A but i still want it to be minimum width?

[mikke89]

Hm, in that case I don't think there is an easy solution in pure RCSS. You could work around it using C++ to get the width first, but it's not a pretty solution.

[mikke89]

Alright, there has been quite a lot of requests for flexbox from several users, and I'm all for adding it at this point. This one might take a while though, unless somebody wants to beat me to it? :)

[paulocoutinhox]

Nice! Thanks for the great work man!

[mnba]

@mikke89 Can you please occassionally, like once in 3/few months, inform us on the news? About flexbox in RmlUI. Thanks.

[mikke89]

I appreciate the interest, but there isn't really much news on this feature. I haven't found the time yet to really dive into this, only been tinkering briefly with it.

[mikke89]

Hey guys, after working on this for some time now, I've opened a pull request #257 implementing flexbox layout.

I think it's pretty close now, but I could need some help with testing. Let me know how it works in your use cases, cheers!

[mikke89]

Alright, flexbox layout #257 is done and merged into master :)

Closing this one, please open new issues if you discover problems with the implementation.