[SOLVED] ListView painting outside of parent on scroll.



  • 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
            }
        }
    }
    

  • Moderators

    @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.



  • @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.


  • Moderators

    @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.


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.