Qt5.9开发指南笔记

Qt类库概述

概述

qt本身并不是一种编程语言，它实质上是一个跨平台的C++开发类库，是用标准C艹+编写的类库，它为开发GUI应用程序和非GUI应用程序提供了各种类。
qt对标准C艹+进行了扩展，引入了一些新的概念和功能，例如信号与槽、对象属性等。Qt的元对象编译器(Meta- Object Compiler,MoC)是一个预处理器，在源程序被编译前先将这些
qt特性的程序转换为标准C++兼容的形式，然后再由标准C艹+编译器进行编译。这就是为什么在使用信号与槽机制的类里，必须添加一个 Q_OBJECT宏的原因，只有添加了这个宏，moc才能对类里的信号与槽的代码进行预处理。
Qt Core模块是qt类库的核心，所有其他模块都依赖于此模块，如果使用 qmake来构建项目， Qt Core模块则是被自动加入的Qt为C+语言增加的特性就是在 Qt Core模块里实现的，这些扩展特性由Qt的元对象系统实现，包括信号与槽机制、属性系统、动态类型转换等。

Ui-源码混合编程

在ui上布局完成后，需要构建工程才能索引出部件！

元对象系统

元对象系统由以下三个基础组成。
QObject类是所有使用元对象系统的类的基类在一个类的 private部分声明 Q OBJECT宏，使得类可以使用元对象的特性，如动态属性信号与槽。
MOC(元对象编译器)为每个 QObject的子类提供必要的代码来实现元对象系统的特性

信号与槽

qt使用信号与槽的机制实现对象间通信，它隐藏了复杂的底层实现，完成信号与槽的关联后，发射信号时并不需要知道Qt是如何找到槽函数的。Qt的信号与槽机制与 Delphi和C++ Builder的“事件—响应”比较类似，但是更加灵活。

某些开发架构使用回调函数( callback)实现对象间通信。与回调函数相比，信号与槽的执行速度稍微慢一点，因为需要査找连接的对象和槽函数，但是这种差别在应用程序运行时是感觉不到的，而其提供的灵活性却比回调函数强很多。

信号-槽的第一种写法

这是旧版写法。

connect(m_pBtn,SIGNAL(sigClicked()),this,SLOT(onClicked()));

信号-槽的第二种写法

connect(m_pBtn,&MyButton::sigClicked,this,&Widget::onClicked);

但是此方法只适用于信号名是唯一的时候，如果有重载编译会报错。

信号-槽的第三种写法

connect(m_pBtn, QOverload<bool>::of(&MyButton::sigClicked),this,&Widget::onClicked);

很显然这种写法相对于第二种会比较简单些，但依然不能连接到重载的槽函数，如果连接重载槽函数，还是会报之前的错误。

信号-槽的第三种写法

Lambda 函数写法

connect(m_pBtn, QOverload<bool>::of(&MyButton::sigClicked),

               [=](bool check){
                /* do something.. */
                
                });

connect(m_pBtn, static_cast<void (MyButton::*)(bool)>(&MyButton::sigClicked), this, [=](bool check){

                 //do something

                 });

自定义信号

在自己设计的类里也可以自定义信号，信号就是在类定义里声明的一个函数，但是这个函数无需实现，只需发射(emit)。
例如，在下面的自定义类 PErson的 signals部分定义一个信号 age Changed(int)

class PErson: public Qobject
{
Q OBJECT 

private:
 int m age=l0;
public:
 void incAge();
sgna⊥s：
 void ageChanged(int value);
}

信号函数必须是无返回值的函数，但是可以有输入参数。信号函数无需实现，只需在某些条件下发射信号。例如，在 encAgeD函数中发射信号，其代码如下。

void Qperson::incAge()
{
  m_age++;
  emit ageChanged(m_age);
}

