一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)

文章目录

  • 利用QT进行工程编译
  • 快捷更换VS2022+QT对控件工程进行编译。
    • 对工程进行编译
  • 对控件进行测试
    • 添加自定义控件,使QT Designer识别
  • 求助:

接上文: 一篇学会QT使用–设计师自定义控件(QT自定义控件)(一)
上文讲到了如何利用UI界面对自定义控件显示效果进行编辑,接下来我们继续学习。

利用QT进行工程编译

进入工程编辑界面,我们的工程树如图所示:
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第1张图片
此时我们直接release看一下,工程会有报错
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第2张图片
为解决这个报错,我们需要对qip.h添加相关宏和头文件。

QDESIGNER_WIDGET_EXPORT 和

添加后,qip.h文件内容如下

#ifndef QIP_H
#define QIP_H

#include 
#include 

namespace Ui {
class QIP;
}

class QDESIGNER_WIDGET_EXPORT QIP : public QWidget
{
    Q_OBJECT

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

private:
    Ui::QIP *ui;
};

#endif // QIP_H

如果有警告,根据警告处理一下。
例如:
在这里插入图片描述
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第3张图片
针对该警告,我们将对已经存在的qipplugin.h文件的头文件进行如下修改。若无以上警告,可不修改。
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第4张图片
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第5张图片

添加完毕,先执行一下qmake。
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第6张图片
qmake完成后,点击右下角小锤子按钮,构建一下。
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第7张图片
如果是用QT开源代码生成的QT工具,构建完成,我们在构建目录下可以找到dll和lib文件。
由于我这里是使用的安装包工具,所以生成的只有dll文件和.a文件。而这两个文件在QTdesigner中不被识别(window系统下)
接下来我们更换VS2022来对文件进行编译。
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第8张图片

快捷更换VS2022+QT对控件工程进行编译。

利用VS创建一个QT控件工程。
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第9张图片
自定义一个项目名称。这个名称可以和QIP不一致,也可以一致,一致更便捷。
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第10张图片
直接按照默认格式进行创建,直至项目创建完成。
创建完成后,移除自动生成的.h和.cpp文件。直接删除。后边重新添加
注意!在添加新文件时,文件名要和删除掉的文件名保持一致
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第11张图片
移除后,我们重新添加带界面的文件。大致过程如上文。
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第12张图片

一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第13张图片
添加完毕后,项目架构如图所示:
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第14张图片
此时,为了方便,由于我们之前已经编辑好了界面文件,在这里,我们可以直接拿来用。
界面编辑过程参考:https://blog.csdn.net/MelyLenient/article/details/124025291#_19
利用文本查看工具,将两个ui文件打开。可以用notepad++或者sublime Text.

一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第15张图片
如果在VS中新建项目名称和之前在QT中新建的项目名称一致,可以直接拷贝复制过去即可。
若不一致,将QIP中的内容拷贝到MelyPlug中,然后将QIP字符全部替换为MelyPlug即可。
在这里插入图片描述
更换完成后,保存,然后再VS中对QT相关工程刷新一下
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第16张图片
至此,整个控件在VS中的准备工作完成。

对工程进行编译

将项目配置更改为release模式(必须),否则QTCreater找不到自定义的控件。
生成项目。
在这里插入图片描述
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第17张图片
生成项目后,可以在release文件夹下找到lib和dll文件。

对控件进行测试

添加自定义控件,使QT Designer识别

在项目生成release文件夹下找到.dll与.lib文件,将其放到D:\Qt\Qt5.12.12\5.12.12\msvc2017\plugins\designer(此路径需要根据自己的安装路径找)
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第18张图片
在./Release/uic路径下找到ui_MelyPlug.h头文件,拷贝到要调用的项目中。
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第19张图片

一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第20张图片
将控件项目中的自定义控件界面相关操作的.cpp和.h文件复制到需要的工程目录。
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第21张图片


一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第22张图片
通过VS2022打开需要使用自定义控件项目的ui文件。可以在QTDesigner中找到我们自定义的控件。
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第23张图片
此时我们可以直接拖拽控件,将控件放到我们的界面上。
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第24张图片
至此,自定义控件的基本流程完成。

求助:

该方法生成的控件,在QTCreater中无法被识别,而QTCreater中编译的又是linux下用的,不知道该如果将其编译为通用的?
一篇学会QT使用--设计师自定义控件(QT自定义控件)(二)_第25张图片

你可能感兴趣的:(QT学习日记,qt5,中间件,c++,c语言)