Qt实现跟随侧边栏的按钮控制侧边栏的展开与折叠-Toy模板网

这篇具有很好参考价值的文章主要介绍了Qt实现跟随侧边栏的按钮控制侧边栏的展开与折叠。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

效果展示：右侧工具栏宽度是固定的

qt 伸缩侧边栏,QT学习,qt,开发语言,ui,c++

方式概述：

一、界面布局方式如图所示：SideToolWidget主体采用水平布局，包含两个QWidget，左侧为用于信息显示的leftWidget,右侧为容纳展开折叠按钮窗口btnWidget与云台工具显示窗口ptzWidget的containerWidget,内部窗体的具体布局如图所示；
qt 伸缩侧边栏,QT学习,qt,开发语言,ui,c++
二、实现方式描述，按钮窗口btnWidget与云台工具显示窗口ptzWidget均采用宽度固定，高度自由的布局策略，容器窗口可采取宽度固定或不固定，高度自由，宽度若固定，应为按钮窗口btnWidget与云台工具显示窗口ptzWidget的宽度之和；若宽度不固定，应在布局的左侧放置一个水平弹簧用于将按钮窗口在pztWidget隐藏时挤压至最右侧；记录ptzWidget的宽度，展开折叠按钮showOrHideBtn槽函数中判断用户点击的状态，若隐藏，则containerWidget总宽度与btnWidget相同，若显示，则containerWidget宽度为btnWidget与pztWidget之和；

完整代码：其中资源图片也可自己贴图替换

头文件

#ifndef SIDETOOLWIDGET_H
#define SIDETOOLWIDGET_H

#include <QWidget>
#include <QList>

QT_BEGIN_NAMESPACE
namespace Ui { class SideToolWidget; }
QT_END_NAMESPACE

class SideToolWidget : public QWidget
{
    Q_OBJECT

public:
    SideToolWidget(QWidget *parent = nullptr);
    ~SideToolWidget();
    void initPtzStyle();
private slots:
    void on_showOrHideBtn_clicked();

private:
    Ui::SideToolWidget *ui;
    bool unfold;
    int changeWidth;
};
#endif // SIDETOOLWIDGET_H

源文件


#include "sidetoolwidget.h"
#include "ui_sidetoolwidget.h"
#include <QIcon>

const QString btnStyle = "QPushButton{border-radius:18px; background-position:center; background-color:rgba(245,245,245,250)}"\
                         "QPushButton:pressed{background-color:rgba(255,255,255,255);border-style:inset;}";

SideToolWidget::SideToolWidget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::SideToolWidget)
    , unfold(true)
{
    ui->setupUi(this);
    changeWidth = ui->ptzWidget->width();
    this->setWindowTitle("折叠窗口");
    initPtzStyle();
}

SideToolWidget::~SideToolWidget()
{
    delete ui;
}

void SideToolWidget::initPtzStyle()
{
    // ptzWidget中所有按钮设置统一风格
    QList<QPushButton*> btnList = ui->ptzWidget->findChildren<QPushButton *>();
    for (int i = 0; i < btnList.count(); i++) {
        btnList.at(i)->setStyleSheet(btnStyle);
        btnList.at(i)->setIconSize(QSize(20,20));
    }

    ui->topButton->setIcon(QIcon(":/prefix/image/PTZ_Top.ico"));
    ui->rightTopButton->setIcon(QIcon(":/prefix/image/PTZ_TopRight.ico"));
    ui->rightButton->setIcon(QIcon(":/prefix/image/PTZ_Right.ico"));
    ui->rightBottomButton->setIcon(QIcon(":/prefix/image/PTZ_BottomRight.ico"));
    ui->bottomButton->setIcon(QIcon(":/prefix/image/PTZ_Bottom.ico"));
    ui->bottomLeftButton->setIcon(QIcon(":/prefix/image/PTZ_BottomLeft.ico"));
    ui->leftButton->setIcon(QIcon(":/prefix/image/PTZ_Left.ico"));
    ui->topLeftButton->setIcon(QIcon(":/prefix/image/PTZ_TopLeft.ico"));
    ui->resetButton->setIcon(QIcon(":/prefix/image/PTZ_Recover.ico"));

    ui->zoomInButton->setStyleSheet(btnStyle);
    ui->zoomOutButton->setStyleSheet(btnStyle);
    ui->focusMinButton->setStyleSheet(btnStyle);
    ui->focusMaxButton->setStyleSheet(btnStyle);
    ui->flightOutButton->setStyleSheet(btnStyle);
    ui->flightInButton->setStyleSheet(btnStyle);

    ui->singleCallBtn_1->setIcon(QIcon(":/prefix/image/SingleCall.ico"));
    ui->singleDeleteBtn_1->setIcon(QIcon(":/prefix/image/SingleDelete.ico"));
    ui->singleCallBtn_2->setIcon(QIcon(":/prefix/image/SingleCall.ico"));
    ui->singleDeleteBtn_2->setIcon(QIcon(":/prefix/image/SingleDelete.ico"));
    ui->singleCallBtn_3->setIcon(QIcon(":/prefix/image/SingleCall.ico"));
    ui->singleDeleteBtn_3->setIcon(QIcon(":/prefix/image/SingleDelete.ico"));
    ui->singleCallBtn_4->setIcon(QIcon(":/prefix/image/SingleCall.ico"));
    ui->singleDeleteBtn_4->setIcon(QIcon(":/prefix/image/SingleDelete.ico"));
    ui->singleCallBtn_5->setIcon(QIcon(":/prefix/image/SingleCall.ico"));
    ui->singleDeleteBtn_5->setIcon(QIcon(":/prefix/image/SingleDelete.ico"));
}

void SideToolWidget::on_showOrHideBtn_clicked()
{
    if (unfold) {
        ui->ptzWidget->hide();
        ui->showOrHideBtn->setText("<<");
        ui->containerWdget->setFixedWidth(ui->btnWidget->width()); 
        unfold = false;
    } else {
        ui->ptzWidget->show();
        ui->showOrHideBtn->setText(">>");
        ui->containerWdget->setFixedWidth(ui->btnWidget->width() + changeWidth);
        unfold = true;
    }
}