Important: Please read the Qt Code of Conduct -

[SOLVED]ListView and moveto specific Section...

  • I am experimenting with a data list split in sections based on section.criteria (I am using the code example from the ListView description):

    @Rectangle {
    id: container
    width: 200
    height: 250

     ListModel {
         id: animalsModel
         ListElement { name: "Parrot"; size: "Small" }
         ListElement { name: "Guinea pig"; size: "Small" }
         ListElement { name: "Dog"; size: "Medium" }
         ListElement { name: "Cat"; size: "Medium" }
         ListElement { name: "Elephant"; size: "Large" }
     // The delegate for each section header
     Component {
         id: sectionHeading
         Rectangle {
             width: container.width
             height: childrenRect.height
             color: "lightsteelblue"
             Text {
                 text: section
                 font.bold: true
     ListView {
         anchors.fill: parent
         model: animalsModel
         delegate: Text { text: name }
         section.criteria: ViewSection.FullString
         section.delegate: sectionHeading


    What I can't figure out so far is the best/optimal QML method to navigate to specific section based on criteria.
    Basically I want the user to press a button named "Small" and move the view to render the the section named Small.

    I thought it will be as easy as just pointing ListView.section to the specific name, but this one is a read only property...
    So should I use Javascript to implement this?

    Many thanks in advance...

    UPDATE: seems like this one is the right direction: ListView::positionViewAtIndex ( int index, PositionMode mode )
    So I just need to make sure I supply the proper index to it based on sections...digging further...

    UPDATE2: well I solved this for my needs...used a js function to go through the ListElements indexes and as soon as category name equals chosen category name positionViewAtIndex is called...

    @function switchCategory() {
    var i = 0
    for (var i=0; i < animalsModel.count; i++)
    if (animalsModel.get(i).size=="Small") { foodlistView.positionViewAtIndex(i, ListView.Contain) }

Log in to reply