贴张效果图: 
定制包括:
1. 周边阴影
2. 菜单项的元素(分割符, 控制ICON大小, 文字显示位置与颜色, 子菜单指示符)
菜单内的效果, 部分可以使用stylesheet实现, 但要做到这样的定制化, stylesheet是做不到的
下面介绍如何实现这些效果:
1. 实现阴影效果
默认的Qt菜单QMenu的效果是这样的
1) 首先需要去除下拉阴影(Drop shadow)
Qt的菜单是继承QWidget然后自绘的, dropshadow不属于自绘范围, 是windows popup类型窗口默认的样式, 无法通过正常途径去除
可以从源码中看到调用过程大概是这样:
qmenu::popup -> qwidget::show() -> QWidgetPrivate::show_helper() -> show_sys();
而这时候, 还未调用qmenu::paintevent
而且不能去除QMenu的Popup 属性, 因为QMenu的实现依赖Popup属性, 例如:
QMenuPrivate::activateAction中使用QApplication::activePopupWidget()函数
在windows平台下:
对窗口的handle操作, 可以去掉drop shadow. 参考http://*.com/questions/13776119/qt-menu-without-shaodw
menu.h
#ifndef MENU_H
#define MENU_H #include <QMenu> class Menu : public QMenu
{
Q_OBJECT
public:
explicit Menu(QWidget *parent = 0);
explicit Menu(const QString & title); protected:
virtual bool event(QEvent *event); signals: public slots: }; #endif // MENU_H
menu.cpp
#include "menu.h" Menu::Menu(QWidget *parent) :
QMenu(parent)
{ } Menu::Menu(const QString &title) :
QMenu(title)
{ } bool Menu::event(QEvent *event)
{
static bool class_amended = false;
if (event->type() == QEvent::WinIdChange)
{
HWND hwnd = reinterpret_cast<HWND>(winId());
if (class_amended == false)
{
class_amended = true;
DWORD class_style = ::GetClassLong(hwnd, GCL_STYLE);
class_style &= ~CS_DROPSHADOW;
::SetClassLong(hwnd, GCL_STYLE, class_style);
} }
return QWidget::event(event);
}
大概思路是: 在event中截获QEvent::WinIdChange事件, 然后获得窗口handle, 使用GetClassLong / SetClassLong 去除 CS_DROPSHADOW flags, 即可去除阴影
2) 使用dwm实现环绕阴影
优点：系统内置支持
缺点: 仅在vista以上并开启aero特效的情况, 使菜单有阴影环绕.
#pragma comment( lib, "dwmapi.lib" )
#include "dwmapi.h"
bool Menu::event(QEvent *event)
{
static bool class_amended = false;
if (event->type() == QEvent::WinIdChange)
{
HWND hwnd = reinterpret_cast<HWND>(winId());
if (class_amended == false)
{
class_amended = true;
DWORD class_style = ::GetClassLong(hwnd, GCL_STYLE);
class_style &= ~CS_DROPSHADOW;
::SetClassLong(hwnd, GCL_STYLE, class_style);
}
DWMNCRENDERINGPOLICY val = DWMNCRP_ENABLED;
::DwmSetWindowAttribute(hwnd, DWMWA_NCRENDERING_POLICY, &val, sizeof(DWMNCRENDERINGPOLICY)); // This will turn OFF the shadow
// MARGINS m = {0};
// This will turn ON the shadow
MARGINS m = {-};
HRESULT hr = ::DwmExtendFrameIntoClientArea(hwnd, &m);
if( SUCCEEDED(hr) )
{
//do more things
}
}
return QWidget::event(event);
}
简单地修改一下event的实现即可
3) 手动绘制阴影
1. CCustomMenu 继承 QMenu
void CCustomMenu::_Init()
{
// 必须设置popup, 因为QMenuPrivate::activateAction中使用QApplication::activePopupWidget()函数
this->setWindowFlags(Qt::Popup | Qt::FramelessWindowHint);
this->setAttribute(Qt::WA_TranslucentBackground);
this->setObjectName("CustomMenu"); // 以objectname 区分Qt内置菜单和CCustomMenu }
设置菜单背景透明
objectname是为了在绘制时区分不同风格的菜单(比如原生Qmenu与CCustomMenu或者其他CCustomMenu2等)
2. 实现CCustomStyle (参考Qt的源码 QFusionStyle)
CCustomStyle继承自QProxyStyle, Qt控件中的基础元素都是通过style控制, style比stylesheet更底层, 可以做到更精细的控制
/**@brief 定制菜单style
@author lwh
*/
class CCustomStyle : public QProxyStyle
{
Q_OBJECT public:
CCustomStyle(QStyle *style = ); void drawControl(ControlElement control, const QStyleOption *option,
QPainter *painter, const QWidget *widget) const; void drawPrimitive(PrimitiveElement element, const QStyleOption *option,
QPainter *painter, const QWidget *widget) const; int pixelMetric ( PixelMetric pm, const QStyleOption * opt, const QWidget * widget) const; private:
void _DrawMenuItem(const QStyleOption *option,
QPainter *painter, const QWidget *widget) const;
QPixmap _pixShadow ; //阴影图片
};
首先需要调整菜单项与边框的距离, 用于绘制阴影
在pixelMetric 中添加
if(pm == PM_MenuPanelWidth)
return ; // 调整边框宽度, 以绘制阴影
pixelMetric 中描述了像素公制可取的一些值,一个像素公制值是单个像素在样式中表现的尺寸.
然后再drawPrimitive实现阴影绘制
void CCustomStyle::drawPrimitive( PrimitiveElement element, const QStyleOption *option, QPainter *painter, const QWidget *widget ) const
{
if(element == PE_FrameMenu)
{
painter->save();
{
if(_pixShadow.isNull()
|| widget->objectName() != "CustomMenu") // fix bug: Qt的内置菜单显示不正常(如TextEdit右键菜单)
{
painter->restore();
return __super::drawPrimitive(element, option, painter, widget);
} QSize szThis = option->rect.size();
QPixmap pixShadowBg = _DrawNinePatch(szThis, _pixShadow);
painter->drawPixmap(option->rect, pixShadowBg);
}
painter->restore();
return;
}
__super::drawPrimitive(element, option, painter, widget);
}
QStyle::PE_FrameMenu Frame for popup windows/menus; see also QMenu.
注意: 绘制完直接return
_DrawNinePatch是以九宫格形式绘制, 
将这样一张小的阴影图绘制到窗口时, 如果直接拉伸, 会变得非常模糊.
而九宫格形式可以绘制出相对漂亮的背景, 这种技巧同样可以应用在其他控件上.
const QPixmap _DrawNinePatch( QSize szDst, const QPixmap &srcPix )
{
// 绘制背景图到, 以九宫格形式 QPixmap dstPix(szDst);
dstPix.fill(QColor(, , , ));
QPainter painter;
painter.begin(&dstPix); int nW = szDst.width();
int nH = szDst.height(); int nWBg = srcPix.width();
int nHBg = srcPix.height();
QPoint m_ptBgLT(, );
QPoint m_ptBgRB(, ); QPoint ptDstLT(m_ptBgLT.x(), m_ptBgLT.y());
QPoint ptDstRB(nW-(nWBg-m_ptBgRB.x()), nH-(nHBg-m_ptBgRB.y())); //LT
painter.drawPixmap(QRect(,,ptDstLT.x(), ptDstLT.y()), srcPix, QRect(,,m_ptBgLT.x(), m_ptBgLT.y()));
//MT
painter.drawPixmap(QRect(ptDstLT.x(),, ptDstRB.x()-ptDstLT.x(), ptDstLT.y()), srcPix, QRect(m_ptBgLT.x(),,m_ptBgRB.x()-m_ptBgLT.x(), m_ptBgLT.y()));
//RT
painter.drawPixmap(QRect(ptDstRB.x(),,nW-ptDstRB.x(), ptDstLT.y()), srcPix, QRect(m_ptBgRB.x(),,nWBg-m_ptBgRB.x(), m_ptBgLT.y()));
//LM
painter.drawPixmap(QRect(,ptDstLT.y(),ptDstLT.x(), ptDstRB.y()-ptDstLT.y()), srcPix, QRect(,m_ptBgLT.y(),m_ptBgLT.x(), m_ptBgRB.y()-m_ptBgLT.y()));
//MM
painter.drawPixmap(QRect(ptDstLT.x(),ptDstLT.y(),ptDstRB.x()-ptDstLT.x(), ptDstRB.y()-ptDstLT.y()), srcPix, QRect(m_ptBgLT.x(),m_ptBgLT.y(),m_ptBgRB.x()-m_ptBgLT.x(), m_ptBgRB.y()-m_ptBgLT.y()));
//RM
painter.drawPixmap(QRect(ptDstRB.x(),ptDstLT.y(), nW-ptDstRB.x(), ptDstRB.y()-ptDstLT.y()), srcPix, QRect(m_ptBgRB.x(),m_ptBgLT.y(), nWBg-m_ptBgRB.x(), m_ptBgRB.y()-m_ptBgLT.y()));
//LB
painter.drawPixmap(QRect(,ptDstRB.y(),ptDstLT.x(), nH-ptDstRB.y()), srcPix, QRect(,m_ptBgRB.y(),m_ptBgLT.x(), nHBg-m_ptBgRB.y()));
//MB
painter.drawPixmap(QRect(ptDstLT.x(),ptDstRB.y(),ptDstRB.x()-ptDstLT.x(), nH-ptDstRB.y()), srcPix, QRect(m_ptBgLT.x(),m_ptBgRB.y(),m_ptBgRB.x()-m_ptBgLT.x(), nHBg-m_ptBgRB.y()));
//RB
painter.drawPixmap(QRect(ptDstRB.x(),ptDstRB.y(),nW-ptDstRB.x(), nH-ptDstRB.y()), srcPix, QRect(m_ptBgRB.x(),m_ptBgRB.y(),nWBg-m_ptBgRB.x(), nHBg-m_ptBgRB.y())); painter.end();
return dstPix;
}
2. 绘制菜单项
1) 控制ICON大小
在pixelMetric中:
if (pm == QStyle::PM_SmallIconSize)
return ; //返回ICON的大小
2) 绘制菜单项内容
void CCustomStyle::drawControl( ControlElement control, const QStyleOption *option, QPainter *painter, const QWidget *widget ) const
{
switch(control )
{
case CE_MenuItem:
{
_DrawMenuItem(option, painter, widget);
return; // 直接返回, 否则会被super::drawcontrol覆盖
}
}
__super::drawControl(control, option, painter, widget);
}
void CCustomStyle::_DrawMenuItem(const QStyleOption *option, QPainter *painter, const QWidget *widget ) const
{
painter->save(); if (const QStyleOptionMenuItem *menuItem = qstyleoption_cast<const QStyleOptionMenuItem *>(option))
{
// 先绘制一层背景(否则在透明情况下, 会直接透过去);
painter->setPen(colItemBg);
painter->setBrush(colItemBg);
painter->drawRect(option->rect); if (menuItem->menuItemType == QStyleOptionMenuItem::Separator) {
int w = ;
if (!menuItem->text.isEmpty()) { // 绘制分隔符文字
painter->setFont(menuItem->font);
proxy()->drawItemText(painter, menuItem->rect.adjusted(, , -, ), Qt::AlignLeft | Qt::AlignVCenter,
menuItem->palette, menuItem->state & State_Enabled, menuItem->text,
QPalette::Text);
w = menuItem->fontMetrics.width(menuItem->text) + ;
}
painter->setPen(colSeparator);
bool reverse = menuItem->direction == Qt::RightToLeft;
painter->drawLine(menuItem->rect.left() + + (reverse ? : w), menuItem->rect.center().y(),
menuItem->rect.right() - - (reverse ? w : ), menuItem->rect.center().y());
painter->restore();
return;
}
bool selected = menuItem->state & State_Selected && menuItem->state & State_Enabled;
if (selected) {
QRect r = option->rect;
painter->fillRect(r, colItemHighlight);
}
bool checkable = menuItem->checkType != QStyleOptionMenuItem::NotCheckable;
bool checked = menuItem->checked;
bool sunken = menuItem->state & State_Sunken;
bool enabled = menuItem->state & State_Enabled; bool ignoreCheckMark = false;
int checkcol = qMax(menuItem->maxIconWidth, ); if (qobject_cast<const QComboBox*>(widget))
ignoreCheckMark = true; //ignore the checkmarks provided by the QComboMenuDelegate if (!ignoreCheckMark) {
// Check
QRect checkRect(option->rect.left() + , option->rect.center().y() - , , );
checkRect = visualRect(menuItem->direction, menuItem->rect, checkRect);
if (checkable) {
if (menuItem->checkType & QStyleOptionMenuItem::Exclusive) {
// Radio button 未实现
if (checked || sunken) {
/* painter->setRenderHint(QPainter::Antialiasing);
painter->setPen(Qt::NoPen); QPalette::ColorRole textRole = !enabled ? QPalette::Text:
selected ? QPalette::HighlightedText : QPalette::ButtonText;
painter->setBrush(option->palette.brush( option->palette.currentColorGroup(), textRole));
painter->drawEllipse(checkRect.adjusted(4, 4, -4, -4));
*/
}
} else {
// Check box
if (menuItem->icon.isNull()) {
QStyleOptionButton box;
box.QStyleOption::operator=(*option);
box.rect = checkRect;
if (checked)
box.state |= State_On;
proxy()->drawPrimitive(PE_IndicatorCheckBox, &box, painter, widget); }
}
}
} else { //ignore checkmark
if (menuItem->icon.isNull())
checkcol = ;
else
checkcol = menuItem->maxIconWidth;
} // Text and icon, ripped from windows style
bool dis = !(menuItem->state & State_Enabled);
bool act = menuItem->state & State_Selected;
const QStyleOption *opt = option;
const QStyleOptionMenuItem *menuitem = menuItem; QPainter *p = painter;
QRect vCheckRect = visualRect(opt->direction, menuitem->rect,
QRect(menuitem->rect.x() + , menuitem->rect.y(),
checkcol, menuitem->rect.height()));
if (!menuItem->icon.isNull()) {
QIcon::Mode mode = dis ? QIcon::Disabled : QIcon::Normal;
if (act && !dis)
mode = QIcon::Active;
QPixmap pixmap; int smallIconSize = proxy()->pixelMetric(PM_SmallIconSize, option, widget);
QSize iconSize(smallIconSize, smallIconSize);
if (const QComboBox *combo = qobject_cast<const QComboBox*>(widget))
iconSize = combo->iconSize();
if (checked)
pixmap = menuItem->icon.pixmap(iconSize, mode, QIcon::On);
else
pixmap = menuItem->icon.pixmap(iconSize, mode); int pixw = pixmap.width();
int pixh = pixmap.height(); QRect pmr(, , pixw, pixh);
pmr.moveCenter(vCheckRect.center());
painter->setPen(colText);//menuItem->palette.text().color()
if (checkable && checked) {
QStyleOption opt = *option;
if (act) {
QColor activeColor = mergedColors(
colItemBg, //option->palette.background().color(),
colItemHighlight // option->palette.highlight().color());
);
opt.palette.setBrush(QPalette::Button, activeColor);
}
opt.state |= State_Sunken;
opt.rect = vCheckRect;
proxy()->drawPrimitive(PE_PanelButtonCommand, &opt, painter, widget);
}
painter->drawPixmap(pmr.topLeft(), pixmap);
}
if (selected) {
painter->setPen(colText);//menuItem->palette.highlightedText().color()
} else {
painter->setPen(colText); //menuItem->palette.text().color()
}
int x, y, w, h;
menuitem->rect.getRect(&x, &y, &w, &h);
int tab = menuitem->tabWidth;
QColor discol;
if (dis) {
discol = colDisText; //menuitem->palette.text().color()
p->setPen(discol);
}
int xm = windowsItemFrame + checkcol + windowsItemHMargin + ;
int xpos = menuitem->rect.x() + xm; QRect textRect(xpos, y + windowsItemVMargin, w - xm - windowsRightBorder - tab + , h - * windowsItemVMargin);
QRect vTextRect = visualRect(opt->direction, menuitem->rect, textRect);
QString s = menuitem->text;
if (!s.isEmpty()) { // draw text
p->save();
int t = s.indexOf(QLatin1Char('\t'));
int text_flags = Qt::AlignVCenter | Qt::TextShowMnemonic | Qt::TextDontClip | Qt::TextSingleLine;
if (!__super::styleHint(SH_UnderlineShortcut, menuitem, widget))
text_flags |= Qt::TextHideMnemonic;
text_flags |= Qt::AlignLeft;
if (t >= ) {
QRect vShortcutRect = visualRect(opt->direction, menuitem->rect,
QRect(textRect.topRight(), QPoint(menuitem->rect.right(), textRect.bottom())));
if (dis && !act && proxy()->styleHint(SH_EtchDisabledText, option, widget)) {
p->setPen(colText);//menuitem->palette.light().color()
p->drawText(vShortcutRect.adjusted(, , , ), text_flags, s.mid(t + ));
p->setPen(discol);
}
p->drawText(vShortcutRect, text_flags, s.mid(t + ));
s = s.left(t);
}
QFont font = menuitem->font;
// font may not have any "hard" flags set. We override
// the point size so that when it is resolved against the device, this font will win.
// This is mainly to handle cases where someone sets the font on the window
// and then the combo inherits it and passes it onward. At that point the resolve mask
// is very, very weak. This makes it stonger.
font.setPointSizeF(QFontInfo(menuItem->font).pointSizeF()); if (menuitem->menuItemType == QStyleOptionMenuItem::DefaultItem)
font.setBold(true); p->setFont(font);
if (dis && !act && proxy()->styleHint(SH_EtchDisabledText, option, widget)) {
p->setPen(menuitem->palette.light().color());
p->drawText(vTextRect.adjusted(, , , ), text_flags, s.left(t));
p->setPen(discol);
}
p->drawText(vTextRect, text_flags, s.left(t));
p->restore();
} // Arrow 绘制子菜单指示符
if (menuItem->menuItemType == QStyleOptionMenuItem::SubMenu) {// draw sub menu arrow
int dim = (menuItem->rect.height() - ) / ;
PrimitiveElement arrow;
arrow = option->direction == Qt::RightToLeft ? PE_IndicatorArrowLeft : PE_IndicatorArrowRight;
int xpos = menuItem->rect.left() + menuItem->rect.width() - - dim;
QRect vSubMenuRect = visualRect(option->direction, menuItem->rect,
QRect(xpos, menuItem->rect.top() + menuItem->rect.height() / - dim / , dim, dim));
QStyleOptionMenuItem newMI = *menuItem;
newMI.rect = vSubMenuRect;
newMI.state = !enabled ? State_None : State_Enabled;
if (selected)
newMI.palette.setColor(QPalette::ButtonText, // 此处futionstyle 有误, QPalette::Foreground改为ButtonText
colIndicatorArrow);//newMI.palette.highlightedText().color()
else
newMI.palette.setColor(QPalette::ButtonText,
colIndicatorArrow); proxy()->drawPrimitive(arrow, &newMI, painter, widget);
}
}
painter->restore();
}
_DrawMenuItem
_DrawMenuItem的代码较长, 但比较简单, 都是一些条件判断加上绘图语句, 需要自己修改pallete的颜色
值得注意的是: 在透明情况下, 应先绘制一层menu item 的背景, 否则会直接透过去
3) 最后还要重写一下QMenu的addMenu
以使子菜单也生效
QAction * CCustomMenu::addMenu( CCustomMenu *menu )
{
return QMenu::addMenu(menu);
} CCustomMenu * CCustomMenu::addMenu( const QString &title )
{
CCustomMenu *menu = new CCustomMenu(title, this);
addAction(menu->menuAction());
return menu;
} CCustomMenu * CCustomMenu::addMenu( const QIcon &icon, const QString &title )
{
CCustomMenu *menu = new CCustomMenu(title, this);
menu->setIcon(icon);
addAction(menu->menuAction());
return menu;
}
完整的工程代码在此, https://bitbucket.org/lingdhox/misc/src 或者**** http://download.****.net/detail/l470080245/6731989
编译需要VS2010+Qt5.
PS:
关于QMenu如何处理菜单消失, 参考我的另一篇blog Qt中QMenu的菜单关闭处理方法