how to display items from model in varying sizes?

[mzimmers]

Hi all -

I need to display the items of a model on a page that will show the items 4 across, except for certain items which need to be 2x wide as the others.

I tried using a GridView for this:

GridView {
    id: gridView

    property int nbrColumns: 4
    cellWidth: Layout.preferredWidth / nbrColumns
    cellHeight: 72 
    model: 6

    delegate: Pane {
        id: cellPane
        height: GridView.view.cellHeight
        width: (index === 2) ? (GridView.view.cellWidth * 2) : GridView.view.cellWidth

but that produces this:

which is close to what I want, but the item with index 3 should not overlay item 2, but instead be on the next row.

I would try using a GridLayout, but I don't know how I would "feed" model data to a Layout.

Anyone have any other ideas?

Thanks...

[jeremy_k]

@mzimmers said in how to display items from model in varying sizes?:

I would try using a GridLayout, but I don't know how I would "feed" model data to a Layout.

Repeater

[mzimmers]

Perfect. Thanks.

[jakasspeech5]

@jeremy_k said in how to display items from model in varying sizes?:

@mzimmers said in how to display items from model in varying sizes?:

I would try using a GridLayout, but I don't know how I would "feed" model data to a Layout.

Repeater

Thanks