Important: Please read the Qt Code of Conduct -

PathView skipping index 0 when producing new delegate

  • I'm building a calendar control where the user can swipe up and down using a pathway. Starting form an index say (I'm using 2020) swiping up will decrease the current year and swiping down will increase the current year. In theory the user can swipe in either direction for eternity with no boundary because I'm calculation the current year from a function. Everything works but for some reason PathView skips the index zero for each rotation. Index zero is initially produced but it seems it is never revisited.

    The error only occurs for index 0 as far as I can see. Below is my code:
    Any help is appreciated :)

    import QtQuick 2.12
    import QtQuick.Controls 2.12
    PathView {
        id: view
        anchors.fill: parent
        model: 10
        property int dHeight: 350
        property int lastIndex: 0
        property int rotation: 0
        property int startyear: 2020
        delegate: yearDelegate
        path: Path {
            startX: parent.width/2
            startY: -dHeight/2
            PathLine {
                x: parent.width/2
                y: pathItemCount *dHeight-dHeight/2
        focus: true
        pathItemCount: 3
        highlightRangeMode: PathView.NoHighlightRange
        Component {
            id: yearDelegate
            Rectangle {
                id: delegateItem
                width: parent.width
                height: dHeight
                color: "yellow"
                border.color: "black"
                visible: PathView.onPath
                opacity: 0.5
                Text {
                    id: textName
                    anchors.fill: parent
                    horizontalAlignment: Text.AlignHCenter
                    verticalAlignment: Text.AlignVCenter
                    Component.onCompleted: {
                         text = index + ": " + setDelegateIndex(index)
        function setDelegateIndex(index){
            if( (index - lastIndex) > 3 && lastIndex < 5 ){
                rotation = rotation-1;
            if( (lastIndex-index) > 3 && lastIndex > 5 ){
                    rotation = rotation+1;
            var offset = (rotation*10)+index;
            console.log("index: " + index + ", lastIndex: " + lastIndex + ", rotation: " + rotation + ", offset: " + offset)
            lastIndex = index;
            return startyear+offset;

  • Commenting out highlightRangeMode seem to have helped. Could this be a bug?

    //        highlightRangeMode: PathView.NoHighlightRange

  • Note that the default value for PathView is PathView.StrictlyEnforceRange. If it works ok with strictly enforced range and doesn't without it means that the view does something counterintuitive here. I don't have experience with PathView, but I have had a few struggles with ListView's highlightRangeMode setting. I don't think it's a bug, once I understood what it does I simply updated my mental model of it and were able to get it to work the way I wanted. That's the 'fun' part of QML - there's more to learn than meets the eye.

Log in to reply