当前位置：首页 > article >正文

QT基础十四、绘图

article 2025/3/17 5:46:58

前言：本篇文章的内容十分琐碎，所以内容会以描述各种函数接口为主

一、绘图基础框架

void Widget::paintEvent(QPaintEvent *event) {
    QPainter painter(this); // 自动开始绘制
    // 绘图操作...
} // 自动结束绘制

二、核心绘图功能

1. 基础图形绘制

图形类型	关键 API	参数说明	代码示例
矩形	`drawRect(QRect)`	左上角坐标 + 宽高	`painter.drawRect(QRect(50,50,200,300))`
圆角矩形	`drawRoundedRect(QRect, xr, yr)`	xr/yr = 圆角半径（单位：像素）	`painter.drawRoundedRect(rect, 20, 20)`
椭圆	`drawEllipse(QRect)`	基于矩形边界绘制内切椭圆	`painter.drawEllipse(rect)`
直线	`drawLine(QLine)`	起点+终点坐标	`painter.drawLine(QLine(100,100,200,200))`

2. 复杂图形

图形类型	关键 API	特性	示例
圆弧	`drawArc(QRect, angle, span)`	角度单位：1° = 16单位	`painter.drawArc(rect, 0 * 16, -90 * 16)`
弦	`drawChord(QRect, angle, span)`	连接弧线端点的封闭图形	`painter.drawChord(rect, 0 * 16, -90 * 16)`
扇形	`drawPie(QRect, angle, span)`	自动连接圆心	`painter.drawPie(rect, 0, 120 * 16)`

3. 多边形绘制

QPoint points[4] = {{40,500}, {110,100}, {10,400}, {300,100}};

// 凸多边形（高效）
painter.drawConvexPolygon(points, 4);

// 普通多边形（自动处理凹多边形）
painter.drawPolygon(points, 4);

4. 路径绘制（QPainterPath）

QPainterPath path;
path.addRect(rect);         // 添加矩形路径
path.addEllipse(rect);      // 添加椭圆路径
painter.drawPath(path);     // 绘制组合路径

5. 图像与文字

功能	API	注意事项
绘制图片	`drawImage(QRect, QImage)`	支持 PNG/JPG 格式
绘制文字	`drawText(QRect, QString)`	需先设置 QFont
擦除区域	`eraseRect(QRect)`	实际效果=用背景色填充

完整文字设置示例：

QFont font;
font.setFamily("宋体");
font.setPointSize(30);
font.setBold(true);
font.setItalic(true);
painter.setFont(font);
painter.drawText(rect, "德先生666");

6. 填充与样式控制

// 画笔设置（轮廓）
QPen pen;
pen.setWidth(4);                  // 线宽（像素）
pen.setColor(Qt::red);            // 颜色
painter.setPen(pen);

// 画刷设置（填充）
QBrush brush;
brush.setColor(Qt::green);
brush.setStyle(Qt::SolidPattern); // 填充模式
painter.setBrush(brush);

// 特殊填充方法
painter.fillRect(rect, Qt::blue);      // 直接填充矩形
painter.fillPath(path, Qt::yellow);    // 填充复杂路径

三、细节讲解

1. 角度计算机制（1/16度单位）

为什么使用 1/16 度？

历史原因：早期计算机处理整数比浮点数更高效，16位精度可表示 0.0055° 的精度（360°×16=5760个单位）
实际应用：
- 正角 = 顺时针方向
- 负角 = 逆时针方向（推荐用负数表示逆时针更直观）
换算公式：

int qtAngle = degree * 16;      // 普通角度转Qt单位
float realDegree = qtAngle / 16.0f; // Qt单位转实际角度

典型使用场景

图形类型	参数说明	示例代码
圆弧	起始角度 + 跨度角度	`drawArc(rect, 30 * 16, 120 * 16)`
扇形	起始角度 + 扇形展开角度	`drawPie(rect, -90 * 16, 180 * 16)`
弦	起始角度 + 弦的跨度	`drawChord(rect, 0, -90 * 16)`

2. 性能优化策略

1、凸多边形 vs 普通多边形

QPoint points[4] = {...};
// 高性能绘制（要求顶点按顺时针/逆时针排列）
painter.drawConvexPolygon(points, 4); 

// 通用绘制（自动处理交叉边，消耗多20%性能）
painter.drawPolygon(points, 4);

底层原理：

凸多边形使用更高效的扫描线算法（O(n)复杂度）
普通多边形需要处理凹点和边交叉（O(n²)复杂度）

2、QPainterPath 复用

// 错误用法（每次创建新路径）
void paintEvent() {
    QPainterPath path;
    path.addRect(...);
    painter.drawPath(path);
}

// 正确用法（缓存路径对象）
class Widget {
    QPainterPath m_cachedPath; // 在构造函数中初始化
};
void paintEvent() {
    painter.drawPath(m_cachedPath);
}