canvas code blocks closing of qml main window

JoeCFD

Canvas is added to a rectangle to draw an image and a polygon. The rectangle with drawing is displayed correctly. Then qml main window can not be closed anymore when another button is clicked. The code works normally without canvas. What could be the reason?

Canvas {
     onPaint: {
        var ctx = getContext("2d")


        // draw an image
        ctx.drawImage('assets/ball.png', 10, 10)

        // store current context setup
        ctx.save()
        ctx.strokeStyle = '#ff2a68'
        // create a triangle as clip region
        ctx.beginPath()
        ctx.moveTo(110,10)
        ctx.lineTo(155,10)
        ctx.lineTo(135,55)
        ctx.closePath()
        // translate coordinate system
        ctx.clip()  // create clip from the path
        // draw image with clip applied
        ctx.drawImage('assets/ball.png', 100, 10)
        // draw stroke around path
        ctx.stroke()
        // restore previous context
        ctx.restore()

    }

    Component.onCompleted: {
        loadImage("assets/ball.png")
    }
}

JoeCFD

Component.onCompleted: {
    loadImage("assets/ball.png")  <===this line of code causes problem.
}

But without loading, the image can not be drawn in onPaint

JoeCFD

qml application engine has to be destroyed. Forgot it. Now it is ok.