canvas api中的重绘功能

Question

我正在尝试使用canvas API(与html5中使用的相同)在qml中创建一个计时器.我需要每隔一秒左右重绘一次屏幕.是否有任何功能可以用新馈送的参数更新屏幕？例如,我使用弧函数,我指定绘制时钟弧的角度:

ctx.arc(150, 150, 95, 0,1.57,false);

在这种情况下,角度会每隔一秒左右变化一次.

Answer 1

你不能setTimeout()在QML中使用,它只在JS中用于浏览器,在Qml中你必须认为声明:

导入QtQuick 2.0

Canvas {
    id: canvas;
    width: 360;
    height: 360;
    contextType: "2d";
    renderStrategy: Canvas.Threaded;
    renderTarget: Canvas.Image;
    antialiasing: true;
    smooth: true;

    onPaint: {
        if (context) {
            context.clearRect (0, 0, width, height);
            context.beginPath ();
            context.moveTo (width / 2, height / 2);
            context.arc (width / 2,
                         height / 2,
                         50,
                         0,
                         angle * Math.PI / 180,
                         false);
            context.closePath ();
            context.fillStyle = "red";
            context.fill ();
        }
    }

    property real angle : 0;

    Timer {
        interval: 1000;
        repeat: true;
        running: true;
        onTriggered: {
            // update your angle property as you want
            canvas.angle = (canvas.angle < 360 ? canvas.angle +6 : 0);
            // repaint
            canvas.requestPaint ();
        }
    }

}

我冒昧地为Canvas设置了最佳设置,让您拥有最佳渲染效果!