在 incAge函数里，当私有变量mage变化后，发射信号ageChanged(int)，表示年龄发生了变化。至于是否有与此信号相关联的槽函数，信号发射者并不管。如果在使用 QPerson类对象的程序中为此信号关联了槽函数，在 encAged函数里发射此信号时，就会执行相关联的槽函数。至于是否立即执行槽函数，发射信号的线程是否等待槽函数执行完之后再执行后面的代码，与connecto函数设置信号与槽关联时设置的连接类型以及信号与槽是否在同一个线程有关。

自定义槽函数

private slots:
  void on_ageChanged(int value);
``

## 元对象特性测试实例
```cpp
//PErson是 QObject的子类，在类定义部分使用了宏 Q OBJECT，这样 QPerson就获得了元对象系统支持，能使用信号与槽、属性等功能。
class QPerson : public QObject
{
    Q_OBJECT
//PErson使用 Q CLASSINFO宏定义了3个附加信息，使用 Q PROPERTY宏定义了3个属性，还定义了一个信号。
    Q_CLASSINFO("author","Wang")
    Q_CLASSINFO("company","UPC")
    Q_CLASSINFO("version","1.0.0")

    Q_PROPERTY(int age READ age WRITE setAge NOTIFY ageChanged)
    Q_PROPERTY(QString name MEMBER m_name)
    Q_PROPERTY(int score MEMBER m_score)
private:
    int  m_age=10;
    QString m_name;
    int     m_score=79;
public:
    explicit QPerson(QString fName, QObject *parent = nullptr);

    int     age();
    void    setAge(int value);

    void    incAge();
signals:
    void    ageChanged( int  value);

public slots:
};

Qt模块

常用组件

略

标准组件

lineEdit-QString

字符串与数值转换；进制转换。

#include "mainwindow.h"
#include "ui_mainwindow.h"
#include<QString>
#include<QDebug>

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
}

MainWindow::~MainWindow()
{
    delete ui;
}

void MainWindow::on_btnCal_clicked()
{
    float num=(ui->editNum->text()).toFloat();
    float single=(ui->editSingle->text()).toFloat();
    float total=num*single;
    
    if(num && single)
    {
        qDebug()<<num*single;
        
        QString str;
        str=str.sprintf("%.2f",total);
        //str=str.sprintf("%.2f",num*single);  //usage is wrong!
        ui->editTotal->setText(str);
    }
}

数值与字符串转换

字符串转数值

成员函数方法：

.toFloat(bool *ok=Q_NULLPTR,int base=10)

数值转换为字符串

可以使用以下静态函数：

str=QString::number(total,'f',2);
str=QString::asprintf("%.2f",total);

进制转换

十进制转换为二进制

void MainWindow::on_btnBin_clicked()
{
    QString str= ui->editBin->text();
    if(str==nullptr)
    {
        return;
    }
    int val = str.toInt();

    //str=str.setNum(val,2);
    str=QString::number(val,2);

    str=str.toUpper();//转换为大写

    ui->editDec->setText(str);
}

二进制转换为十进制

void MainWindow::on_btnBin_clicked()
{
    QString str= ui->editBin->text();
    if(str==nullptr)
    {
        return;
    }

    bool ok;
    int val = str.toInt(&ok,2);//以2进制方式读入。

    str=QString::number(val,10);
    str=str.toUpper();//转换为大写

    ui->editDec->setText(str);
}

QString常用功能

• append() 在字符串后面添加字符串
• prepend() 在字符串前面添加字符串
• toUpper() 将字符串全部转换为大写
• toLower() 将字符串全部转换为小写
• count() size() length() 这三个函数相同，返回字符个数，注意一个汉字算一个字符。
• trimmed() 去掉字符串首尾空格
• simplified() 不仅去掉首尾空格，还将中间多个空格格式化为一个空格。
• indexof() 返回最先出现的字符索引
• lastIdexof() 返回最后出现的字符索引
• isNull() isEmpty() 是否为空
• contains() 是否包含某个字符串
• startsWith() 判断是否以某个字符串开头
• endsWith() 判断是否以某个字符串结尾
• left() 从字符串中左边取多少个字符
• right() 从字符串中左边取多少个字符
• section(sep,start,end) 从字符串中提取以sep为分隔符，从start到end端的字符串

SpinBox

定时器

//.h
private:
  QTimer *fTimer; //定时器
  QTime *fTimeCounter; //计时器
private slots:
  void on_timer_timeout(); //定时器溢出处理槽函数

//.cpp
fTimer=new QTimer(this);
fTimer->setInterval(1000); //定时器周期，ms
connect(fTimer,SIGNAL(timeout()),this,SLOT(on_timer_timeout));

fTimer->stop();//停止定时器

对话框

文件读写

Qpainter

Qpainter是一种2D非交互式矢量输出画图库。

可以直接在Qwidget中绘画，

使用时需要复写 paintEvent :

protected:
    void    paintEvent(QPaintEvent *event) Q_DECL_OVERRIDE;

当发生一下情况时会产生绘制事件并调用paintEvent()函数:

1.在窗口部件第一次显示时，系统会自动产生一个绘图事件，从而强制绘制这个窗口部件。

2.当重新调整窗口部件的大小时，系统也会产生一个绘制事件。

3.当窗口部件被其他窗口部件遮挡，然后又再次显示出来的时候，就会对那些隐藏的区域产生一个绘制事件。

同时可以调用QWidget::update()或者QWidget::repaint()来强制产生一个绘制事件。二者的区别是:

repaint()函数会强制产生一个即时的重绘事件,而update()函数只是在Qt下一次处理事件时才调用一次绘制事件。

如果多次调用update(),Qt会把连续多次的绘制事件压缩成一个单一的绘制事件，这样可避免闪烁现象。

Qpainter组成

painter，画笔。 批注：就是线属性！
brush，笔刷。 批注：就是填充！
路径。 批注：线要显示的位置。

案例 画矩形：

布局

widget.h

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>

namespace Ui {
class Widget;
}

class Widget : public QWidget
{
    Q_OBJECT

public:
    explicit Widget(QWidget *parent = nullptr);
    ~Widget();

private:
    Ui::Widget *ui;

private:
    void    myDrawFilledRect();
    void    myDrawTextureRect();
    void    myDrawGradient();

    void    total();

    void    myDrawShape(); //绘制基本图形

protected:
    void    paintEvent(QPaintEvent *event) Q_DECL_OVERRIDE;
};

#endif // WIDGET_H

widget.cpp

#include "widget.h"
#include "ui_widget.h"

#include    <QPainter>

void Widget::myDrawFilledRect()
{//基本绘图
    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); //划线颜色

    //Qt::NoPen,Qt::SolidLine, Qt::DashLine, Qt::DotLine,Qt::DashDotLine,Qt::DashDotDotLine,Qt::CustomDashLine
    pen.setStyle(Qt::SolidLine);//线的类型，实线、虚线等

    //Qt::FlatCap, Qt::SquareCap,Qt::RoundCap
    pen.setCapStyle(Qt::FlatCap);//线端点样式

    //Qt::MiterJoin,Qt::BevelJoin,Qt::RoundJoin,Qt::SvgMiterJoin
    pen.setJoinStyle(Qt::BevelJoin);//线的连接点样式
    painter.setPen(pen);

//设置画刷
//    QPixmap texturePixmap("C:\Users\Administrator\Desktop\123.jpg");
    QBrush  brush;
    brush.setColor(Qt::yellow); //画刷颜色
    brush.setStyle(Qt::SolidPattern); //画刷填充样式
//    brush.setStyle(Qt::TexturePattern); //画刷填充样式
//    brush.setTexture(texturePixmap); //设置材质图片
    painter.setBrush(brush);

//Qt::NoBrush,Qt::SolidPattern,Qt::Dense1Pattern,Qt::Dense2Pattern,..,Qt::Dense7Pattern,Qt::HorPattern
// Qt::VerPattern, Qt::CrossPattern, Qt::BDiagPattern,Qt::FDiagPattern,Qt::DiagCrossPattern,
// Qt::LinearGradientPattern,Qt::ConicalGradientPattern,Qt::RadialGradientPattern
// Qt::TexturePattern


//绘图
//    painter.drawLine(rect.left(),rect.top(),rect.right(),rect.bottom());
    painter.drawRect(rect); //只填充定义的渐变区域
//    painter.drawRect(this->rect()); //填充更大区域，会有延展效果
//    painter.fillRect(rect,Qt::red);
//    painter.drawRoundRect(rect);
//    painter.drawRoundedRect(rect,40,20);

//    painter.drawEllipse(rect);
//    painter.drawPolyline(points,9);
//    painter.drawPolygon(points,9);
//    painter.drawPoints(points,9);

//    painter.translate(100,300);
//    painter.drawPath(starPath);

//    painter.translate(200,0);
//    painter.drawPath(starPath);

//    painter.translate(200,0);
//    painter.drawPath(starPath);

//    painter.drawArc(rect,30*16,80*16);
//    painter.drawChord(rect,90*16,120*16);
//    painter.drawPie(rect,90*16,120*16);
    //    painter.drawText(rect,"Hello, QT");
}

void Widget::myDrawTextureRect()
{
   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); //划线颜色

   //Qt::NoPen,Qt::SolidLine, Qt::DashLine, Qt::DotLine,Qt::DashDotLine,Qt::DashDotDotLine,Qt::CustomDashLine
   pen.setStyle(Qt::SolidLine);//线的类型，实线、虚线等

   //Qt::FlatCap, Qt::SquareCap,Qt::RoundCap
   pen.setCapStyle(Qt::FlatCap);//线端点样式

   //Qt::MiterJoin,Qt::BevelJoin,Qt::RoundJoin,Qt::SvgMiterJoin
   pen.setJoinStyle(Qt::BevelJoin);//线的连接点样式
   painter.setPen(pen);

//设置画刷
   QPixmap texturePixmap(":images/images/texture.jpg");
   QBrush  brush;
//   brush.setColor(Qt::yellow); //画刷颜色
//   brush.setStyle(Qt::SolidPattern); //画刷填充样式
    brush.setStyle(Qt::TexturePattern); //画刷填充样式
    brush.setTexture(texturePixmap); //设置材质图片
   painter.setBrush(brush);


//绘图
   painter.drawRect(rect); //只填充定义的渐变区域
}

void Widget::myDrawGradient()
{
   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.setStyle(Qt::NoPen);//线的类型，实线、虚线等
//   painter.setPen(pen);


//线性渐变
//    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::green);//起点颜色
    linearGrad.setColorAt(1,Qt::red);//终点颜色
    linearGrad.setSpread(QGradient::ReflectSpread);  //展布模式
//QGradient::PadSpread ,QGradient::RepeatSpread, QGradient::ReflectSpread
    painter.setBrush(linearGrad);

//径向渐变
//    QRadialGradient  radialGrad(W/2,H/2,qMax(W/8,H/8),W/2,H/2);
////    radialGrad.setColorAt(0,Qt::white);
//    radialGrad.setColorAt(0,Qt::green);
//    radialGrad.setColorAt(1,Qt::blue);
//    radialGrad.setSpread(QGradient::ReflectSpread);
//    //QGradient::PadSpread ,QGradient::RepeatSpread, 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);


//绘图
//   painter.drawRect(rect); //只填充定义的渐变区域
    painter.drawRect(this->rect()); //填充更大区域，会有延展效果
}

void Widget::total()
{
   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); //中间区域矩形框

//    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]);

//    painter.scale(width() / 100.0, height() / 100.0);
//    painter.translate(50.0, 50.0);

//    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();

//绘制曲线
//    path.moveTo(points[0]);
//    path.cubicTo(points[1],points[4],points[2]);

//设置字体
//    QFont   font;
//    font.setPointSize(30);
//    font.setBold(true);
//    painter.setFont(font);

//设置画笔
   QPen    pen;
   pen.setWidth(3); //线宽
   pen.setColor(Qt::red); //划线颜色

   //Qt::NoPen,Qt::SolidLine, Qt::DashLine, Qt::DotLine,Qt::DashDotLine,Qt::DashDotDotLine,Qt::CustomDashLine
   pen.setStyle(Qt::SolidLine);//线的类型，实线、虚线等

   //Qt::FlatCap, Qt::SquareCap,Qt::RoundCap
   pen.setCapStyle(Qt::FlatCap);//线端点样式

   //Qt::MiterJoin,Qt::BevelJoin,Qt::RoundJoin,Qt::SvgMiterJoin
   pen.setJoinStyle(Qt::BevelJoin);//线的连接点样式
   painter.setPen(pen);

//设置画刷
//    QPixmap texturePixmap(":images/images/texture.jpg");
   QBrush  brush;
   brush.setColor(Qt::yellow); //画刷颜色
   brush.setStyle(Qt::SolidPattern); //画刷填充样式
//    brush.setStyle(Qt::TexturePattern); //画刷填充样式
//    brush.setTexture(texturePixmap); //设置材质图片
   painter.setBrush(brush);

//Qt::NoBrush,Qt::SolidPattern,Qt::Dense1Pattern,Qt::Dense2Pattern,..,Qt::Dense7Pattern,Qt::HorPattern
// Qt::VerPattern, Qt::CrossPattern, Qt::BDiagPattern,Qt::FDiagPattern,Qt::DiagCrossPattern,
// Qt::LinearGradientPattern,Qt::ConicalGradientPattern,Qt::RadialGradientPattern
// Qt::TexturePattern

//线性渐变
////    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);  //展布模式
////QGradient::PadSpread ,QGradient::RepeatSpread, QGradient::ReflectSpread
//    painter.setBrush(linearGrad);

//径向渐变
//    QRadialGradient  radialGrad(W/2,H/2,qMax(W/8,H/8),W/2,H/2);
////    radialGrad.setColorAt(0,Qt::white);
//    radialGrad.setColorAt(0,Qt::green);
//    radialGrad.setColorAt(1,Qt::blue);
//    radialGrad.setSpread(QGradient::ReflectSpread);
//    //QGradient::PadSpread ,QGradient::RepeatSpread, 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);


//设置复合模式
//    painter.setCompositionMode(QPainter::CompositionMode_SourceOver);//

//    painter.translate(W/4,H/4);
//    painter.rotate(30);
//    painter.scale(0.5,0.5);
//    painter.shear(0.1,0.5);

//绘图
//    painter.drawLine(rect.left(),rect.top(),rect.right(),rect.bottom());
   painter.drawRect(rect); //只填充定义的渐变区域
//    painter.drawRect(this->rect()); //填充更大区域，会有延展效果
//    painter.fillRect(rect,Qt::red);
//    painter.drawRoundRect(rect);
//    painter.drawRoundedRect(rect,40,20);
//    painter.drawEllipse(rect);
//    painter.drawPolyline(points,9);
//    painter.drawPolygon(points,9);
//    painter.drawPoints(points,9);

//    painter.translate(100,300);
//    painter.drawPath(starPath);

//    painter.translate(200,0);
//    painter.drawPath(starPath);

//    painter.translate(200,0);
//    painter.drawPath(starPath);

//    painter.drawArc(rect,30*16,80*16);
//    painter.drawChord(rect,90*16,120*16);
//    painter.drawPie(rect,90*16,120*16);
//    painter.drawText(rect,"Hello, QT");

//    QPixmap pixmap;
//    pixmap.load(":/images/images/qt.jpg");
//    painter.drawPixmap(rect.left(),rect.top(),pixmap);

}

void Widget::myDrawShape()
{
   QPainter    painter(this);//创建QPainter对象
   painter.setRenderHint(QPainter::Antialiasing);
   painter.setRenderHint(QPainter::TextAntialiasing);

   int W=this->width(); //绘图区宽度
   int H=this->height(); //绘图区高度

//设置画笔
   QPen    pen;
   pen.setWidth(3); //线宽
   pen.setColor(Qt::black); //划线颜色

   //Qt::NoPen,Qt::SolidLine, Qt::DashLine, Qt::DotLine,Qt::DashDotLine,Qt::DashDotDotLine,Qt::CustomDashLine
   pen.setStyle(Qt::SolidLine);//线的类型，实线、虚线等

   //Qt::FlatCap, Qt::SquareCap,Qt::RoundCap
   pen.setCapStyle(Qt::FlatCap);//线端点样式

   //Qt::MiterJoin,Qt::BevelJoin,Qt::RoundJoin,Qt::SvgMiterJoin
   pen.setJoinStyle(Qt::BevelJoin);//线的连接点样式
   painter.setPen(pen);

//1. 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);

//2. 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);

//3.drawConvexPolygon()
//   QPoint points[4]={
//      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)
//   };
//   painter.drawConvexPolygon(points, 4);


//4. drawEllipse
//   QRect   rect(W/4,H/4,W/2,H/2);
//   painter.drawEllipse(rect);

//5. drawImage
//   QRect   rect(W/4,H/4,W/2,H/2);
//   QImage  image(":images/images/qt.jpg");
//   painter.drawImage(rect, image);

//6.  drawLine
//   QLine   Line(W/4,H/4,W/2,H/2);
//   painter.drawLine(Line);

//7.  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);

// 8.QPainterPath
//   QRect   rect(W/4,H/4,W/2,H/2);
//   QPainterPath  path;
//   path.addEllipse(rect);
//   path.addRect(rect);
//   painter.drawPath(path);

//9.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);

//10. drawPixmap
//   QRect   rect(W/4,H/4,W/2,H/2);
//   QPixmap   pixmap(":images/images/qt.jpg");
//   painter.drawPixmap(rect, pixmap);

//11. 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);

//12.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);

//13.drawRect
//   QRect   rect(W/4,H/4,W/2,H/2);
//   painter.drawRect(rect);

//14.drawRect
//   QRect   rect(W/4,H/4,W/2,H/2);
//   painter.drawRoundedRect(rect,20,20);

//14.drawRect
//   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);

//15. fillRect
   QRect   rect(W/4,H/4,W/2,H/2);
   painter.fillRect (rect,Qt::green);

//16.   fillPath
//   QRect  rect(W/4,H/4,W/2,H/2);
//   QPainterPath  path;
//   path.addEllipse(rect);
//   path.addRect(rect);
//   painter.fillPath(path,Qt::red);

//17.drawPoint
//     painter.drawPoint(QPoint(W/2,H/2));

//18. 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);
}

void Widget::paintEvent(QPaintEvent *event)
{
// 1. 基本绘图1，绘制一个填充矩形
   myDrawFilledRect();

// 2.   用材质图片填充一个矩形
   //myDrawTextureRect();

//3.  渐变填充
//   myDrawGradient();

//4. 绘制基本图形
   //myDrawShape();

//    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); //中间区域矩形框

//    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]);

//    painter.scale(width() / 100.0, height() / 100.0);
//    painter.translate(50.0, 50.0);

//    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();

//绘制曲线
//    path.moveTo(points[0]);
//    path.cubicTo(points[1],points[4],points[2]);

//设置字体
//    QFont   font;
//    font.setPointSize(30);
//    font.setBold(true);
//    painter.setFont(font);

//设置画笔
//    QPen    pen;
//    pen.setWidth(3); //线宽
//    pen.setColor(Qt::red); //划线颜色

//    //Qt::NoPen,Qt::SolidLine, Qt::DashLine, Qt::DotLine,Qt::DashDotLine,Qt::DashDotDotLine,Qt::CustomDashLine
//    pen.setStyle(Qt::SolidLine);//线的类型，实线、虚线等

//    //Qt::FlatCap, Qt::SquareCap,Qt::RoundCap
//    pen.setCapStyle(Qt::FlatCap);//线端点样式

//    //Qt::MiterJoin,Qt::BevelJoin,Qt::RoundJoin,Qt::SvgMiterJoin
//    pen.setJoinStyle(Qt::BevelJoin);//线的连接点样式
//    painter.setPen(pen);

////设置画刷
////    QPixmap texturePixmap(":images/images/texture.jpg");
//    QBrush  brush;
//    brush.setColor(Qt::yellow); //画刷颜色
//    brush.setStyle(Qt::SolidPattern); //画刷填充样式
//    brush.setStyle(Qt::TexturePattern); //画刷填充样式
//    brush.setTexture(texturePixmap); //设置材质图片
//    painter.setBrush(brush);

//Qt::NoBrush,Qt::SolidPattern,Qt::Dense1Pattern,Qt::Dense2Pattern,..,Qt::Dense7Pattern,Qt::HorPattern
// Qt::VerPattern, Qt::CrossPattern, Qt::BDiagPattern,Qt::FDiagPattern,Qt::DiagCrossPattern,
// Qt::LinearGradientPattern,Qt::ConicalGradientPattern,Qt::RadialGradientPattern
// Qt::TexturePattern

//线性渐变
//    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);  //展布模式
//QGradient::PadSpread ,QGradient::RepeatSpread, QGradient::ReflectSpread
//    painter.setBrush(linearGrad);

//径向渐变
//    QRadialGradient  radialGrad(W/2,H/2,qMax(W/8,H/8),W/2,H/2);
//    radialGrad.setColorAt(0,Qt::white);
//    radialGrad.setColorAt(0,Qt::green);
//    radialGrad.setColorAt(1,Qt::blue);
//    radialGrad.setSpread(QGradient::ReflectSpread);
//    //QGradient::PadSpread ,QGradient::RepeatSpread, 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);


//设置复合模式
//    painter.setCompositionMode(QPainter::CompositionMode_SourceOver);//

//    painter.translate(W/4,H/4);
//    painter.rotate(30);
//    painter.scale(0.5,0.5);
//    painter.shear(0.1,0.5);

//绘图
//    painter.drawLine(rect.left(),rect.top(),rect.right(),rect.bottom());
//    painter.drawRect(rect); //只填充定义的渐变区域
//    painter.drawRect(this->rect()); //填充更大区域，会有延展效果
//    painter.fillRect(rect,Qt::red);
//    painter.drawRoundRect(rect);
//    painter.drawRoundedRect(rect,40,20);
//    painter.drawEllipse(rect);
//    painter.drawPolyline(points,9);
//    painter.drawPolygon(points,9);
//    painter.drawPoints(points,9);

//    painter.translate(100,300);
//    painter.drawPath(starPath);

//    painter.translate(200,0);
//    painter.drawPath(starPath);

//    painter.translate(200,0);
//    painter.drawPath(starPath);

//    painter.drawArc(rect,30*16,80*16);
//    painter.drawChord(rect,90*16,120*16);
//    painter.drawPie(rect,90*16,120*16);
//    painter.drawText(rect,"Hello, QT");

//    QPixmap pixmap;
//    pixmap.load(":/images/images/qt.jpg");
//    painter.drawPixmap(rect.left(),rect.top(),pixmap);
}

Widget::Widget(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::Widget)
{
   // ui->setupUi(this);

    setPalette(QPalette(Qt::white));//设置窗口为白色背景
    setAutoFillBackground(true);
    this->resize(400,400);
}

Widget::~Widget()
{
    delete ui;
}

然后将设计师界面的widget提升为自己实现的widget，再编译运行就可以了！

注：两个按钮没啥用，就是练习布局和自定义部件用的。

Qtchart

pro文件引入chart

QT       += charts

mainwindow.h

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include<QtCharts>
QT_CHARTS_USE_NAMESPACE     //使用宏定义


namespace Ui { class MainWindow; }


class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private:
    Ui::MainWindow *ui;

private:
    void    createChart();//
};
#endif // MAINWINDOW_H

mainwindow.cpp

#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::MainWindow)
{
    ui->setupUi(this);
     createChart();
}

MainWindow::~MainWindow()
{
    delete ui;

}

void MainWindow::createChart()
{ //创建图表
    QChartView *chartView=new QChartView(this); //创建 ChartView

    QChart *chart = new QChart(); //创建 Chart
    chart->setTitle("简单函数曲线");

    chartView->setChart(chart); //Chart添加到ChartView
    this->setCentralWidget(chartView);

//创建曲线序列
    QLineSeries *series0 = new QLineSeries();
    QLineSeries *series1 = new QLineSeries();
    series0->setName("Sin曲线");
    series1->setName("Cos曲线");
    chart->addSeries(series0); //序列添加到图表
    chart->addSeries(series1);

//    QPen    pen;
//    pen.setStyle(Qt::DotLine);//Qt::SolidLine, Qt::DashLine, Qt::DotLine, Qt::DashDotLine
//    pen.setWidth(2);
//    pen.setColor(Qt::red);
//    series0->setPen(pen);

//    pen.setStyle(Qt::SolidLine);//Qt::SolidLine, Qt::DashLine, Qt::DotLine, Qt::DashDotLine
//    pen.setColor(Qt::blue);
//    series1->setPen(pen);

//序列添加数值
    qreal   t=0,y1,y2,intv=0.1;
    int cnt=100;
    for(int i=0;i<cnt;i++)
    {
        y1=qSin(t);//+qrand();
        series0->append(t,y1);

        y2=qSin(t+20);
        series1->append(t,y2);

        t+=intv;
    }


//    chart->createDefaultAxes();
//    chart->axisX()->setTitleText("time(secs)");
//    chart->axisY()->setTitleText("value");

//创建坐标轴
    QValueAxis *axisX = new QValueAxis; //X 轴
    axisX->setRange(0, 10); //设置坐标轴范围
//    axisX->setLabelFormat("%.1f"); //标签格式
//    axisX->setTickCount(11); //主分隔个数
//    axisX->setMinorTickCount(4);
    axisX->setTitleText("time(secs)"); //标题
//    axisX->setGridLineVisible(false);

    QValueAxis *axisY = new QValueAxis; //Y 轴
    axisY->setRange(-2, 2);
    axisY->setTitleText("value");
//    axisY->setTickCount(5);
//    axisY->setMinorTickCount(4);
//    axisY->setLabelFormat("%.2f"); //标签格式
//    axisY->setGridLineVisible(false);

    chart->addAxis(axisX, Qt::AlignBottom);  //并且XY轴的位置是上和右
        chart->addAxis(axisY, Qt::AlignLeft);
//    chart->setAxisX(axisX, series0); //为序列设置坐标轴
//    chart->setAxisY(axisY, series0); //

   // chart->setAxisX(axisX, series1); //为序列设置坐标轴
   // chart->setAxisY(axisY, series1); //
    this->setCentralWidget(chartView);  //将图表显示在整个窗口
}

批注

Qt的摄像头功能不好用，因此可以引用opencv库，opencv库需要使用cmake编译完，然后参考以下链接引用opencv：
https://blog.csdn.net/sinat_35845281/article/details/94204074?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.nonecase&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-1.nonecase

除了语言之外，还有文件系统，多媒体系统，通信系统。

关于Qt组件：
分为输入组件，输出组件，布局组件，MVC组件等。
其中，label不仅可以显示文字，也可以显示图片和视频。

可以使用提升为把基本部件转化为 自定义部件。

可以使用 Qt样式表 可以自定义窗口部件样式。

Qpainter 2D不可交互矢量图形。

QSQL 数据库模块。

参考链接：
https://library-cdq.oss-cn-beijing.aliyuncs.com/technology/Qt5.9 c%2B%2B开发指南.pdf
https://github.com/CdqPT/Qt5.9C-DevelopmentTutorialCode/tree/master/Source