Canvas {

         id: canvas

         anchors.fill: parent

         //

         property bool isFirstPaint : true;

         property point lastPt;

         //

         onPaint: {

             var ctx = getContext('2d');

             if (isFirstPaint){

                 // 首次绘制刮刮层图案

                 ctx.fillStyle = root.maskColor;

                 ctx.fillRect(0, 0, width, height);

                 isFirstPaint = false;

             }

             else{

                 // 去除鼠标位置的图案

                 clearRound(ctx, lastPt, 20);

                 lastPt = Qt.point(area.mouseX, area.mouseY);

             }

         }

         // 清除圆形区域

         function clearRound(ctx, p, r)

         {

             ctx.save();

             ctx.globalCompositeOperation = 'destination-out';

             ctx.beginPath();

             ctx.arc(p.x, p.y, r, 0, 2*Math.PI, false);

             ctx.fill();

             ctx.restore();

         }

         // 记录下最后的鼠标点，并请求canvas重绘

         MouseArea {

             id: area

             anchors.fill: parent

             onPressed: {canvas.lastPt = Qt.point(mouseX, mouseY);}

             onPositionChanged: {canvas.requestPaint();}

         }

     }