Qt设计师控件的创建步骤-c++/QT/MFC-少有人走的路

Qt设计师控件的创建步骤

本篇博客的目的是简单介绍：创建一个用QLabel类来显示图片的自定义控件的编写。如果想实现在图片上绘制文字、箭头和曲线，请参考我的第二篇博客源码！！！给大家一个链接~【Qt自定义控件的创建与初步使用（二）之图片上绘制文字、箭头、曲线】在写自定义控件的过程中遇到了很多的难题，但都慢慢解决了，本人对Qt自定义控件的认识还不深刻，做的不对的地方，还请大家指出，我会尽快修改，免得误导他人！同时推荐一篇关于自定义控件的博客连接：http://blog.csdn.net/giselite/article/details/12622429，写的还挺详细，大家可以参考，关于Qtcreator和vs2013的相关安装和配置，网上有很多，Qt的安装和配置也比较简单，简单的配置后即可用于创建Qt自定义控件，这里不再赘述，贴心的给初学者两个关于Qt安装和配置的参考教程吧。连接（http://blog.csdn.net/wangell/article/details/41117139

http://tieba.baidu.com/p/3451630520）

配置：Qt creator5.7，Qt 5.7+VS2013（64位）（有人喜欢用后者，全凭个人爱好，我用的是creator，本文也会关联到后者的使用），本篇博客是关于创建Qt自定义控件的内容，本篇案例的说明用的是Qt5.6，VS2013（因为本人的电脑装的是Qt5.6，公司的电脑装的是Qt5.7），建议最好用Qt5.7，但实际操作中不会有太大差别。

一、新建Qt4设计师自定义控件工程

打开creator，按红色箭头所示，新建Qt4设计师自定义控件工程；

2.设置项目名称，位置；

3.下一步默认就好；

4.双击修改控件类工程名称（注：本篇博文所有是”CV“名称命名，均采用的大写符号），即可生成红色箭头所指的几个文件；

5.下一步，就会自动生成名为cvplugin的插件，下面的步骤中会用到它；

6.至此就完成了新建Qt4设计师自定义控件工程，就会生成如图所示的工程。

二、编写自定义控件界面

既然是控件，就应该有界面，本篇博客的目的是想创建一个继承于QWidget类，并用QLabel类来显示图片的自定义控件；既然默认生成的控件类只是一个继承了QWidget的类，只是一个空壳控件，所以你应该按如下的操作来为此控件添加内容。

1.为了简单起见，我不想自己手动去写这些界面相关的代码，为此我们可以先删掉默认生成的cv.h和cv.cpp文件，选中cv.h和cv.cpp文件，右键选择”删除文件“，并勾上”彻底删除“选项，确定删除即可；

2.这样我们就可以重新使用”CV“这个名称为此控件添加一个ui类了。在上图所示的界面中选中CV项目，右键选择“添加新文件”，使用Qt下的“Qt设计师界面类”模板，创建一个ui类，如下图所示：

3.选中Widget即可，其他全部默认；

4.写上”CV“即可，点击下一步；

5.默认下一步；

6.至此就为自定义控件工程添加上了UI界面；

7.双击"cv.ui”，拖拽一个Label到界面上，并调整下大小，居中即可。在右边的列表中可以看到label控件，因为想显示图片，所以用的肯定是属于Display Widgets类的“QLabel”。这样就为自定义控件CV添加了一个显示图片的类QLabel了，接下来就可以为这个“CV”工程构建.dll和.lib文件了；

8.先将编译器改为“Release”模式，然后执行下qmake，为什么这样，我也不是很清楚，你可以自己去查一下；

9.再点击那个绿色三角形按钮，会弹出“自定义执行挡”，不要管，直接关闭即可（我查过好像是什么接口，我也不是很清楚，毕竟也是接触Qt不久），最后点击那个小锤子，等右下角那个绿色进度条变暗了，即可在你所建立的工程目录下见到如图所示的“build-CV-Desktop_Qt_5_6_0_MSVC2013_64bit-Release”插件工程；

10.打开该文件，并找到如图所示的两个文件“cvplugin.dll”、"cvplugin.lib”，将两个文件并拷贝到你安装的Qt5.7的designer中（注意路径！！！，根据自己安装的进行），如下第二个图所示。若想用“VS2013+Qt设计师”进行程序编写的，你就要将两个文件“cvplugin.dll”、"cvplugin.lib”拷贝到如下第三个图所示的路径的文件夹下（注意路径！！！，根据自己安装的进行）；