0


QT使用QTreeWidget控件制作多级折叠菜单

记录项目中实际用到的多级折叠菜单实现方式:项目代码简化版(亲测可用)

开发环境:VS2015+QT5.9.1

多级菜单(左右共两个图标,中间为文字,左图标为固定静态图标,右图标为折叠/展开动态图标),格式如下:图片 菜单标题 图片

     ![](https://img-blog.csdnimg.cn/6bb131b4949748a8af1db40f38a1b5a4.png) 系统配置         ∨

                 基本配置

                 时间配置

     ![](https://img-blog.csdnimg.cn/6dd32d563f9846a28f515399ca8d43fa.png)记录管理           >

步骤如下(QTreeWidget布局自行实现):

(1)UI设计师中Qwidget中拖入QTreeWidget控件,将对象名称更改为treeMenuWidget

    然后,在代码中设置隐藏根节点,如下方式2选1

     ui->treeMenuWidget->header()->setVisible(false);      //FastConfForm.cpp文件中代码隐藏方式

Or

    treeMenuWidget->header()->setVisible(false); ui_FastConfForm.h中代码隐藏方式

(2)FastConfForm.cpp,在根节点下使用代码方式创建多个2级和3级节点(根为第1级节点)

/*FastConfForm.cpp*/

//构造函数中主代码
FastConfForm::FastConfForm(QWidget *parent):
    ui(new Ui::FastConfForm)
{
ui->treeMenuWidget->setColumnWidth(0, 143);                //设置TreeItem元素宽度
ui->treeMenuWidget->setLayoutDirection(Qt::RightToLeft);//对其方式设置:右对齐

//TreeItem右侧图标
QIcon icon;
icon.addPixmap(QPixmap(":/image/pic/tab/Blu_selected.png"), QIcon::Selected, QIcon::Off);
icon.addPixmap(QPixmap(":/image/pic/tab/Blu_nomrmal.png"), QIcon::Selected, QIcon::On);

//新增TreeMenu的二级子节点:配置管理
//QTreeWidgetItem *wItemSysConf = new QTreeWidgetItem(ui->treeMenuWidget,QStringList(QStringLiteral("系统配置")),0);
QTreeWidgetItem *wItemSysConf = new QTreeWidgetItem(ui->treeMenuWidget, nullptr, 0);
wItemSysConf->setIcon(0, icon);            //添加右侧图标
wItemSysConf->setTextAlignment(0, Qt::AlignRight);
QTreeWidgetItem *wItemSysConf_Base  = new QTreeWidgetItem(wItemSysConf, QStringList(QStringLiteral("基本配置")), 1);
QTreeWidgetItem *wItemSysConf_Time = new QTreeWidgetItem(wItemSysConf, QStringList(QStringLiteral("时间配置")), 2);
wItemSysConf->addChild(wItemSysConf_Base  );            //添加三级子节点
wItemSysConf->addChild(wItemSysConf_Time);            //添加三级子节点
wItemSysConf_Base->setTextAlignment(0, Qt::AlignHCenter);
wItemSysConf_Time->setTextAlignment(0, Qt::AlignHCenter);

//新增TreeMenu的二级子节点:记录管理
//QTreeWidgetItem *wItemRecordMgt = new QTreeWidgetItem(ui->treeMenuWidget, QStringList(QStringLiteral("记录管理")),3);
QTreeWidgetItem *wItemRecordMgt = new QTreeWidgetItem(ui->treeMenuWidget, nullptr, 3);
wItemParkMgt->setIcon(0, icon);                  //添加右侧图标
wItemParkMgt->setTextAlignment(0, Qt::AlignRight);

//添加槽函数【槽函数需要在.h文件中声明】
connect(ui->treeMenuWidget, SIGNAL(itemClicked(QTreeWidgetItem*, int)), this, SLOT(showSelectedWidget(QTreeWidgetItem*, int)));

    //设置2级菜单的左侧图标和文件
    setLeftIconAndText(":/image/pic/tab/Blu_nomrmal.png", QString(QStringLiteral("系统配置")), wItemSysConf );
    setLeftIconAndText(":/image/pic/tab/Blu_nomrmal.png", QString(QStringLiteral("记录管理")), wItemRecordMgt );

    //展开默认节点
    expandMenu2Item(wItemSysConf , wItemSysConf_Base  , true);
}

//设置TreeItem的左侧图标和文字
void FastConfForm::setLeftIconAndText(QString strIconPath, QString strText, QTreeWidgetItem *treeWItem2)
{
    QWidget *userStateIcons = new QWidget();
    QHBoxLayout *hLayout = new QHBoxLayout();

    QLabel *m_pLabel = new QLabel();
    QLabel *m_pLabelPic = new QLabel();
    m_pLabel->setFixedSize(98, 20);
    m_pLabel->setText(strText);
    m_pLabelPic->setFixedSize(20, 20);
    m_pLabelPic->setPixmap(QPixmap(strIconPath).scaled(m_pLabel->size(), Qt::IgnoreAspectRatio, Qt::SmoothTransformation));
    m_pLabelPic->setScaledContents(true);
    hLayout->addSpacing(0);
    hLayout->addStretch(0);
    hLayout->setContentsMargins(0, 0, 0, 0);
    hLayout->addWidget(m_pLabel);
    hLayout->addWidget(m_pLabelPic);
    userStateIcons->setLayout(hLayout);
    ui->treeMenuWidget->setItemWidget(treeWItem2, 0, userStateIcons);    //Item添加Widget窗口
}

//单击Tree节点处理(点击:展开/折叠)函数
void FastConfForm::showSelectedWidget(QTreeWidgetItem* item, int column)
{
    //添加调试打印 需要包含头文件《QDebug》 + 设为控制台输出("调试"-->选择“属性”-->选怎“连接器”-->选怎“系统”-->“子系统”中选择[控制台]),方便调试
    qDebug() << "==";
    curTreeMenu2Val = item->type(); //new QTreeWidgetItem()的第三个参数

    
    QTreeWidgetItem *parent = item->parent();   //获取父节点
    if (NULL != parent) //注意:最顶端项是没有父节点的(根节点隐藏: 二级节点也无父节点)
    {
        curTreeMenu3Val = parent->indexOfChild(item); //item在父项中的节点行号(从0开始)
    }
    else 
    {
        //展开当前二级节点
        QTreeWidgetItem *firstChild = item->child(0);
        expandMenu2Item(item, firstChild, true);
    }
}

//节点展开的处理函数
void FastConfForm::expandMenu2Item(QTreeWidgetItem* itemMenu2, QTreeWidgetItem* itemMenu3, bool bIsSelect)
{
    itemMenu2->isExpanded() ? itemMenu2->setExpanded(false) : itemMenu2->setExpanded(true);

    if (NULL != itemMenu3)
    {
        selectMenu3Item(itemMenu3, bIsSelect);
        if (true == bIsSelect)
        {
            itemMenu2->setSelected(false);
        }
    }
}

//节点是否被选中处理
void FastConfForm::selectMenu3Item(QTreeWidgetItem* item, bool bIsSelect)
{
    item->setSelected(bIsSelect);
}

(3)FastConfForm.h主要函数和变量的声明

class FastConfForm : public QWidget
{
    Q_OBJECT

public:
    explicit FastConfForm(QWidget *parent = 0);
    ~FastConfForm();
    void setLeftIconAndText(QString strIconPath, QString strText, QTreeWidgetItem *treeWItem2);
    void expandMenu2Item(QTreeWidgetItem* itemMenu2, QTreeWidgetItem* itemMenu3, bool bIsSelect);
    void selectMenu3Item(QTreeWidgetItem* item, bool bIsSelect);

//槽函数声明方式
private slots:
    void showSelectedWidget(QTreeWidgetItem *, int);

private:
    Ui::FastConfForm *ui;

    //菜单层级
    int curTreeMenu2Val = 0;
    int curTreeMenu3Val = 0;
};

(4)其他相关逻辑,请自行实现

标签: qt ui 开发语言

本文转载自: https://blog.csdn.net/ainiyiwannianyu/article/details/130325620
版权归原作者 不想上班的小混混 所有, 如有侵权,请联系我们删除。

“QT使用QTreeWidget控件制作多级折叠菜单”的评论:

还没有评论