How to set dynamic cellWidth of gridview?



  • My delegate has different width depending on index.need to set dynamic cellwidth of gridview.as i cant access the index outside delegate how can i set dynamic cellwidth of gridview?



  • hi,
    @Pooja said in How to set dynamic cellWidth of gridview?:

    access the index

    sorry if i misunderstood, you cannot do this ?

    //MyDelegate.qml
    Item{
    property int myIndex 
    ...
    ...
    width : myIndex*5
    }
    
    GridView {
        width: 300; height: 200
    
        model: ContactModel {}
        delegate: MyDelegate{
            myIndex : index
        }
    }
    


  • the answer you have given is accesing index inside level.I want to access index outside the delegate i.e gridview level to set cellwidth dynamic according to index.

    for example
    GridView {
    width: 300; height: 200
    cellwidth:index // I cant write this as index is not accessible outside delegate
    model: ContactModel {}
    delegate: Item{

    }
    

    }



  • Hi @Pooja , first thing is that cellWidth is a common property so if you set cellWidth to 50 then it will affect all the elements inside the gridView, you cant like set different cellWidth for different items at different indexes. Can you tell me what you want your UI to look like so that i can provide a more optimal solution.

    If you want to access index outside the delegate, you can just take a temp variable and update it on any operation or signal,you can access it like this, here is a sample code:-

    GridView {
            id: view
    
            anchors.fill: parent
    
            property int tempIndex: 0
    
            model: 4
            cellWidth: 50 * tempIndex
            cellHeight: 50
    
    
            delegate: Rectangle {
                height: view.cellHeight
                width: view.cellWidth
                color: "red"
                border.color: "black"
    
                Component.onCompleted: {
                    view.tempIndex = index
                }
    
               MouseArea {
                    anchors.fill: parent
                    onClicked: {
                        view.tempIndex = index
                    }
                }
    
                Text {
                    anchors.centerIn: parent
                    text: index
                }
            }
        }


  • 0_1553752336974_gui.png

    yes i know i cant access directly the index outside delegate and i wanted to do it with gridview.


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.