Qt自定义控件的使用

QT5自定义控件并将控件加入到控件列表中
1、创建自定义控件，这里同样以16进制的QSpinBox为例。
新建一个工程，选择其他项目，选则Qt4设计师自定义控件
设置好文件路径和文件名称以后，根据创建向导，到这一步，如图

输入好类的名称之后，后自动生成图中所示的文件,在这里可以设置好图标文件，图标文件就是显示在控件列表中的图标。
这个是最后生成的工程文件，.pri目录下的是我们要编写的控件的头文件和源文件。.pro目录下是部件插件化的相关内容。
首先先编写好控件的代码。
控件头文件

#ifndef HEXSPINBOX_H
#define HEXSPINBOX_H

#include <QWidget>
#include <QValidator>
#include <QSpinBox>
class HexSPinbox : public QSpinBox
{
    Q_OBJECT

public:
    HexSPinbox(QWidget *parent = 0);
protected:
    QValidator::State validate(QString &text, int &pos) const;
    int valueFromText(const QString &text) const;
    QString textFromValue(int value) const;
private:
    QRegExpValidator *validator;
};

```handlebars
#endif // HEXSPINBOX_H

控件源文件代码

#include "hexspinbox.h"

HexSPinbox::HexSPinbox(QWidget *parent) :
    QWidget(parent)
{
   setRange(0, 255);
    validator = new QRegExpValidator(QRegExp("[0-9A-Fa-f]{1,8}"), this);
}
QValidator::State HexSPinbox::validate(QString &text, int &pos) const
{
    return validator->validate(text, pos);
}

int HexSPinbox::valueFromText(const QString &text) const
{
    bool ok;
    return text.toInt(&ok, 16);
}

QString HexSPinbox::textFromValue(int value) const
{
    return QString::number(value, 16).toUpper();
}

编写插件化的代码：
插件化头文件

#ifndef HEXSPINBOXPLUGIN_H
#define HEXSPINBOXPLUGIN_H

#include <QtUiPlugin/QDesignerCustomWidgetInterface>

class HexSPinboxPlugin : public QObject, public QDesignerCustomWidgetInterface
{
    Q_OBJECT
    Q_INTERFACES(QDesignerCustomWidgetInterface)
#if QT_VERSION >= 0x050000
    Q_PLUGIN_METADATA(IID "org.qt-project.Qt.QDesignerCustomWidgetInterface")
#endif // QT_VERSION >= 0x050000

public:
    HexSPinboxPlugin(QObject *parent = 0);

    bool isContainer() const;
    bool isInitialized() const;
    QIcon icon() const;
    QString domXml() const;
    QString group() const;
    QString includeFile() const;
    QString name() const;
    QString toolTip() const;
    QString whatsThis() const;
    QWidget *createWidget(QWidget *parent);
    void initialize(QDesignerFormEditorInterface *core);

private:
    bool m_initialized;
};

#endif // HEXSPINBOXPLUGIN_H

插件化源文件代码

#include "hexspinbox.h"
#include "hexspinboxplugin.h"

#include <QtPlugin>

HexSPinboxPlugin::HexSPinboxPlugin(QObject *parent)
    : QObject(parent)
{
    m_initialized = false;
}

void HexSPinboxPlugin::initialize(QDesignerFormEditorInterface * /* core */)
{
    if (m_initialized)
        return;

    // Add extension registrations, etc. here

    m_initialized = true;
}

bool HexSPinboxPlugin::isInitialized() const
{
    return m_initialized;
}

QWidget *HexSPinboxPlugin::createWidget(QWidget *parent)
{
    return new HexSPinbox(parent);
}

QString HexSPinboxPlugin::name() const
{
    return QLatin1String("HexSPinbox");
}

QString HexSPinboxPlugin::group() const
{
    return QLatin1String("custom Plugin");
}

QIcon HexSPinboxPlugin::icon() const
{
    return QIcon(QLatin1String(":/2.png"));
}

QString HexSPinboxPlugin::toolTip() const
{
    return QLatin1String("16进制的SpinxBox");
}

QString HexSPinboxPlugin::whatsThis() const
{
    return QLatin1String("16进制的SpinxBox");
}

bool HexSPinboxPlugin::isContainer() const
{
    return false;
}

QString HexSPinboxPlugin::domXml() const
{
    return QLatin1String("<widget class=\"HexSPinbox\" name=\"hexSPinbox\">\n</widget>\n");
}

QString HexSPinboxPlugin::includeFile() const
{
    return QLatin1String("hexspinbox.h");
}
#if QT_VERSION < 0x050000
Q_EXPORT_PLUGIN2(HexSpinboxplugin, HexSPinboxPlugin)
#endif // QT_VERSION < 0x050000

完成代码的编写后，在Release模式下构建，会在Release目录下生成一个动态库文件，后缀为.so。
接下来，需要将生成的动态库移动到Qt的设计师目录下。具体路劲为
~/qt5.14.0/Tools/QtCreator/lib/Qt/plugins/designer
~/qt5.14.0/Tools/QtCreator/lib/Qt/plugins/designer 下的内容
libHexSpinboxplugin.so libqquickwidget.so。

最后创建一个测试文件：这里需要先将Qt程序关闭之后，在打开，才会将刚刚加入的自定义控件加载出来。

这个时候，点击运行按钮，会提示没有包含头文件，这个时候我们需要把文件的路径加到工程文件中。此时点击编译会提示没有定义构造函数等等一系列的错误。这是因为我们没有加入库文件。
在工程中加入如下：

LIBS += -L/home/klc/qt5.14.0/Tools/QtCreator/lib/Qt/plugins/designer  -lHexSpinboxplugin
INCLUDEPATH += /home/klc/qtProject/plugin/BoxPlugin

-L后面的是库文件的路径，-l库名。
我们在设计师中再加入一个LcdNumber，用来显示自定义控件的数字。
最后运行结果：

在这里插入图片描述