[干货4]Qt中用QSS样式化菜单(Qmenu&QAction

VincentKeh 2015-09-03 11:25:37
本文转自我的博客http://www.hookr.cn/qss-for-qt-style-menu-qmenuqaction.html 欢迎大家多多访问交流
项目是一款平板上的软件,菜单放在了右下角,没有用qss设置样式之前,菜单非常的小,菜单项也都挤在了一块,设置样式后效果非常好。

先上一张效果图吧,可以看到QSS样式化后的菜单的特点:上下左右间距增大了,调整到很是的大小,菜单项目中间有一条间隔的横线区分各个菜单项,

菜单中的QAction鼠标经过时菜单背景会变成蓝色等。



实现这种效果如果在Qt中用C++语句实现可能有些困难,我也没有这么做过,后来参考了Qt帮助文档的一些QSS的例子做出了这种效果。

具体实现做法

将一下样式添加到Qt的QSS样式表文件中,要根据你的实际情况调整相应的长宽等值,具体的参数说明下面代码注释中已经说明。如果你想对QSS有个好的了解建议学习一些简单的CSS语法,QSS就是借鉴了CSS,但是比它简单多了,之后你会发现QSS非常简单,而且非常便捷好用,为程序美化开发省下很多时间。
/*Qmenu Style Sheets*/
QMenu {
background-color: white; /* sets background of the menu 设置整个菜单区域的背景色,我用的是白色:white*/
border: 1px solid white;/*整个菜单区域的边框粗细、样式、颜色*/
}

QMenu::item {
/* sets background of menu item. set this to something non-transparent
if you want menu color and menu item color to be different */
background-color: transparent;
padding:8px 32px;/*设置菜单项文字上下和左右的内边距,效果就是菜单中的条目左右上下有了间隔*/
margin:0px 8px;/*设置菜单项的外边距*/
border-bottom:1px solid #DBDBDB;/*为菜单项之间添加横线间隔*/
}

QMenu::item:selected { /* when user selects item using mouse or keyboard */
background-color: #2dabf9;/*这一句是设置菜单项鼠标经过选中的样式*/
}
...全文
10369 6 打赏 收藏 转发到动态 举报
写回复
用AI写文章
6 条回复
切换为时间正序
请发表友善的回复…
发表回复
为你而回忆 2019-09-27
  • 打赏
  • 举报
回复
非常感谢,大佬喝啤酒
To be only 1 2019-09-19
  • 打赏
  • 举报
回复
灰常感谢哦~
allen_00 2016-12-16
  • 打赏
  • 举报
回复
以前用类写过一个custommenu 那个麻烦啊
醉疏雨 2016-12-13
  • 打赏
  • 举报
回复
加入每个QAction都有一个图标,怎么样才能让鼠标滑过的时候,图片高亮显示,,请教
hidxl 2016-07-13
  • 打赏
  • 举报
回复
界面美化有用,qml也牛逼。
yeqingbo2010 2016-07-05
  • 打赏
  • 举报
回复
写的很不错,赞一个!

16,235

社区成员

发帖
与我相关
我的任务
社区描述
Qt 是一个跨平台应用程序框架。通过使用 Qt,您可以一次性开发应用程序和用户界面,然后将其部署到多个桌面和嵌入式操作系统,而无需重复编写源代码。
社区管理员
  • Qt
  • 亭台六七座
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