[SOLVED] ListView painting outside of parent on scroll.

[grheard]

I have a listview with a Text delegate. When the view initially loads it paints inside the parent rectangle's boundary just fine. However, when I scroll the listview it paints outside the original boundaries. How can I keep this from happening?

Scrrenshot

Rectangle {
    id: indexView
    width: 100
    height: 300
    color: "transparent"
    border.color: parent.border.color
    border.width: 1
    radius: 10

    // Make the right border adjustable
    MouseArea {
        id: mouseAreaRightBorder

        property int oldMouseX

        anchors.right: parent.right
        anchors.top: parent.top
        anchors.bottom: parent.bottom
        width: 20

        onPressed: {
            oldMouseX = mouseX
        }

        onPositionChanged: {
            if (pressed) {
                indexView.width = indexView.width + (mouseX - oldMouseX)
            }
        }
    }

    ListView {
        id: listView
        anchors.fill: parent
        anchors.margins: 5
        highlightFollowsCurrentItem: true
        currentIndex: -1

        model: cppIndex
        delegate: Text {
            text: modelData
            color: "white"
            width: listView.width
            clip: true

            MouseArea {
                anchors.fill: parent
                onClicked: {
                    listView.currentIndex = index
                    listView.forceActiveFocus()
                }
            }
        }

        highlight: Rectangle {
            color: "gray"
            opacity: 0.5
            border.color: indexView.border.color
            radius: 5
        }
    }
}

[p3c0]

@grheard Please always provide a small compilable example which will exactly show the problem. Some of the properties in your example are undefined.
First guess would be to set clip: true for ListView itself and not its delegate.

[grheard]

@p3c0 said:

@grheard Please always provide a small compilable example which will exactly show the problem. Some of the properties in your example are undefined.
First guess would be to set clip: true for ListView itself and not its delegate.

Sorry. I will provide working examples in the future.

Setting clip for the listview did work in keeping it from drawing outside of the boundaries, but now it draws the a partial entry for that part that would be inside the boundary. I can live with that... for now. I don't know why I didn't think of clip. Since, as you saw, I do have clip set on the Text delegate to keep it from drawing beyond the boundaries.

Thanks.

[p3c0]

@grheard It didn't work because the requirement is to clip beyond the ListView's boundary and not the delegate's one. And so setting clip for ListView did the trick.