这是Qt（最低要求Qt5，支持C++11的编译器）下一个轻量级的Ribbon控件(Office样式UI),界面截图：
编译方法
使用Qt Creator直接打开SARibbon.pro，并编译即可，会编译出SARibbonBar库和一个（目前只有一个例子）例子，lib和例子的目录位于bin_qt{Qt版本}_{debug/release}_{32/64}目录下
在debug模式编译的库后面会加上d以作区别
使用方法
可以把编译好的整个目录移动到需要的工程目录下，然后在项目的pro文件中,include SARibbonBar.pri即可，示例如下：
include($$PWD/SARibbonBar/SARibbon/SARibbonBar.pri)
快速开始
要使用SARibbon，需要对QMainWindow替换为SARibbonMainWindow，SARibbonMainWindow修改了QMainWindow对menubar的渲染方式
示例代码如下:
1 #include "SARibbonMainWindow.h"
2 class MainWindow : public SARibbonMainWindow
3 {
4 Q_OBJECT
5 public:
6 MainWindow(QWidget* par = nullptr);
7 ...
8 }
当然SARibbonMainWindow也支持普通模式的渲染，其构造函数为：
SARibbonMainWindow(QWidget *parent = nullptr, bool useRibbon = true);
第二个参数如果设置为false，将会使用普通的菜单工具栏模式，预留这个接口是为了一些项目需要能在ribbon和经典菜单工具栏切换的场景设计的，SARibbon不支持热切换，如果需要切换，用户可以设置一个配置文件或者注册表，在下次重启时给第二个参数传入false即可进入到经典菜单工具栏模式
简单的理解，Ribbon是把菜单栏和工具栏合并了，并通过一个tab控件进行展示，SARibbon在设计时参考了MFC Ribbon接口的命名风格，标签页称之为Category(种类)，每个Category下面有多个pannel（面板），面板下面才是具体的toolbutton，其层次结构如下图所示，这些命名参考了MFC的ribbon界面类
Category 类别，代表一个标签所呈现的内容，对应SARibbonCategory
Context Category 上下文类别，这个是一种特殊的类别，它正常不显示，需要基于上下文判断是否应该显示，最常用的就是word中插入图片后，会有图片修改相关的标签出现，如果没选中图片，这个标签就消失，这个就是上下文类别，对应SARibbonContextCategory
Pannel 面板，这个是一组菜单的集合，office里面板都会有个面板标题，显示在面板最下方，面板之后就是工具栏按钮（Action）
Application Button 应用按钮，标签栏最左边的按钮（word就是对应文件按钮），这个按钮会触发一些特殊的页面或菜单，对应SARibbonApplicationButton,可以隐藏
Quick Access Bar 快速响应栏，位于最顶部的一个简单工具栏，用于放置一些常用的action，对应SARibbonQuickAccessBar
Gallery 预览控件,这是Ribbon最吸引眼球的控件，用直观的图像把功能显示出来，甚至有些会根据上下文进行实时渲染，典型的就是word开始标签下的样式选择，对应SARibbonGallery
简单的层次示意如下图所示：
创建Category和Pannel
创建ribbon过程先创建类别，再创建面板，最后创建对应的toolbutton（action）
1 //添加主标签页 - 通过addCategoryPage工厂函数添加
2 SARibbonCategory* categoryMain = ribbon->addCategoryPage(tr("Main"));
3 //使用addPannel函数来创建SARibbonPannel，效果和new SARibbonPannel再addPannel一样
4 SARibbonPannel* pannel1 = categoryMain->addPannel(("Panel 1"));
5 QAction* actSave = new QAction(this);
6 actSave->setText("save");
7 actSave->setIcon(QIcon(":/icon/icon/save.svg"));
8 actSave->setObjectName("actSave");
9 actSave->setShortcut(QKeySequence(QLatin1String("Ctrl+S")));
10 pannel1->addLargeAction(actSave);
上面的操作添加了一个按钮，效果如下图所示：
通过addLargeAction、addMediumAction、addSmallAction可以组合出不同的布局样式。具体可见./src/example/MainWindowExample/mainwindow.cpp
222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222
Qt下的Ribbon控件——SARibbon
置顶
尘中远
于 2020-08-30 23:20:45 发布
阅读量1.3w
收藏 93
点赞数 22
分类专栏： qt 文章标签： qt ribbon office样式 Ribbon界面 Qt Ribbon
版权
GitCode 开源社区
文章已被社区收录
加入社区
qt
专栏收录该内容
33 篇文章102 订阅
订阅专栏
文章列表
SARibbon介绍、编译教程
SARibbon入门篇-ribbon名词及布局方式教程
SARibbonBar是Qt的开源Ribbon控件，代码托管于github和gitee
SARibbon介绍[github],[gitee]
SARibbon布局入门[github],[gitee]
简介
这是Qt（最低要求Qt5，支持C++11的编译器）下一个轻量级的Ribbon控件(Office样式UI),界面截图：
MIT协议，欢迎大家使用并提出意见
gitee(码云) - https://gitee.com/czyt1988/SARibbon
github - https://github.com/czyt1988/SARibbon
它支持4种目前常见的ribbon样式在线切换
包括2种office模式，office模式是最常见的ribbon模式了，就是我们经常看到的word模式，office模式的tab和标题栏占用位置较多。
另两种参考wps设计的wps模式，wps模式是office模式的改良版，它为了减小ribbon的高度，把标签和标题栏设置在一起
office模式和wps模式都支持两行和3行设计，满足不同界面需求。
编译方法
使用Qt Creator直接打开SARibbonBar.pro，并编译即可，会编译出SARibbonBar库和一个（目前只有一个例子）例子，lib和例子的目录位于bin目录下
使用方法
可以把编译好的整个目录移动到需要的工程目录下，然后在项目的pro文件中,include SARibbonBar.pri即可，示例如下：
include($$PWD/SARibbonBar/SARibbon/SARibbonBar.pri)
1
更多截图
支持最小化模式，ribbon只显示标签（默认双击标签会进行切换）
支持quickAccessBar（word快速菜单），在wps模式和office模式下会有不同的显示效果
支持4种不同的ribbon button，普通按钮，延迟弹出菜单按钮，菜单按钮，action菜单按钮（action菜单按钮是此ribbon控件最主要解决的问题之一）
支持qss对ribbon进行设置
题外
这个Ribbon主要靠QSS实现而不是重写样式(QStyle)，主要是重写样式工作量巨大，一些QSS无法实现的，重写了界面，如RibbonToolButton，
目前基本的布局和ToolButton功能以及完成，简单的RibbonGallery控件也有初步实现，后续还需对Gallery进行完善
更多界面截图可看：
github - https://github.com/czyt1988/sa
gitee - https://gitee.com/czyt1988/SA
SARibbon项目是SA项目的子项
具体Ribbon的生成代码可见：
https://github.com/czyt1988/sa/blob/master/src/signA/MainWindowPrivate.cpp
截图：
这个ribbon主要通过QTabbar和QStackWidget实现，按照微软MFCRibbbon的接口命名方式来写，主要通过qss来控制，默认qss在资源文件中，理论上能满足各种样式，可以实现样式的切换(换肤)
若有空会把这个SARibbon和SA一起打包讲讲如何开发，其中遇到的一些坑啊和注意的问题。
计划及进度
计划
添加自定义窗口，支撑自定义，并能生成xml/json等配置文件
context category 的背景添加一个底层窗口，使得其支撑自定义
可以设置title的背景，类似office未注册时的显示
已知bug
在ubuntu下会有文字换行显示不全问题
已解决
【解决】在缩小模式下tabbar无法响应鼠标经过，导致鼠标经过无法绘制
由于stacked widget在缩小模式下时popup，弹出后即阻断了消息，需要主动给tabbar发送一个hover事件，高速tabbar鼠标已经移开
【解决】pannel在内容过多时，需要针对性的重新计算整个Category，以便得到最优的布局尺寸
【解决】pannel布局过于紧凑
【解决】小按钮的位置过于紧凑
【解决】分割线显示异常
【解决】在非最大化模式，pannel变为缩小时，点击不弹出stacked
其他
感谢FastCAE项目使用了本控件，并找到了许多bug和建议，FastCAE国产CAE软件集成开发平台，免费开源，是面向求解器开发者提供CAE软件界面与通用功能模块快速研发集成框架，其开源仓库（github）:https://github.com/DISOGitHub/FastCAE，gitee:https://gitee.com/DISOGitee/FastCAE，官网见:http://www.fastcae.com/product.html
文章知识点与官方知识档案匹配，可进一步学习相关知识
云原生入门技能树首页概览19493 人正在系统学习中
————————————————
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
原文链接：https://blog.csdn.net/czyt1988/article/details/108312948
1643
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
