Perspective Flex Repeater Question

Ignition
1

Hello everyone, I have been working with flex repeaters for a while now, but I've come across an issue/question to see if anyone has a work around for the setup I want to implement...

Essentially I have some hard coded heights/widths:
I have a CellLarge/Medium/Small and then a CellSorter View each instance of the flex repeater is a Cell Sorter card with the Default Width/Size set.

I've got the sizing working great it picks between the different sizes small/medium/large, but I would like to have the views stack on top of eachother for the small views.

This is what my current screen is generating:

image
image1057×195 10.5 KB

I would like to have something like this:

image
image916×249 17.5 KB

Does anyone have any ideas how I could sort it out in this order I already have logic so that it sorts the cards by priority (ex large,medium,small)

I know the mockup sizing looks a bit off but even when sizing correctly where there should be room to stack it doesn't.

2

It would seem like you need 3 flex repeaters. One for each size. Then control the width of each so that it forces however many columns you want.

2 Likes
3

That's a good idea something like 3 flex repeaters with each repeater holding the designated sizes ex: Large/Medium/Small instead of forcing all of the same sizes in one?

4

Yup. There's no way I know of to not get a flex repeater to "best fit" stuff. It's a straight rows/columns type of thing. Which is what you want, but you want it for each type, and it can't do that on its own.

So probably

   <flex row>
     <flex repeater (row) - large> width set to just fit X number of large side by side
     <flex repeater (row)  - medium>width set to just fit X number of medium side by side
     <flex repeater (row) -small>width set to just fit X number of small side by side
5

Also need to Set the flex container (repeater) to wrap in its props