I want to loop through a Container using gridview, but the height and width are different

[laowus]

from flet import *

def main(page: Page):
    page.padding = 0

    grs = GridView(runs_count=3, spacing=30)
    
    for i in range(100):
        grs.controls.append(
            Container(
                content=Text(f"第{i}个"), bgcolor=colors.BLACK38, width=200, height=100
            )
        )

    c = Stack(
        controls=[grs],
        expand=True,
    )

    page.add(c)
app(target=main)

Do the height and width of the child elements of gridview must be of the same size?
Or should I not use gridview

[ndonkoHenri]

I dont think they must be of thesame size.
Do you face any issue?

[laowus]

I dont think they must be of thesame size. Do you face any issue?
I want to layout several elements in a row based on the height and width of the child elements, but it doesn't seem to work

`from flet import *

def main(page: Page):
page.padding = 0

def getImgSrc(i):
    return f"https://picsum.photos/200/200?{i}"

grs = GridView(
    runs_count=3,
    run_spacing=60,
    expand=1,
    padding=10,
    # The height and width of the item are controlled here. If cancelled, the width and height will become the same
    child_aspect_ratio=6,
)

for i in range(1, 200):
    grs.controls.append(
        Card(
            content=Container(
                content=ListTile(
                    leading=Image(src=getImgSrc(i), width=30, height=30),
                    title=Text(
                        f"title{i}", color=colors.WHITE, weight=FontWeight.BOLD
                    ),
                    subtitle=Text(f"writer{i}", color=colors.WHITE),
                ),
                border=border.all(3, colors.PINK_600),
                border_radius=10,
                bgcolor=colors.BLACK,
                opacity=0.7,
            ),
            # Not working
            # How to make items determine height and width
            height=50,
            width=200,
        )
    )

page.add(grs)

app(target=main)
`

[nramirezuy]

I think @huangxulei is trying to build something like this an StaggeredGridView, but aspect ratio is fixed for the entire GridView which forces every element to have the same constraint.

I'm also trying to build something similar, but in my case I want to stretch the height if it can fit the bottom text. I still can achieve this but computing the aspect ratio, but it would be nice to have some sort of auto aspect ratio feature.
But maybe it doesn't even makes sense, since I don't do frontend of any kind 😄