论Qt4的视口（ViewPort）与窗口（Window）

￡神魔★判官ぃ 2021-11-19 11:42 550阅读 0赞

最近在研究Qt的2D绘图部分，对窗口和视口比较感兴趣，故写几个测试程序来加深理解。

PaintDemo.h

#ifndef PAINTDEMO_H
    #define PAINTDEMO_H
    #include <QWidget>
    class QPaintEvent;
    
    class PaintDemo : public QWidget
    {
        public:
            PaintDemo();
        protected:
            void paintEvent(QPaintEvent *event);
    };
    #endif

PaintDemo.cpp

#include <QPainter>
    #include "PaintDemo.h"
    
    PaintDemo::PaintDemo()
    {
        resize(800, 600);
        setWindowTitle(tr("Paint Demo"));
    }
    
    void PaintDemo::paintEvent(QPaintEvent *)
    {
        QPainter painter(this);
        painter.setPen(QPen(Qt::black, 2));
        painter.drawLine(0,0,800,600);
    }

在构造函数中将窗口大小设置为800x600，在paintEvent中从（0，0）到（800，600）绘制了一条Line，斜贯整个窗口：

![05182225-90b7d1714b3844e291d50f466abd9294.jpg][]

此时，我们拉动改变窗口的大小，显然，窗口右下角的坐标不再是（800，600），而且其它更大的一个数值，譬如（900，700），而我们的线只画到（800，600），所以剩下的一段是空白。如下图所示：

![05182503-a7d816e694e549c5a20f7a160edfcba0.jpg][]

OK，我们来修改一下代码，在绘制Line前加上一行

painter.setWindow(0,0,800,600);

修改后的PaintDemo.cpp代码如下(红色为增加的代码)：

#include <QPainter>
    #include "PaintDemo.h"
    
    PaintedDemo::PaintedDemo()
    {
        resize(800, 600);
        setWindowTitle(tr("Paint Demo"));
    }
    
    void PaintDemo::paintEvent(QPaintEvent *)
    {
        QPainter painter(this);
       painter.setWindow(0,0,800,600);
        painter.setPen(QPen(Qt::black, 2));
        painter.drawLine(0,0,800,600);
    }

编译运行：

![05182956-ac16964c09d943f18b4240f5e461b5a8.jpg][]

这个时候我们发现不管怎样拉动窗口，Line永远贯穿整个窗口：

![05183135-200e12fd042645bcb64561ce214b2e3b.jpg][]

这说明painter.setWindow(0,0,800,600)将整个窗口设置为一个区域，左上角为原点，X坐标的终点为800，即窗口的宽度，Y坐标的终点为600，即窗口高度，这样，不管窗口怎么变化，右下角的坐标始终为（800，600），因此我们的Line始终贯穿整个窗口。

OK，我们再接再厉，将ViewPort也设置一下，PaintDemo.cpp代码如下(红色为增加的代码)：

#include <QPainter>
    #include "PaintDemo.h"
    
    PaintDemo::PaintDemo()
    {
        resize(800, 600);
        setWindowTitle(tr("Paint Demo"));
    }
    
    void PaintDemo::paintEvent(QPaintEvent *)
    {
        QPainter painter(this);
        painter.setViewport(0,0,800,600);
        painter.setWindow(0,0,800,600);
        painter.setPen(QPen(Qt::black, 2));
        painter.drawLine(0,0,800,600);
    }

编译运行，这时我们会惊奇的发现，Line又不能贯穿整个窗口了

![05184107-2cc4e1f46cef44b3b6a2756cb7a1ddca.jpg][]

再来，我们将Viewport改小一点，宽度由800改为300，高度由600改为400，结果如何？看图：

![05184452-00b4cedc12fe498789ade6d52277c655.jpg][]

现在可以得到结论了，Qt通过QPainter::setWindow将窗口坐标映射到视口坐标，而QPainter::setViewport则用来指定在窗体上所能绘制的区域。

关于Qt的坐标系统其实在Qt的doc里已经讲得很详细了，具体请参看：

[http://qt-project.org/doc/qt-4.8/coordsys.html\#window-viewport-conversion][http_qt-project.org_doc_qt-4.8_coordsys.html_window-viewport-conversion]

这里借用一张图说明一下：

![05202923-e2df1ad39c904b00851469020699145b.png][]

世界坐标通过矩阵转换成窗口坐标，然后通过窗口到视口的映射转换成设备坐标。

我这里的说明省略了矩阵变换，其实从逻辑坐标到窗口坐标之间还要进行矩阵变换。

转载于:https://www.cnblogs.com/realid/archive/2013/05/05/3061312.html

[05182225-90b7d1714b3844e291d50f466abd9294.jpg]: /images/20211119/9a9faf1b719641debe7f13fdcaabc572.png
[05182503-a7d816e694e549c5a20f7a160edfcba0.jpg]: /images/20211119/49982dc7287243b28c553ff1e3826324.png
[05182956-ac16964c09d943f18b4240f5e461b5a8.jpg]: /images/20211119/e35fea0d320e48a296fc0ca7da853965.png
[05183135-200e12fd042645bcb64561ce214b2e3b.jpg]: /images/20211119/f9b041ba1bfb4d2c8b88f4bd0df2585c.png
[05184107-2cc4e1f46cef44b3b6a2756cb7a1ddca.jpg]: /images/20211119/223afcb91a0b464f911675f70bb2126e.png
[05184452-00b4cedc12fe498789ade6d52277c655.jpg]: /images/20211119/861cf19a3a774d1883ef4ca5f51fd979.png
[http_qt-project.org_doc_qt-4.8_coordsys.html_window-viewport-conversion]: http://qt-project.org/doc/qt-4.8/coordsys.html#window-viewport-conversion
[05202923-e2df1ad39c904b00851469020699145b.png]: /images/20211119/33acf980cf504211ab773dca4d7cc2a6.png