qgraphicsview 绘图软件 github_绘图之基本绘图

点击上方“Qt学视觉”，选择“星标”公众号重磅干货，第一时间送达

共同学习共同进步

    GUI用户界面的优势是通过可视化的界面元素为用户提供便利的操作，界面上的按钮、编辑 框等各种界面组件其实都是通过绘图而得到的。Qt的二维绘图基本功能是使用QPainter在绘图设 备上绘图，绘图设备包括QWidget、QPixmap等，通过绘制一些基本的点、线、圆等基本形状组 成自己需要的图形，得到的图形是不可交互操作的图形。 

    Qt 还提供了 Graphics View 架构，使用 QGraphicsView、 QGraphicsScene 和各种 QGraphicsItem 类绘图，在一个场景中可以绘制大量图件，且每个图件是可选择、可交互的，如同矢量图编辑软 件那样可以操作每个图件。Graphics View架构为用户绘制复杂的组件化图形提供了便利。

     QPainter 基本绘图

     1. QPainter 与 QPaintDevice 

    Qt的绘图系统使用户可以在屏幕或打印设备上用相同的API绘图，绘图系统基于QPainter、 QPaintDevice和QPaintEngine类。QPainter是用来进行绘图操作的类，QPaintDevice是一个可以使 用QPaimer•进行绘图的抽象的二维界面，QPaintEngine给QPainter提供在不同设备上绘图的接口。QPaintEngine类由QPainter和QPaintDevice内部使用，应用程序一般无需和QPaintEngine打交道， 除非要创建自己的设备类型。 

    —般的绘图设备包括QWidget、QPixmap、Qlmage等，这些绘图设备为QPainter提供一个 “画布”。

     2. paintEvent事件和绘图区 

    QWidget类及其子类是最常用的绘图设备，从QWidget类继承的类都有paintEventO事件，要 在设备上绘图，只需重定义此事件并编写响应代码。创建一个QPaintei•对象获取绘图设备的接口， 然后就可以在绘图设备的“画布”上绘图了。

     在paintEvent()事件里绘图的基本程序结构是：

 void Widget: :paintEvent (QPaintEvent *event)    {        QPainter painter (this) ; //创违与绘图设备关联的QPainter对象         ... / /painter在设备的窗口上幽图    }

    首先创建一个属于本绘图设备的QPainter对象painter,然后使用这个painter在绘图设备的窗 口上画图。

     QWidget的绘图1E就是其窗U内部区域。如下图所示是在一个QWidget窗口上绘制了一个填充矩形 (这个实心矩形及其边框是程序绘制的图形，其他直线 和文字是为说明而加的)，整个窗口内部的矩形E就是 QPainter可以绘图的区域

    

    QWidget的内部绘图区的坐标系统如上图所示， 坐标系统的单位是像素。左上角坐标为(0, 0),向右是 X轴正方向，向下是Y轴正方向，绘图区的宽度由QWidget::width()函数获取，高度由QWidget::height()函数获取，所以，绘图区右下角的的点的坐标 是(width(), height())这个坐标系统是QWidget绘图区的局部物理坐标，称为视口(viewport)坐 标。相应的还有逻辑坐标，称为窗口(window)坐标，后面再详细介绍。 

    使用QPainter在QWidget上绘图就是在这样的一个矩形区域里绘图。

    3. QPainter绘图的主要属性 

    用QPainter在绘图设备上绘图，主要是绘制一些基本的图形元素，包括点、直线、圆形、矩 形、曲线、文字等，控制这些绘图元素特性的主要是QPainter的3个属性，分别如下。 

    • pen属性：是一个QPen对象，用于控制线条的颜色、宽度、线型等，如上图所示矩形边框的线条的特性就是由pen 属性决定的。 

    • brush属性：是一个QBrush对象，用于设置一个E域的填充特性，可以设置填充颜色、填 充方式、渐变特性等，还可以采用图片做材质填充。上图中的矩形用黄色填充就是由brush 属性设置决定的。 

    • font属性：是一个QFont对象，用于绘制文字时，设置文字的字体样式、大小等属性。使用这3个属性基本就控制了绘图的基本特点，当然还有一些其他的功能结合使用，比如叠加模式、旋转和缩放等功能

     4. 创建实例 

    为演示QPainter绘图的基本功能，创建一个Qt Widget Application项目，并选择窗口基类为QWidget，自动创建窗体。创建后的项目有一个Widget类，为了简化代码功能，Widget窗 口里不再放置任何其他组件，只用来绘图。 

    下面是Widget类的完整定义。只是重新定义了 paintEvent()事件，在此事件里编写绘图的代码。Q_DECL_OVERRIDE宏表示这个函数是对父类虚函数的重载。

class Widget : public QWidget {    Q_0BJECT protected:    void paintEvent{QPaintEvent *event) Q_DECL_OVERRIDE; public:     explicit Widget(QWidget *parent = 0);     ~Widget(); private:     Ui::Widget *ui;}

下面是Widget类构造函数和paintEvent()函数的代码

Widget::Widget(QWidget *parent) : QWidget(parent), ui(new Ui::Widget) {     ui->setupUi(this);     setPalette (QPalette (Qt: :white)) ; //设界窗口为白色背景    setAutoFillBackground(true); }void Widget::paintEvent(QPaintEvent *event) {    QPainter painter (this) ;//创建 QPainter 对象     painter.setRenderHint{QPainter::Antialiasing);     painter.setRenderHint{QPainter::TextAntialiasing);     int W=this->width(); //绘图区宽度     int H=this->height(); //绘图区高度     QRect rect(W/4,H/4,W/2,H/2) ; //中间区域矩形框     //设置画笔    QPen pen；    pen_setWidth(3); //线宽     pen. setColor (Qt: : red); //划线颜色     pen.setStyle(Qt::SolidLine>;//线的样式，实线、虚线等     pen. setCapStyle (Qt: : FlatCap) ; //线端点样式     pen. set JoinStyle (Qt: : Bevel Join);//线的连接点样式     painter.setPen(pen); //设置画刷     QBrush brush;     brush. setColor (Qt: : yellow) ; //画刷颜色     brush. setStyle (Qt: : SolidPattern) ; //画刷填充样式     painter.setBrush(brush); //绘图     painter.drawRect(rect); }

    为了不使程序结构太过于复杂，在paintEvent()函数里直接设置pen和brush的各种属性，而不是设计复杂的界面程序来修改这些设置。要实现什么绘图功能，只需在paintEventO函数里直接 修改代码即可