QPainter、QPaintDevice、QPaintEngine的介绍
QPainter 用来执行绘图操作; QPaintDevice提供绘图设备,是一个二维空间的抽象,可以使用QPainter在其上进行绘制;是所有可以进行绘制的基类,其子类有QWidget、QPixmap、QPicture、QImage、QPainter和QOpenGLPaintDevice等。QPaintEngine提供了一些接口,用于QPainter和QPaintDevice内部。使得QPainter可以在不同的设备上进行绘制。
1、绘制与填充
QPainter::QPainter(QPaintDevice *device) ;
QPainter 构造中device为绘图设备;使用这个构造函数创建的对象会立即开始在设备上进行绘制,自动绘制掉用begin()函数,然后在QPainter的析构造函数中调用end()函数结束绘制。
QPainter中的图形绘制函数
* drawLine() 绘制线条
* drawArc() 绘制圆弧
* drawChord() 绘制弦
* drawConvexPolygon() 绘制凸多边形
* drawEllipse() 绘制椭圆
* drawPie() 绘制扇形
* drawPoint() 绘制点
* drawPolygon() 绘制多边形
* drawRect() 绘制矩形
* drawRoundedRect() 绘制圆角矩形
2、画笔
在paintEvent()函数中继续添加如下代码
QPen pen(Qt::green, 5, Qt::DotLine, Qt::RoundCap, Qt::RoundJoin); // 创建画笔
painter.setPen(pen); // 使用画笔
QRectF rectangle(70.0, 40.0, 80.0, 60.0);
int startAngle = 30 * 16;
int spanAngle = 120 *16;
painter.drawArc(rectangle, startAngle, spanAngle); //绘制圆弧
QPen类为QPainter提供了画笔来绘制线条和形状的轮廓,这里使用QPen::QPen(const QBrush& brush, qreal width, Qt::PenStyle style = Qt::SolidLine, Qt::PenCapStyle cap = Qt::SquareCap, Qt::PenJoinStyle join = Qt::BevelJoin);其中几个参数分别是画刷(为画笔提供颜色),线宽(默认为0,一个像素)、画笔风格(有实线、点线等,还有一个Qt::NoPen值表示不进行线条或边框的绘制,还可以使用setDashPatten()来指定以一个画笔风格)、画笔端点风格(怎样定制线条端点的绘制其中Qt::SquareCap风格表示线条的终点为方形,并延长了线宽的一半)、画笔连接风格(两条线段的连接,Qt::BeveJoin 风格填充了两个线条之间的空却三角形);
也可以使用setBrush()、setWidth()、setStyle()、setCapStyle()和setJoinStyle()等函数设置。
3、画刷
在paintEvent()方法中继续添加画刷功能
painter.drawRect(160, 20, 50, 40); //绘制一个矩形
QBrush brush(QColor(0,0, 255), Qt::dense4Pattern);//创建画刷
painter.setBrush(brush);// 使用画刷
painter.drawEllipse(220, 20, 50, 50); // 绘制椭圆
brush.setTexture(QPixmap("../image/bg.png")); // 设置纹理
painter.setBrush(brush); // 重新使用画刷
// 绘制多边形
static const QPointF points[4] = {
QPointF(270.0, 80.0),
QPointF(290.0, 10.0),
QPointF(350.0, 30.0),
QPointF(390.0, 70.0)
};
painter.drawPolygon(points, 4);
QBrush类提供了画刷来对图形进行填充,所以QBrush的定义包含了颜色和风格(填充模式)。颜色由QColor类来表示他支持RGB、HSV及CMYK等颜色模型。QColor还支持基于alpha的轮廓和填充(透明效果)。
3、渐变填充
QGradient类和QBrush类一起完成渐变填充。Qt支持3中类型的渐变填充:
- 线性渐变 linear gradient:开始点和结束点之间填充颜色;
- 辐射渐变 radial gradient :在焦点和环绕他的圆环间插入颜色;
- 锥形渐变 Conical gradient:在圆心周围插入颜色。
//线性渐变
QLinearGradient linearGradient(QPointF(40, 190), QPointF(70, 200));
//insert color
linearGradient.setColorAt(0, Qt::yellow);
linearGradient.setColorAt(0.5, Qt::red);
linearGradient.setColorAt(1, Qt::blue);
// 指定渐变区域意外的区域的扩散方式
linearGradient.setSpread(QGradient::RepeatSpread);
//使用渐变作为画刷
painter.setBrush(linearGradient);
painter.drawRect(10, 170, 90, 40);
// 辐射渐变
/*
辐射渐变 QRadialGradient::QradialGradient(const QPointF& center, qreal radius, const QPointF & foacalPoint);
辐射渐变构造函数需要指定圆心center, 半径radius,就可以确定一个圆,在指定一个焦点focalPoint,在焦点和圆环之间插入颜色
*/
QRadialGradient radialGradient(QPointF(200, 190), 50, QPointF(275, 200));
radialGradient.setColorAt(0, QColor(255, 255, 100, 150);
radialGradient.setColorAt(1, QColor(0, 0, 0, 50);
painter.setBrush(radialGradient);
painter.drawEllipe(QPointF(200, 190), 50, 50);
//锥形渐变
/*
QConicalGradient::QConicalGradient(const QPointF ¢er, qreal angle) ;
锥形渐变的构造函数需要指定center中心点,和一个角度angle(0-360),然后逆时针旋转,setSpread函数对于锥形渐变没有效果。
*/
QConicalGradient conicalGradient(QPointF(350, 190), 60);
conicalGradient.setColorAt(0.2, Qt::cyan);
conicalGradient.setColorAt(0.9, Qt::black);
painter.setBrush(conicalGradient );
painter.drawEllipe(QPointF(400, 190), 50, 50);
//画笔使用线性渐变来绘制直线和文字
painter.setPen(QPen(linearGradient, 2));
painter.drawLine(0, 280, 100, 280);
painter.drawText(150, 280, tr("helloQt"));