Qt 使用大神插件快速创建树状导航栏

时间:2023-03-10 00:59:58
Qt 使用大神插件快速创建树状导航栏

前言

本博客仅仅记录自己的采坑过程以及帮助网友避坑,方便以后快速使用自定义控件,避免重复出错。

下载插件

大神 Github Qt 自定义控件项目地址:https://github.com/feiyangqingyun/qucsdk

插件简介

  • 1:设置节点数据相当方便,按照对应格式填入即可,分隔符,
  • 2:可设置提示信息 是否显示+宽度
  • 3:可设置行分隔符 是否显示+高度+颜色
  • 4:可设置选中节点线条突出显示+颜色+左侧右侧位置
  • 5:可设置选中节点三角形突出显示+颜色+左侧右侧位置
  • 6:可设置父节点的 选中颜色+悬停颜色+默认颜色
  • 7:可设置子节点的 选中颜色+悬停颜色+默认颜色
  • 8:可设置父节点文字的 图标边距+左侧距离+字体大小+高度
  • 9:可设置子节点文字的 图标边距+左侧距离+字体大小+高度
  • 10:可设置节点展开模式 单击+双击+禁用

使用插件

  1. 插件法的自定义控件使用,务必保证编译器完全一致。

  2. 将对应的quc.dll和libquc.a 或者 quc.lib(MSVC编译器才有)集成到项目中。

  3. 使用到哪个控件,只需要将对应控件的头文件集成到项目中即可。集成方法是将该头文件复制到sdk目录(因为pro文件写的是从sdk目录读取头文件),也可以自己定义目录。

  4. 项目的pro文件加入代码

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

    编译完成以后记得将动态库文件复制到可执行文件同一目录即可。

    查询大神提供的插件表查询插件头文件按上述过程添加即可

修改图标

 ui->listView->setItems("图书管理||0||,查询图书|图书管理|||0xf002,新增图书|图书管理|||0xf067,逾期管理||0||,查询逾期|逾期管理|||0xf002,账户管理||0||,查询读者|账户管理|||0xf002,新增读者|账户管理|||0xf067");

多次研究尝试后发现这些十六进制均是字体图标,到字体图标网站查询替换成自己喜欢的的免费图标

Font Awesome 图标地址: https://fontawesome.com/cheatsheet/free/solid

调用实例

ui->listView->setParentFontSize(22);		//设置父节点字体大小
ui->listView->setParentMargin(70); //设置父节点文字偏移距离
ui->listView->setParentHeight(48); //设置父节点高度
//设置父节点的 选中颜色+悬停颜色+默认颜色
ui->listView->setParentBgNormalColor(QColor(19,161,255));
ui->listView->setParentBgSelectedColor(QColor(84,110,255));
ui->listView->setParentBgHoverColor(QColor(84,110,255)); ui->listView->setChildFontSize(18); //设置子点字体大小
ui->listView->setChildMargin(110); //设置子点文字偏移距离
ui->listView->setChildIconMargin(80); //设置子点图标距离
ui->listView->setChildHeight(40); //设置子点高度
//子节点的 选中颜色+悬停颜色+默认颜色
ui->listView->setChildBgNormalColor(QColor(172,217,255));
ui->listView->setChildBgHoverColor(QColor(84,110,255));
ui->listView->setChildBgSelectedColor(QColor(84,110,255));
ui->listView->setChildTextNormalColor(QColor(0,0,0)); //设置子点文字默认颜色 // 管理||0|| 父节点 查询图书|图书管理|||0xf002 子节点
ui->listView->setItems("图书管理||0||,查询图书|图书管理|||0xf002,新增图书|图书管理|||0xf067,逾期管理||0||,查询逾期|逾期管理|||0xf002,账户管理||0||,查询读者|账户管理|||0xf002,新增读者|账户管理|||0xf067");

其他样式设置自行查看对应自定义控件头文件方法列表

注意问题

这个自定义控件是基于listView控件改写的,需要在UI界面拖一个 listView 控件 提升为自定义控件使用