• 21943阅读
  • 9回复

[QSS美化实例3] Qt中用QSS样式化菜单(Qmenu&QAction) [复制链接]

上一主题 下一主题
离线chinaboyone
 

只看楼主 倒序阅读 楼主  发表于: 2015-09-04
原文出自我的博客 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非常简单,而且非常便捷好用,为程序美化开发省下很多时间。
  1. /*Qmenu Style Sheets*/
  2. QMenu {
  3.      background-color: white; /* sets background of the menu 设置整个菜单区域的背景色,我用的是白色:white*/
  4.      border: 1px solid white;/*整个菜单区域的边框粗细、样式、颜色*/
  5. }
  6. QMenu::item {
  7.      /* sets background of menu item. set this to something non-transparent
  8.          if you want menu color and menu item color to be different */
  9.      background-color: transparent;
  10.      padding:8px 32px;/*设置菜单项文字上下和左右的内边距,效果就是菜单中的条目左右上下有了间隔*/
  11.      margin:0px 8px;/*设置菜单项的外边距*/
  12.      border-bottom:1px solid #DBDBDB;/*为菜单项之间添加横线间隔*/
  13. }
  14. QMenu::item:selected { /* when user selects item using mouse or keyboard */
  15.      background-color: #2dabf9;/*这一句是设置菜单项鼠标经过选中的样式*/
  16. }
离线toby520

只看该作者 1楼 发表于: 2015-09-06
好文,多分享分享
QtQML多多指教开发社区 http://qtclub.heilqt.com
将QtCoding进行到底
关注移动互联网,关注金融
开发跨平台客户端,服务于金融行业
专业定制界面
群号:312125701   373955953(qml控件定做)
离线mscheng

只看该作者 2楼 发表于: 2015-09-08
好文啊,谢谢分享
离线winnel

只看该作者 3楼 发表于: 2015-09-08
多谢分享
离线chinaboyone

只看该作者 4楼 发表于: 2015-09-08
回 toby520 的帖子
toby520:好文,多分享分享 [表情]  (2015-09-06 09:02) 

哇版主回帖啊,激动,还以为会被删帖呢,呵呵!
离线chinaboyone

只看该作者 5楼 发表于: 2015-09-08
回 winnel 的帖子
winnel:多谢分享[表情]  (2015-09-08 11:55) 

我也是新手,多多交流!
离线chinaboyone

只看该作者 6楼 发表于: 2015-09-08
回 mscheng 的帖子
mscheng:好文啊,谢谢分享 (2015-09-08 09:57) 

互相交流,互相学习,呵呵
离线zhuifengwy

只看该作者 7楼 发表于: 2015-10-15
好文,多分享分享
离线z609932088

只看该作者 8楼 发表于: 2015-11-03
多谢楼主分享哈,长知识了
有阳光的地方就是青春
离线atspace

只看该作者 9楼 发表于: 2015-11-25
谢谢分享,确实很有用,不过QMenu设置貌似不起作用呢
快速回复
限100 字节
 
上一个 下一个