Qt QPainter基本绘图

Qt QPainter基本绘图


QPainter绘图操作类。
QPainterDevice使用QPainter绘图的抽象二维界面(绘图设备),包括QWidget、QPixmap、QImage等。
QPaintEngine给QPainter提供不同设备绘图的接口,QPainter和QPainterDevice内部使用,创建自己的设备类型时才需要。

paintEvent使用QWidget绘图区的局部物理坐标,视口(viewport)坐标。

QPen

线条颜色、宽度、线型等。

void setWidth(int width);
void setColor(QColor &color);

//Qt::NoPen, Qt::SolidLine, 
//Qt::DashLine, Qt::DotLine, 
//Qt::DashDotLine, Qt::DashDotDotLine, Qt::CustomDashLine
//自定义样式setDashOffset(), setDashPattern()
void setStyle(Qt::PenStyle style);//线的类型,实线、虚线等

//Qt::FlatCap, Qt::SquareCap, Qt::RoundCap
void setCapStyle(Qt::PenCapStyle style);//线的端点样式

//Qt::MiterJoin, Qt::BevelJoin,Qt::RoundJoin, Qt::SvgMiterJoin
void setJoinStyle(Qt::PenJoinStyle style);//线的连接点样式

QBrush

区域填充特性,颜色、填充方式、渐变特性、图片填充等。

void setColor(QColor &color);

//Qt::NoBrush, Qt::SolidPattern,
//Qt::Dense1Pattern, Qt::Dense2Pattern, ..., Qt::Dense7Pattern,
//Qt::HorPattern, Qt::VerPattern, Qt::CrossPattern, 
//Qt::BDiagPattern, Qt::FDiagPattern, Qt::DiagCrossPattern,
//Qt::LinearGradientPattern, 需设置setBrush(QLinearGradient)
//Qt::ConicalGradientPattern, 需设置setBrush(QConicalGradient)
//Qt::RadialGradientPattern, 需设置setBrush(QRadialGradient)
//Qt::TexturePattern, 需设置setTexture或setTextureImage, style自动设置为Qt::TexturePattern
void setStyle(Qt::BrushStyle style);

void setTexture(QPixmax &pixmap);
void setTextureImage(QImage &image);

渐变填充

基类QGradient,setSpread(QGradient::Spread method)设置延展方式,对(QConicalGradient)圆锥型渐变不起作用。

  • QGradient::PadSpread
    结束点颜色填充外部区域,缺省方式。
  • QGradient::RepeatSpread
    重复方式填充外部区域。
  • QGradient::ReflectSpread
    反射式重复方式填充外部区域。

3个实现渐变填充的类:

  • QLinearGradient
    线性渐变,指定起点,终点,中间点及颜色,线性插值计算得到所有点填充色。
  • QRadialGradient
    简单辐射渐变,圆内焦点和端点间生成渐变色。扩展辐射渐变,焦点圆和中心圆间生成渐变色。
  • QConicalGradient
    圆锥形渐变,中心点逆时针生成渐变色。
//线性渐变
QLinearGradient  linearGrad(rect.left(), rect.top(), rect.right(), rect.bottom()); //对角线
//QLinearGradient  linearGrad(rect.left(), rect.top(), rect.right(), rect.top());//从左到右
linearGrad.setColorAt(0, Qt::blue);//起点颜色
linearGrad.setColorAt(0.5, Qt::blue);//中间点颜色
linearGrad.setColorAt(1, Qt::red);//终点颜色
linearGrad.setSpread(QGradient::ReflectSpread);  //展布模式
painter.setBrush(linearGrad);

//径向渐变
QRadialGradient  radialGrad(W/2, H/2, qMax(W/8, H/8), W/2, H/2);
radialGrad.setColorAt(0, Qt::green);
radialGrad.setColorAt(1, Qt::blue);
radialGrad.setSpread(QGradient::ReflectSpread);
painter.setBrush(radialGrad);

//圆锥型渐变
QConicalGradient  coniGrad(W/2, H/2, 45);
coniGrad.setColorAt(0, Qt::yellow);
coniGrad.setColorAt(0.5, Qt::blue);
coniGrad.setColorAt(1, Qt::green);
//coniGrad.setSpread(QGradient::PadSpread); //对于锥形渐变不起作用
painter.setBrush(coniGrad);

QFont

文字样式、大小等。

基本图形元件

QPainter painter(this);
int W = width();
int H = height();
  • drawArc,弧线
