QML ShapePath clear path elements

Question

I want to remove all path elements from my ShapePath. Since pathElements is a Qml list, the only way to modify it is by setting it to a new Javascript array. Therefore, I expected to be able to clear it by just assigning an empty array to it.

I tried path.pathElements = [], which does not work for me.

Then I tried path.pathElements = null, which does work (PathLine is no longer drawn), but it prints this ugly error message: QObject::connect: Cannot connect (nullptr)::changed() to QQuickShapePath::processPath()

Any other ideas?

Code to reproduce:

Shape {
    anchors.fill: parent

    ShapePath {
        id: path

        strokeWidth: 2
        strokeColor: "green"
        fillColor: "green"

        Component.onCompleted: path.pathElements = []

        PathLine { x: 50; y: 50 }
    }
}

Answer 1

I filed a bug report at Qt and they confirmed my bug.

The workaround until this gets fixed is to first assign null, followed by [].

Shape {
    anchors.fill: parent

    ShapePath {
        id: path

        strokeWidth: 2
        strokeColor: "green"
        fillColor: "green"

        Component.onCompleted: {
            path.pathElements = null
            path.pathElements = []
        }

        PathLine { x: 50; y: 50 }
    }
}

Answer 2

I know that's an old post, but a real solution exist better than the previous one

According to the datasheet, the pathLine appended to a shapePath consists of a list of PathElements (list) . So, a solution exist to clear a list in javascript

Path datasheet : https://doc.qt.io/qt-6/qml-qtquick-path.html

See my example, my shapePath is named cropPath:

    Shape{
        id: cropShape
        anchors.fill: parent
        property alias cropPath: cropPath
        ShapePath{
            id: cropPath

            startX: 0
            startY: 0
            fillColor: "#42ff00ff"
            strokeColor: "black"
            strokeWidth: 1
            dashPattern: [4, 5]
            strokeStyle: ShapePath.DashLine
            capStyle: ShapePath.RoundCap

        }
    }

function removePathElement(){
    cropPath.pathElements.splice(0, cropPath.pathElements.length)
}

an other solution is :

function removePathElement(){
    while (cropPath.pathElements.length > 0)
        cropPath.pathElements.pop()
}

according to this answer, the first solution is "a lot faster" : How do I empty an array in JavaScript?

ps: thanks @skaldesh, your solution helped me a lot since I discovered that