CODEWITHSUNDEEP
qmlqlistview
user2434040
user2434040

Reputation: 61

Getting elements from a QML list

I am implementing a list view with a more button in QML. The list and button will look like this “a b c d e moreButton” . ( Where a b c d and e are elements of a string) and my list will have more than 5 elements. After clicking the more button I need to get the next 5 elements from the list . Say “f g h i j “ and so on it should continue till all the elements in the list are displayed. My question is how can I get the first 5 , 2nd 5 and so on elements from the list ? Any help is appreciated.

Upvotes: 0

Views: 916

Answers (1)

Amit Tomar
Amit Tomar

Reputation: 4858

You can do something like this :

ListView
{
    id: view
    x: 50
    width: 200; height: 500

    property variant alphabetArray: ['a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z' ]


    function append(  )
    {
        // @ToDoyourself : Check all the boundary conditions in this function

        var loopTime = alphabetModel.count
        for( var i = loopTime ; i <= loopTime+5 ; ++ i )
            alphabetModel.append({ "name" : alphabetArray[i] })
    }

    model:  ListModel
    {
        id: alphabetModel
        ListElement {  name: "a"   }
        ListElement {  name: "b"   }
        ListElement {  name: "c"   }
        ListElement {  name: "d"   }
        ListElement {  name: "e"   }
    }

    footer:

        Text
        {
            text : "More" ; font.pixelSize: 35 ; color : "grey"
            MouseArea
            {
                anchors.fill: parent
                onClicked:
                {
                    append()
                }
            }
        }


    delegate:
    Item
    {
        height: 100

        Text
        {
            text: name
            height: 20
            font.pixelSize: 30
            color: index === view.currentIndex ?  "black" : "red"

            MouseArea
            {
                anchors.fill: parent
                onClicked: view.currentIndex = index
            }
        }
    }
}

Note: In the function append() I haven't done any boundary checks on the array. Do that as an exercise yourself.

Upvotes: 2

Related Questions