QRect   rect(W/4, H/4, W/2, H/2);
int startAngle = 90 * 16;  //起始90°,上
int spanAngle = 90 * 16;   //旋转90°,左 
painter.drawArc(rect, startAngle, spanAngle);
  • drawChord,弦
QRect   rect(W/4, H/4, W/2, H/2);
int startAngle = 90 * 16;  //起始90°,上
int spanAngle = 90 * 16;   //旋转90°,左 
painter.drawChord(rect, startAngle, spanAngle);
  • drawConvexPolygon,给定点画凸多边形
QPoint points[4] = {
	QPoint(5*W/12, H/4),
	QPoint(3*W/4, 5*H/12),
	QPoint(5*W/12, 3*H/4),
	QPoint(W/4, 5*H/12),
};
painter.drawConvexPolygon(points, 4);
  • drawEllipse,椭圆
QRect rect(W/4, H/4, W/2, H/2);
painter.drawEllipse(rect);
  • drawImage,image图片
QRect rect(W/4, H/4, W/2, H/2);
painter.drawImage(rect, QImage("qt.jpg"));

+drawLine,线

QLine Line(W/4, H/4, W/2, H/2);
painter.drawLine(Line);
  • drawLines,一批线
QRect rect(W/4, H/4, W/2, H/2);

QVector<QLine> Lines;
Lines.append(QLine(rect.topLeft(), rect.bottomRight()));
Lines.append(QLine(rect.topRight(), rect.bottomLeft()));
Lines.append(QLine(rect.topLeft(), rect.bottomLeft()));
Lines.append(QLine(rect.topRight(), rect.bottomRight()));

painter.drawLines(Lines);
  • drawPath,路径
QRect rect(W/4, H/4, W/2, H/2);
QPainterPath path;
path.addEllipse(rect);
path.addRect(rect);
painter.drawPath(path);
  • drawPie,扇形
QRect rect(W/4, H/4, W/2, H/2);
int startAngle = 40 * 16;//起始40°
int spanAngle = 120 * 16;//旋转120°
painter.drawPie(rect, startAngle, spanAngle);
  • drawPixmap,pixmap图片
QRect rect(W/4, H/4, W/2, H/2);
painter.drawPixmap(rect, QPixmap("qt.jpg"));
  • drawPoint,点
painter.drawPoint(QPoint(W/2, H/2));
  • drawPoints,一批点
QPoint points[] = {
	QPoint(5*W/12, H/4),
	QPoint(3*W/4, 5*H/12),
	QPoint(2*W/4, 5*H/12)
};
painter.drawPoints(points, 3);
  • drawPolygon,多边形
QPoint points[] = {
	QPoint(5*W/12, H/4),
	QPoint(3*W/4, 5*H/12),
	QPoint(5*W/12, 3*H/4),
	QPoint(2*W/4, 5*H/12),
};
painter.drawPolygon(points, 4);
  • drawPolyline,多边形的线
QPoint points[] = {
	QPoint(5*W/12, H/4),
	QPoint(3*W/4, 5*H/12),
	QPoint(5*W/12, 3*H/4),
	QPoint(2*W/4, 5*H/12),
};
painter.drawPolyline(points, 4);
  • drawRect,矩形
QRect rect(W/4, H/4, W/2, H/2);
painter.drawRect(rect);
  • drawRoundedRect,圆角矩形
QRect rect(W/4, H/4, W/2, H/2);
painter.drawRoundedRect(rect, 20, 20);
  • drawText,单行文本
QRect rect(W/4, H/4, W/2, H/2);
QFont font;
font.setPointSize(30);
font.setBold(true);
painter.setFont(font);
painter.drawText(rect, "Hello,Qt");
  • eraseRect,擦除矩形,背景色填充
QRect rect(W/4, H/4, W/2, H/2);
painter.eraseRect(rect);
  • fillPath,填充路径,轮廓线不显示
QRect rect(W/4, H/4, W/2, H/2);
QPainterPath path;
path.addEllipse(rect);
path.addRect(rect);
painter.fillPath(path, Qt::red);
  • fillRect,填充矩形,无边框线
QRect rect(W/4, H/4, W/2, H/2);
painter.fillRect(rect, Qt::green);

QPainterPath

五角星路径

qreal R = 100; //半径
const qreal Pi = 3.14159;
qreal deg = Pi*72/180;

