Question

考虑下面的QML代码，它允许我通过鼠标点击将点插入空白QML画布，然后使用左上角的按钮清除画布上的所有输入点和相应的图片角

id    name          message       datetime
---   --------      -------       --------   
1     David         test 1        2017-12-18 10:00
2     David         test 2        
3     David         test 3        
4     Alvin         bluh 1        2017-12-18 10:04
5     Alvin         bluh 2        
6     David         test 4        2017-12-18 10:06

这段代码非常奇怪。假设我在画布上输入了几个点，然后单击“清除输入”按钮。然后如预期的那样，所有图片（即对应于点的小圆圈）从画布上消失并且import QtQuick 2.5 import QtQuick.Window 2.2 import QtQuick.Controls 1.4 Window{ id: root width: 640 height: 480 visible: true Canvas { id: mycanvas width: 1000 height: 1000 property var arrpoints : [] onPaint: { var context = getContext("2d"); // Delete everything drawn before? context.clearRect(0, 0, mycanvas.width, mycanvas.height); // Render all the points as small black-circles context.strokeStyle = Qt.rgba(0, 1, 1, 0) // Draw all the points for(var i=0; i < arrpoints.length; i++){ var point = arrpoints[i] context.ellipse(point["x"], point["y"], 10, 10) context.fill() context.stroke() } } // For mousing in points. MouseArea { id: mymouse anchors.fill: parent onClicked: { // Record mouse-position into all the input objects mycanvas.arrpoints.push({"x": mouseX, "y": mouseY}) mycanvas.requestPaint() console.log( mycanvas.arrpoints ) } // onClicked }// MouseArea } // Canvas Button { text: "clear input" onClicked: { mycanvas.arrpoints.length = 0 mycanvas.requestPaint() console.log( mycanvas.arrpoints ) } } }//Window数组设置为空。

但是当我再次开始点击画布时，清除的图片会 重新绘制 ，同时输入新的点数!!为什么会这样？打印到控制台后，我仍然可以看到arrpoints所以问题应该是清除arrpoints=[]部分中的画布。

如何告诉QML完全删除其画布内存？

Answer 1

如果要清理画布，则必须重置上下文。在这种情况下，实现一个执行它的函数并强制画布更新。

import QtQuick 2.5
import QtQuick.Window 2.2
import QtQuick.Controls 1.4
Window{
    id: root
    width: 640 
    height: 480 
    visible: true 

    Canvas {
        id: mycanvas
        width:  1000
        height: 1000

        property var arrpoints : []

        onPaint: {
            var context = getContext("2d");
            // Delete everything drawn before?
            context.clearRect(0, 0, mycanvas.width, mycanvas.height);

            // Render all the points as small black-circles
            context.strokeStyle = Qt.rgba(0, 1, 1, 0)

            // Draw all the points
            for(var i=0; i < arrpoints.length; i++){
                var point = arrpoints[i]
                context.ellipse(point["x"], point["y"], 10, 10)
                context.fill()
                context.stroke()

            }
        }

        function clear() {
            var ctx = getContext("2d");
            ctx.reset();
            mycanvas.requestPaint();
        }

        // For mousing in points.
        MouseArea {
            id: mymouse
            anchors.fill: parent
            onClicked: {
                // Record mouse-position into all the input objects
                mycanvas.arrpoints.push({"x": mouseX, "y": mouseY})
                mycanvas.requestPaint()
                console.log( mycanvas.arrpoints )
            } // onClicked
        }// MouseArea
    } // Canvas

    Button {
        text: "clear input"
        onClicked: {
          mycanvas.arrpoints.length = 0
          mycanvas.clear()
          console.log( mycanvas.arrpoints )
        }
    }
}//Window

如何从QML画布中永久删除对象？

1 个答案: