2025年QMenu常规使用和样式设置——Qt

科技前沿 • 2025-03-27 22:09 • 阅读 40

大家好，我是讯享网，很高兴认识大家。

前言

现在的项目需要设置菜单的样式，菜单也不说有多复杂，很简洁的一个效果。但是我用了一个多小时才试出想要的效果。虽说我样式写的不多，只会一些简单的，但是这个打击还是有的。我想后续我要好好学学风格样式这块了。

使用和样式设置

使用

菜单的使用很简单，看一样就知道，我觉得需要注意的是菜单项需要显示位置的设置：位置是全屏的坐标点，所以注意坐标的转换。

void MainWidget::initMoreFuncMenu() { m_pMoreMenu=new QMenu(this); //m_pMoreMenu->setWindowFlag(Qt::NoDropShadowWindowHint);//去掉菜单的阴影 m_pCollectAct=new QAction("收藏"); m_pInviteAct=new QAction("邀请"); m_pSetAct=new QAction("设置"); m_pOpinionAct=new QAction("意见反馈"); m_pAboutAct=new QAction("关于我们"); m_pMoreMenu->addAction(m_pCollectAct); m_pMoreMenu->addAction(m_pInviteAct); m_pMoreMenu->addAction(m_pSetAct); m_pMoreMenu->addAction(m_pOpinionAct); m_pMoreMenu->addAction(m_pAboutAct); connect(ui->moreButton,&QToolButton::clicked,this,&MainWidget::moreFunc); connect(m_pCollectAct,&QAction::triggered,this,&MainWidget::moreFunc); connect(m_pInviteAct,&QAction::triggered,this,&MainWidget::moreFunc); connect(m_pSetAct,&QAction::triggered,this,&MainWidget::moreFunc); connect(m_pOpinionAct,&QAction::triggered,this,&MainWidget::moreFunc); connect(m_pAboutAct,&QAction::triggered,this,&MainWidget::moreFunc); }

讯享网

讯享网void MainWidget::moreFunc() { QWidget *pWindow = this->window(); int x=pWindow->geometry().x()+50; int y=pWindow->geometry().y()+pWindow->height()-170; QPoint pos(x,y); m_pMoreMenu->exec(pos); }

样式设置

难点：怎么设置菜单QMenu的大小，怎么设置菜单项的大小？

按常规的qss来说，大小设置应该是这样的：

QMenu{ width:110px; height:170px; } QMenu::item{ width:110px; height:34px; }

但是，这个是错误的，你可以尝试一下，一丁点效果也没有。

后来查资料陆续看到说，这个菜单QMenu大小是由菜单项大小组成的，那我只设置项大小是不是就可以了？当然，这个答案也是否认的，不然我也不会用一个小时。揭晓答案：他很原始，他的大小是由margin、border、padding 和content组成的，是不是很眼熟，盒模型。（我偷了一张css的盒模型图）

讯享网

我不知道为什么这个没有直接设置的方法或者我的没效果。最终我还是用最原始方法拼成我想要的大小：

height=margin-top+margin-bottom+border-top+border-bottom+padding-top+padding-bottom+font-szie

然后我想要的效果用不到外边距（margin）和边框(border),所以高度就由字体大小（font-size）和内边距（padding）决定了。

讯享网QMenu{ background:rgba(255,255,255,1); border:none; } QMenu::item{ padding:11px 32px; color:rgba(51,51,51,1); font-size:12px; } QMenu::item:hover{ background-color:#409CE1; } QMenu::item:selected{ background-color:#409CE1; }

效果图如下：

结束语

普通的菜单项的使用和样式设置一般就这样，如果需要菜单项包含其他控件，比如音乐播放器的开关按钮等，则需要用到QWidgetAction,这个在下一篇文章中写。

2025年QMenu常规使用和样式设置——Qt

前言

使用和样式设置

使用

样式设置

结束语

相关推荐