QPoint points[5] = {
	QPoint(R, 0),
    QPoint(R*std::cos(deg), -R*std::sin(deg)),
    QPoint(R*std::cos(2*deg), -R*std::sin(2*deg)),
    QPoint(R*std::cos(3*deg), -R*std::sin(3*deg)),
    QPoint(R*std::cos(4*deg), -R*std::sin(4*deg)),
};

QPainterPath starPath;
starPath.moveTo(points[0]);
starPath.lineTo(points[2]);
starPath.lineTo(points[4]);
starPath.lineTo(points[1]);
starPath.lineTo(points[3]);
starPath.closeSubpath();
QPoint points[9] = {
    QPoint(5*W/12, H/4),
    QPoint(7*W/12, H/4),
    QPoint(3*W/4, 5*H/12),
    QPoint(3*W/4, 7*H/12),
    QPoint(7*W/12, 3*H/4),
    QPoint(5*W/12, 3*H/4),
    QPoint(W/4, 7*H/12),
    QPoint(W/4, 5*H/12),
    QPoint(5*W/12, H/4)
};

QPainterPath path;
path.addRect(rect);
path.addEllipse(rect);
path.moveTo(points[0]);
path.lineTo(points[4]);
path.moveTo(points[1]);
path.lineTo(points[5]);
path.moveTo(points[2]);
path.lineTo(points[6]);
path.moveTo(points[3]);
path.lineTo(points[7]);

path.moveTo(points[0]);
path.cubicTo(points[1], points[4], points[2]);

QPainter::CompositionMode

 enum CompositionMode {
        CompositionMode_SourceOver,
        CompositionMode_DestinationOver,
        CompositionMode_Clear,
        CompositionMode_Source,
        CompositionMode_Destination,
        CompositionMode_SourceIn,
        CompositionMode_DestinationIn,
        CompositionMode_SourceOut,
        CompositionMode_DestinationOut,
        CompositionMode_SourceAtop,
        CompositionMode_DestinationAtop,
        CompositionMode_Xor,

        //svg 1.2 blend modes
        CompositionMode_Plus,
        CompositionMode_Multiply,
        CompositionMode_Screen,
        CompositionMode_Overlay,
        CompositionMode_Darken,
        CompositionMode_Lighten,
        CompositionMode_ColorDodge,
        CompositionMode_ColorBurn,
        CompositionMode_HardLight,
        CompositionMode_SoftLight,
        CompositionMode_Difference,
        CompositionMode_Exclusion,

        // ROPs
        RasterOp_SourceOrDestination,
        RasterOp_SourceAndDestination,
        RasterOp_SourceXorDestination,
        RasterOp_NotSourceAndNotDestination,
        RasterOp_NotSourceOrNotDestination,
        RasterOp_NotSourceXorDestination,
        RasterOp_NotSource,
        RasterOp_NotSourceAndDestination,
        RasterOp_SourceAndNotDestination,
        RasterOp_NotSourceOrDestination,
        RasterOp_SourceOrNotDestination,
        RasterOp_ClearDestination,
        RasterOp_SetDestination,
        RasterOp_NotDestination
};

void setCompositionMode(CompositionMode mode);

实例1

class Widget: public QWidget {
	Q_OBJECT
public:
    explicit Widget(QWidget *parent = 0);	
protected:
	void paintEvent(QPaintEvent *event) Q_DECL_OVERRIDE; //虚函数重载
}

Widget::Widget(QWidget *parent) : QWidget(parent) {
    setPalette(QPalette(Qt::white));
    setAutoFillBackground(true);
    resize(400, 400);
}

void Widget::paintEvent(QPaintEvent *event) {
	QPainter painter(this);
	painter.setRenderHint(QPainter::Antialiasing);
	painter.setRenderHint(QPainter::TextAntialiasing);

	QPen pen;
	pen.setWidth(3);
	pen.setColor(Qt::red);
	pen.setStyle(Qt::SolidLine);
	pen.setCapStyle(Qt::FlatCap);
	pen.setJoinStyle(Qt::BevelJoin);
	painter.setPen(pen);

	QBrush brush;
	brush.setColor(Qt::yellow);
	brush.setStyle(Qt::SolidPattern);
	painter.setBrush(brush);
	
    QFont   font;
    font.setPointSize(30);
    font.setBold(true);
    painter.setFont(font);

	int W = width();
	int H = height();
	QRect rect(W/4, H/4, W/2, H/2);
	painter.drawRect(rect);
}
上一篇:【42】CSS3 (3)——新增常用属性②


下一篇:42.首页讲师功能