QT6 Creator编译KDDockWidgets并部署到QT
为什么使用KDDockWidgets
为什么使用KDDockWidgets呢?
首先它是一个优秀的开源dock库,弥补QDockWidget的不足,详情见官网。
其次它支持QML,这是我最终选择这个dock库的主要原因,因为最近在考虑将前端界面用QML做,后台用c++。考虑到之前的项目用到了另一个开源dock库Qt-Advanced-Docking-System,需要找一个可以在QML使用的替代库,所以找上了它。就风格而言我更喜欢Qt-Advanced-Docking-System这个库。来几张截图看看
KDDockWidgets的截图,感受下,这个动图不太清晰,它这些图标只能说丑爆了,好在KDDockWidgets支持重写,后面再详细介绍。
编译源码
下面步入正题,源码编译,开整!
1 源码下载
先从GitHub上下载最新源码,https://github.com/KDAB/KDDockWidgets
2.0以后的版本才支持QML
直接下载zip压缩包
,当然你喜欢clone也行,随意。
2 编译准备
如果未进行这步,将会报一堆错误,这块是最疼苦的,说实话,虽然把它的编译环境准备好了,但也是有点懵的,每个人的电脑环境不一样,完全按照我说的也未必在你的电脑上通过,这块随缘吧,但是还是有些必要的环境要配的。
本人不熟悉CMake,而这个库又只能CMake编译,试了用cmd cmake,cmake gui,折腾一天也没倒腾出来,最终放弃,选择自己熟悉的QT Creator来搞。
基本的软件需要先安装:
- cmake
- ninja
- qt
- vs
其中cmake和ninja不用特意安装,QT6会自动安装。
其中QtQuick 支持需要Qt >= 5.15,我本身的QT环境为QT6.5.3.配合的vs版本是vs2019.
环境变量
这步最关键,在path中将qt,vs,cmake和ninja,安装路径根据实际情况更改
配置完后,要确保环境变量生效,有不重启的方法,懒得折腾,直接重启。
3 开始编译
解压源码后,用QT Creator打开项目代码。
眼花缭乱的编译环境,我们选择第一个,会报错,
先不管,先把这些临时的构建kit都删了,其实不删也没影响,看着不舒服。
下面来解决报错问题,cmake报错,整个项目是灰色的
双击第一个报错,在cmake文件中,ENABLED_FRONTENDS未被置true,查找上下文发现,引起这个问题的主要原因是未找到QT环境。
我们的环境是QT6,默认启用QT5,需要把这个变量设置一下,QT Creator在构建设置中提供了CMake关键变量查询和设置的功能,和CMake gui类似,添加KDDockWidgets_QT6,然后勾选上,点击下部的执行CMake。
注意变量名称不是DKDDockWidgets_QT6
执行完CMake后,会出现
工程树也正常了
直接编译,没问题,example里的例程也都可以打开,学习代码,参看事例都没问题,作为动态库被使用也可以了。但是有些不方便,一是需要的dll,lib在build里比较散乱,而且也没有完整的include文件,需要直接把源码放到作为动态库的include里或者手动把需要的头文件挑出来。
简单新建个QML工程试试就知道了,把编译完的lib和dll放到测试工程的lib下,把源码拷贝到inc里,
配置pro文件
随便将源码例程的一段代码移植过来,比如customtabbar的代码,
编译,运行
需要注意的是在pro文件里需要加上DEFINES += KDDW_FRONTEND_QT。
不然头文件引用报错,kddockwidgets_export.h这个文件是编译生成的文件,直接在源码是找不到的,具体可看看CMakeList文件。
部属到QT环境
下面解锁正确玩法,即将这个库配置到QT。需要提前准备。
切回构建,将构建步骤里的install勾选上,debug和release需要分别勾选。然后构建工程。
经过几分钟的构建,(第一遍的时候就怕出现和cmake gui一样的一堆问题),煎熬一会后,成功编译。默认安装路径为C:\Program Files (x86)\KDDockWidgets
如果不是以管理员打开QT Creator,可能出现无法创建路径的错误,
至此,编译完成。在目标路径生成如下文件
熟悉QT的人看到上图应该不陌生,典型的QT环境结构,share是doc,这里没什么用,直接拷贝到QT下,不用担心内部路径结构,都是按QT的结构生成的。
还有些小瑕疵,继续上边的测试程序,更改pro文件,编译报错
查看D:\program\QT\6.5.3\msvc2019_64\mkspecs\modules下的qt_KDDockWidgets.pri
发现库名称为kddockwidgets-qt6
而我们编译生成的库名称是kddockwidgets-qt62.lib
将pri文件qt_KDDockWidgets.pri修改一下。重启QT,再次编译,库引用问题已经没了,但出现了头文件引用错误
这个也很容易找到问题,对比qt_KDDockWidgets.pri文件的includes和实际路径,多了一个kddockwidgets-qt6。
两个解决方法:
1 引用头文件时,多加一个kddockwidgets-qt6前缀;
2 修改qt_KDDockWidgets.pri的includes,在其后追加kddockwidgets-qt6,重启QT
编译,也没问题,运行
结语
看似过程很简单,如果自己从头来一遍,可能会遇到各种问题,最麻烦的莫过于配置环境变量,这是基础,这里不过后面的都免谈。
虽然过程坎坷,但最终还是搞定了。
下一步就是前面提到的重写它的样式了,图标太丑了。后面有时间会把重写样式再分享一下,不过那个就相对简单了。