Add support for `for` and `if` in `GridLayout`

[tronical]

trafficstars

After #349 outlined that there were build errors - and those are fixed now - it would still be desirable to use if and for in grid layouts.

[ogoffart]

Some implementation instructions are in https://github.com/sixtyfpsui/sixtyfps/discussions/574#discussioncomment-1475441

We need to find a behavior of what happens to column and row detection when there is a if or a for. for a if it could simply be like for a normal item which would just be hidden when false.

for a for we could force them to be a single row (or a single column?).

[tronical]

I can think of four different ways of writing a "dynamic" grid layout:

1. Create a variable number of rows:

GridLayout {
    for item in model: Row {
        // ...
    }
}

2. Create a variable number of columns:

GridLayout {
    Row {
        for item in model: Column {
            // ...
        }
    }
}

3. Create a variable number of columns:

GridLayout {
    for item in model: Rectangle {
        // ...
    }
}

4. Mad-max:

GridLayout {
    for item[i] in model: Rectangle {
        row: i / 4;
        col: mod(i, 4);
    }
}

I guess (1)-(3) are special cases of (4), but is it even possible to implement that?

[FlorentBecker]

Would it be possible to have a StaticGridLayout with a fixed num_rows and num_cols which accepts for loops?

[ogoffart]

Would it be possible to have a StaticGridLayout with a fixed num_rows and num_cols which accepts for loops?

Yeah, i think this would make sense to have these properties in the GridLayout. we would also need a flow-direction property then.

[FlorentBecker]

Another solution would be to add a support for wrapping to HorizontalLayout and VerticalLayout (à la flex-wrap in css).

[Tastaturtaste]

Has there been any progress on this one? What is a possible workaround?

[ogoffart]

Right now, the workaround is to use HorizontalLayout in VerticalLayout. Or to do the layouting "manually" using x, y bindings

[coufxr]

I'm sorry, I would like to know if there are other dynamic methods with better performance than using for in Rectangle? Or, could you tell me what the current best method is for dynamically drawing grids?

[petrostrak]

I'm sorry, I would like to know if there are other dynamic methods with better performance than using for in Rectangle? Or, could you tell me what the current best method is for dynamically drawing grids?

Would love that too, thanks!