Multiline text item is not clipped inside QML ListView

Question

I have a QML page that with a GridLayout that contains the page title, ListView and close button:

    GridLayout {
        columns: 1
        rows: 5

        anchors.fill: parent

        <page title item>....

        ListView
        {
            spacing: 15

            model: logModel

            delegate: Item {
                implicitWidth: parent.width
                implicitHeight: grid.height

                RowLayout
                {
                    id: grid
                    spacing: 0
                    width: parent.width
                    height: commentLabel.implicitHeight

                    <icon>....

                    Label {
                        id: commentLabel
                        Layout.fillWidth: true
                        text: comment
                        wrapMode: Label.Wrap
                    }
                }
            }

            ScrollIndicator.vertical: ScrollIndicator { }
        }

        <close button>...
}

When I scroll the list, the first and the last visible item in the list may go beyond the list bounder and intersect the page title or close button:

How to prevent this and make the items clipped?

EDIT1:

I tried to add

clip: true

to ListView, delegate Item, RowLayout and Label, but with no success. According to docs, ListView with clip property set to true should clip its content, should not it?

I found a similar question where clip property is the answer, but it is not clear why it does not work with my ListView.

My QT version is 5.13.2.

Answer 1

Set clip:true in the ListView component.

ListView
{
    clip:true
}