Use Section Delegate as Footer of Each Section Instead of Header in QML ListView

Clover

The example on this page uses section delegate as header: http://doc.qt.io/qt-5/qml-qtquick-listview.html#section.property-prop

Are there any methods to use section delegate as footer of each section instead? Can't find it in the document.

Diracsbracket

@Clover
No, there aren't any methods for that.

GrecKo

You could hack it like so :

ListView {
    anchors.fill: parent
    model: ListModel {
        ListElement { name: "Arthur" }
        ListElement { name: "Arlette" }
        ListElement { name: "Bonnie" }
        ListElement { name: "Bernadette" }
        ListElement { name: "Clothilde" }
        ListElement { name: "Charles" }
        ListElement { name: "Clyde" }
        ListElement { name: "Dodo" }
    }
    section {
        property: "name"
        criteria: ViewSection.FirstCharacter
    }
    delegate: Column {
        width: parent.width
        id: column
        ItemDelegate {
            width: parent.width
            text: model.name
        }
        Label {
            visible: column.ListView.section !== column.ListView.nextSection
            text: column.ListView.section
        }
    }
}

Embed the section in each delegate and display it when the section differs from the next one.

Clover

@GrecKo Thank you! I am using a similar hack now.

Solved Use Section Delegate as Footer of Each Section Instead of Header in QML ListView