QPathView shows an empty entry after incrementCurrentIndex

[rannamal]

Hi I am trying to create a path view. Please find below the attached sample code snippet. When ever i try to do an incrementCurrentIndex(), I get a empty field at the begining of the pathview and that empty entry is filled with next element when i do decrementCurrentIndex(). How can i make my pathview behave the same both during incrementCurrentIndex() and decrementCurrentIndex() ?

import QtQuick 2.0
 
Item {
    width: 180
    height: 250 
    PathView {
        id: list
        focus: true
        preferredHighlightBegin: 2/5 
        preferredHighlightEnd: 3/5
        highlightRangeMode: PathView.ApplyRange 
        Keys.onUpPressed: decrementCurrentIndex()
        Keys.onDownPressed: incrementCurrentIndex()
        model: 5 
        delegate: Rectangle {
            id: wrapper
	    border.width: 1
	    border.color: "green"
            width: 180
            height: 40 
	    color: "steelblue"
	    Text {anchors.centerIn: parent; text: index; font.bold: wrapper.PathView.isCurrentItem?true:false}
        }
        path: Path {
	    id: path
 
	    startX: 90; startY: 20 
	    PathLine { x: 90; y: 40*(5)}
        }
    }
}

import QtQuick 2.0

Item {
    width: 180
    height: 250 
    PathView {
        id: list
        focus: true
        preferredHighlightBegin: 2/5 
        preferredHighlightEnd: 3/5
        highlightRangeMode: PathView.ApplyRange 
        Keys.onUpPressed: decrementCurrentIndex()
        Keys.onDownPressed: incrementCurrentIndex()
        model: 5 
        delegate: Rectangle {
            id: wrapper
	    border.width: 1
	    border.color: "green"
            width: 180
            height: 40 
	    color: "steelblue"
	    Text {anchors.centerIn: parent; text: index; font.bold: wrapper.PathView.isCurrentItem?true:false}
        }
        path: Path {
	    id: path

	    startX: 90; startY: 20 
	    PathLine { x: 90; y: 40*(5)}
        }
    }
}

To copy to clipboard, switch view to plain text mode 

[anda_skoa]

Have you tried without the preferredHighlightRange?

Cheers,
_

[rannamal]

Anda_skoa, Thanks for your response.

Yes, Tried without preferredHighlightRange, but the response is same. I still have an empty entry towards the top when i incrementCurrentIndex().

But when "highlightRangeMode" is set from "ApplyRange" to "StrictlyEnforceRange" I dont face this issue, the top entry gets filled up automatically, but I lose the advantage of "ApplyRange" over "StrictlyEnforceRange".

Will there be any way to overcome this ? I want to use "ApplyRange" instead of "StrictlyEnforceRange" and still maintain same behavior of pathview during incrementCurrentIndex() and decrementCurrentIndex()

[anda_skoa]

I tried this and what you are seeing is not an empty item but the item not fully fitting anymore an being placed on the other hand.

Actually happens in both scroll directions but you weren't aware of it on the bottom side when scrolling up.

I've modified your example a bit to visualize that

import QtQuick 2.0
 
Item {
    width: 180
    height: 250 
    PathView {
        id: list
        y: 20
        width: parent.width
        height: 5 * 40
 
        focus: true
        preferredHighlightBegin: 2/5
        preferredHighlightEnd: 3/5
        highlightRangeMode: PathView.ApplyRange 
        Keys.onUpPressed: decrementCurrentIndex()
        Keys.onDownPressed: incrementCurrentIndex()
        model: 5 
        delegate: Rectangle {
            id: wrapper
	    border.width: 1
	    border.color: "green"
            width: 180
            height: 40 
	    color: "steelblue"
	    Text {anchors.centerIn: parent; text: index; font.bold: wrapper.PathView.isCurrentItem?true:false}
        }
        path: Path {
	    id: path
 
	    startX: 90; startY: 0 
	    PathLine { x: 90; y: 40*(5)}
        }
    }
 
    Rectangle {
        anchors.fill: list
        color: "red"
        opacity: 0.3
    }
}

import QtQuick 2.0

Item {
    width: 180
    height: 250 
    PathView {
        id: list
        y: 20
        width: parent.width
        height: 5 * 40

        focus: true
        preferredHighlightBegin: 2/5
        preferredHighlightEnd: 3/5
        highlightRangeMode: PathView.ApplyRange 
        Keys.onUpPressed: decrementCurrentIndex()
        Keys.onDownPressed: incrementCurrentIndex()
        model: 5 
        delegate: Rectangle {
            id: wrapper
	    border.width: 1
	    border.color: "green"
            width: 180
            height: 40 
	    color: "steelblue"
	    Text {anchors.centerIn: parent; text: index; font.bold: wrapper.PathView.isCurrentItem?true:false}
        }
        path: Path {
	    id: path

	    startX: 90; startY: 0 
	    PathLine { x: 90; y: 40*(5)}
        }
    }

    Rectangle {
        anchors.fill: list
        color: "red"
        opacity: 0.3
    }
}

To copy to clipboard, switch view to plain text mode 

The rectangle visualizes where the view's are actually is, you see that no matter which direction you scroll you have white space on the other end.
I've moved the view a bit downwards as well so that the "overlap" is also visible on both sides.
I've also modified the path so that is starts at the beginning of the view and extends to just the end of the view.

Now try the same thing with preferredHighlightBegin and preferredHighlightEnd set to 0.5

Cheers,
_

[rannamal]

Tried out your sample. Yes it behaves the same for increment and decrement. More over as you have pointed out if the preferredHighlightBegin and preferredHighlightEnd are set to the same value then I dont face any shift issues. Thanks for your efforts anda_skoa