QML Canvas 绘制总结

绘制边框 五行代码：

var ctx = getContext("2d");

drawFrameBackground(ctx, margin);

ctx.strokeStyle = "#676767"

ctx.lineWidth = 2;

ctx.stroke();

=====

其中 drawFrameBackgound 为自定义的代码。

绘制函数，常用

1. ctx.beginPath()

2. ctx.lineTo

3.ctx.arc x y radius startAngle endAngle anticlockwise （true:才是逆时针）

4.ctx.closePath();

====

逆时针为例子

左下角弧度传参 应该是 start. PI end 0.5PI true

右下角弧度传参 应该是 0.5PI 0PI true

顺时针为例子

左上角的传参 应该是 start PI 1.5PI false

右上角的传参 应该是 start 1.5PI 0PI false (未验证，理论如此)

关键就是看上面的圆圈图，弧度是 固定的，不是增加弧度。