我的Qt作品（3）基于QTabWidget和AdvancedDocking实现的Ribbon风格主界面【开源】-阿里云开发者社区

我的Qt作品（3）基于QTabWidget和AdvancedDocking实现的Ribbon风格主界面【开源】

2021-11-16 1849

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介： 我的Qt作品（3）基于QTabWidget和AdvancedDocking实现的Ribbon风格主界面【开源】

Qt 实现的Ribbon风格主界面，基本思路是定制QTabWidget，通过QSS（样式表）实现显示样式的调整。左边和底部的停靠窗口是采用第三方控件实现的。

即：用qtabwidget+qss可以实现ribbon。

1、先看看最终效果

停靠窗口允许鼠标拖动和停靠任意位置。

2、Ribbon菜单栏的实现思路，完全是采用原生的QTabWidget来开发的。把各个QToolButton按钮拖入。然后通过QSS样式表调出效果。

每个Tab添加栅格布局：

为了方便实现Ribbon菜单栏的伸缩，我们在TabWidget右上角添加按钮，

部分源码如下：

void RibbonTabWidget::initTabBar()
{
    m_tempShowTimer.setSingleShot(true);
    m_tempShowTimer.setInterval(QApplication::doubleClickInterval());
    this->setProperty("TTWidget", QVariant(true));
    this->tabBar()->setProperty("TTTab", QVariant(true));
    this->setUsesScrollButtons(true);
    QFrame *cornerFrame = new QFrame(this);
    cornerFrame->setProperty("TTFrame", QVariant(true));
    cornerFrame->setFrameShape(QFrame::NoFrame);
    cornerFrame->setLineWidth(0);
    cornerFrame->setContentsMargins(0, 0, 0, 0);
    cornerFrame->setSizePolicy(QSizePolicy::Preferred, QSizePolicy::Minimum);
    QHBoxLayout *cornerLayout = new QHBoxLayout(cornerFrame);
    cornerLayout->setMargin(0);
    cornerLayout->setContentsMargins(0, 0, 0, 0);
    cornerLayout->setSpacing(0);
    cornerLayout->setDirection(QBoxLayout::LeftToRight);
    cornerFrame->setLayout(cornerLayout);
    QAction *hideAction = new QAction(this);
    hideAction->setCheckable(true);
    hideAction->setIcon(QIcon(":/res/icons/ribbonMinimize.png"));
    QToolButton *hideButton = new QToolButton(this);
    hideButton->setObjectName("btnMenu");
    hideButton->setToolButtonStyle(Qt::ToolButtonIconOnly);
    hideButton->setDefaultAction(hideAction);
    hideButton->setAutoRaise(true);
    hideButton->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    cornerLayout->addWidget(hideButton);
    this->setCornerWidget(cornerFrame);
    QObject::connect(this, &QTabWidget::tabBarDoubleClicked, hideAction, &QAction::trigger);
    QObject::connect(this, &QTabWidget::tabBarClicked, this, &RibbonTabWidget::slotTabClicked);
    QObject::connect(this, &QTabWidget::currentChanged, this, &RibbonTabWidget::slotCurrentTabChanged);
    QObject::connect(hideAction, &QAction::triggered, this, [=]() {
        m_tempShowTimer.start();
        m_bIsMinimized = hideAction->isChecked();
        hideAction->setIcon(m_bIsMinimized ? QIcon(":/res/icons/ribbonMaximize.png") : QIcon(":/res/icons/ribbonMinimize.png"));
        hideAt(this->currentIndex());
        if (m_bIsMinimized)
            emit sigMinimized();
        else
            emit sigMaximized();
    });
    QObject::connect((QApplication *)QApplication::instance(), &QApplication::focusChanged, this, &RibbonTabWidget::slotFocusChanged);
}