import QtQuick 2.9
import QtQuick.Layouts 1.15
import QtQuick.Window 2.15

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    ListModel {
        id: myModel
        ListElement { name: "Element 1"}
        ListElement { name: "Element 2"}
        ListElement { name: "Element 3"}
        ListElement { name: "Element 4"}
        ListElement { name: "Element 5"}
        ListElement { name: "Element 6"}
    }

    ListView {
        anchors.fill: parent
        model: myModel
        clip: true
        headerPositioning: ListView.OverlayHeader
        footerPositioning: ListView.OverlayHeader

        delegate: Text {
            height: 100
            text: name
        }

        header: Rectangle {
            width: parent.width
            height: 50
            z: 2
            color: "blue"
            MouseArea {
                anchors.fill: parent
                onClicked: {
                    console.log("header onClicked")
                }
            }
        }
        footer: Rectangle {
            width: parent.width
            height: 50
            color: "red"
            z: 2
            MouseArea {
                anchors.fill: parent
                onClicked: {
                    console.log("footer onClicked")
                }
            }
        }
    }
}