学习Qt的QML的Canvas（一） ---（参考书籍 《Qt Quick 核心编程-安晓辉》）

import QtQuick 2.4import QtQuick.Controls 1.2import QtQuick.Controls.Styles 1.2import QtQuick.Window 2.2Rectangle {    visible: true    width: 600;height: 600;    Canvas{        width: 400;        height: 240;        contextType: "2d";        onPaint: {            var ctx = getContext("2d");            ctx.lineWidth = 2;            ctx.strokeStyle = "red";            var gradient = ctx.createLinearGradient(60,50,180,130);            gradient.addColorStop(0.0,Qt.rgba(1,0,0,1.0));            gradient.addColorStop(1.0,Qt.rgba(0,0,1,1.0));            ctx.fillStyle = gradient;            ctx.beginPath();            ctx.rect(60,50,120,80);            ctx.fill();            ctx.stroke();            gradient = ctx.createLinearGradient(230,160,30,260,200,20);            gradient.addColorStop(0.0,Qt.rgba(1,0,0,1.0));            gradient.addColorStop(1.0,Qt.rgba(0,0,1,1.0));            ctx.fillStyle = gradient;            ctx.beginPath();//            ctx.rect(200,140,80,80);            ctx.moveTo(200,80); //start point            ctx.lineTo(200,200);            ctx.lineTo(300,200)            ////            ctx.moveTo(200,200);//            ctx.lineTo(200,80); //start point//            ctx.lineTo(300,200)            ctx.fill();            ctx.stroke();        }    }    Gradient{    }}

这里使用到了Gradient组件—主要是用于渐变的实现
Context2D的用法