Qt实战案例（22）——利用QPainter实现图形绘制实例

一、QPainter中视口和窗口介绍 1.1 视口Viewport

视口是基于QPaintDevice类组件的坐标实现的，属于物理坐标，通过setViewport成员函数设置：

void QPainter::setViewport(const QRect &rectangle) void QPainter::setViewport(int x, int y, int width, int height)

1.2 窗口Window

窗口是基于自身的逻辑坐标实现的，并不是真实坐标，可以通过setWindow成员函数设置 void QPainter::setWindow(const QRect &rectangle) void QPainter::setWindow(int x, int y, int width, int height)

【注意】：

1. QPainter的坐标是使用的窗口坐标(逻辑坐标)；
2. 当QPainter初始化时，视口和窗口坐标默认是相同的，也就是说原点(0,0)在于窗口左上角；
3. 视口和窗口的最小坐标和最大坐标是从左上到右下的；

二、案例（1）——绘制田字格

核心代码：

void MainWindow::paintEvent(QPaintEvent *)
{
    QPainter painter(this);
    QSize ViewWH(100,100);        //定义视口宽高
    painter.setViewport(50,50,ViewWH.width(),ViewWH.height());
    painter.setWindow(-50,50,ViewWH.width(),-ViewWH.height());
    painter.setBrush(QColor(187,229,253));//设置画刷颜色——浅蓝色填充
    painter.setPen(QPen(QColor(11,67,127),2));//设置画笔颜色——深蓝色边框
    painter.drawRect(-50,50,ViewWH.width(),-ViewWH.height()); //窗口背景
    painter.drawLine(-50,0,50,0);       //画X坐标
    painter.drawLine(0,-50,0,50);       //画Y坐标
}

运行结果：

三、案例（2）——绘制正弦波

核心代码：

void MainWindow::paintEvent(QPaintEvent *)
{
    QPainter painter(this);
    painter.setViewport(50,50,width()-100,height()-100);    //设置视口为中心处
    painter.setWindow(-10,4,20,-8);    //定义窗口 左上角为(-10,4) 右下角为(10,-4)
    painter.fillRect(-10,4,20,-8,Qt::black); //设置背景为黑色
    //由于当前窗口和视口的比例为 width()-100 : 20,所以1px的横纵Line线宽 = 1/(width()-100)/20
    painter.setPen(QPen(QBrush(Qt::green),1/(width()-100)/20));
    painter.drawLine(-10,0,10,0);//绘制X横轴
    painter.setPen(QPen(QBrush(Qt::green),1/(height()-100)/8));
    painter.drawLine(0,-4,0,4);//绘制Y纵轴
    for(float x=-10;x