Qt自定义控件：关于大佬“飞扬青云“的自定义UI控件的使用教程(MinGw,MSVC)

前言

最近在搞自定义控件，无意间发现大佬飞扬青云的开源项目，Qt/C++编写超精美自定义控件

这里先贴出大佬项目地址和博客

码云：wwlzq5/qucsdk (gitee.com)（旧版下载地址Qt4.7到Qt5.14）
github：https://github.com/feiyangqingyun/qucsdk (高版本下载地址Qt5.15到Qt6.5)
csdn：https://me.csdn.net/feiyangqingyun

由于没有在网上看到别人导入大佬的控件并使用(大多只是显示ui界面，没有使用控件图片，即有导入，但是没有使用，也不知道能不能用)，我想把它导入到Qt Creater并且能正常编译运行，废话不多说，直接上操作，因为我Qt 是低版本(5.14)的，所以我就按照旧版本的来说了，旧版新版操作一样，这里我将从两种编译方式讲，一篇到位

MinGw

第一步：

首先在帮助中可以看下自己Qt版本

记住自己的这个版本，下面要用到，这里可以看到我的是Qt5.14.1 MSVC2017 32位

第二步：

打开你下载的文件，应该是，解压后应该是这样的

新版是这样的

第三步：

根据自己的Qt版本，也就是上面我说的要用到的，我的是Qt5.14.1 MSVC2017 32位，根据自己的版本去文件夹里面找相应版本的文件夹

旧版去SDK开头那三个文件夹找(SDKDemo是作者的一个教学例子)，新版就去shared里面找,这里我解压过了，没必要全解压，就解压和你版本对应的就行

第四步：

打开文件夹，将图中的这两个文件，复制到你的Qt下Tools的designer中，这里我的路径是

E:\Qt\Qt\Tools\QtCreator\bin\plugins\designer

这时就可以打开qt,任意创建一个项目，就会发现，控件已经加载到Qt Creater中了，还可以拖动控件到ui界面中

第五步：

新建一个Qt项目，编译器选择MinGw,记住自己编译器的位数

第六步：

进入ui设计拉去一个控件(最好和我拉取的一样，因为不一样的控件，要引入的头文件不一样）

第七步：

右键项目任意文件，在explorer中展示，然后在项目中创建两个文件夹,bin和include

第八步：

根据自己的编译器位数，就是第五步中的编译器，这里我的是5.14.2 MinGW 64位，去下载的文件中去找和自己版本对应的文件夹，然后解压

旧版去SDK开头那三个文件夹找(SDKDemo是作者的一个教学例子)，新版就去shared里面找

第九步：

打开文件夹，然后将这四个文件复制到我们新建的bin文件夹中

复制到bin中

然后在下载的文件夹的include去找gaugecar.h这个头文件，将它复制到我们新建的项目的include文件夹中

复制到include中

第十步：

打开你新建的项目pro文件添加如下代码

INCLUDEPATH += $$PWD/include
DEPENDPATH += $$PWD/include

CONFIG(debug, debug|release){
LIBS += -L$$PWD/bin/ -lqucd
} else {
LIBS += -L$$PWD/bin/ -lquc
}

第十一步：

编译并运行项目，可以看到能正常编译运行，而且控件也有

第十二步：

这一步我们测试控件能否正常使用先在ui界面中添加两个按钮，更改控件内容为开始和停止，再更改控件名称，分别为startBtn和stopBtn

然后在mainwindow.h中添加如下代码

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QTimer>

QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

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

private slots:
    void timeOut();

    void on_startBtn_clicked();

    void on_stopBtn_clicked();

private:
    Ui::MainWindow *ui;
    QTimer* m_timer;
};
#endif // MAINWINDOW_H

在mainwindow.cpp中添加如下代码

#include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QTime>
#include <QColor>
MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    //创建一个定时器
    m_timer = new QTimer(this);
    //设置时间间隔1ms
    m_timer->setInterval(100);
    //
    connect(m_timer, SIGNAL(timeout()), this, SLOT(timeOut()));
}

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

void MainWindow::timeOut()
{
    static int value = 0;
    if (value < 100) {
        value++;
        ui->gaugeCar->setValue(value);
    } else if (value >= 100 && value < 200) {
        value++;
        int temp = 200 - value;
        ui->gaugeCar->setValue(temp);
    } else if (value == 200) {
        value = 0;
    }
}


void MainWindow::on_startBtn_clicked()
{
    //开始计时
    m_timer->start();
}

void MainWindow::on_stopBtn_clicked()
{
    //停止
    m_timer->stop();
}

第十三步：

编译，运行项目，可以看到，仪表盘的数字和指针在变化

运行效果视频

测试完成

MSVC