Qt 设置窗体透明
一、前言
在音频开发中，窗体多半为半透明、圆角窗体，如下为Qt 5.5 VS2013实现半透明方法总结。
二、半透明方法设置
1、窗体及子控件都设置为半透明
1）setWindowOpacity(0.8);//参数范围为0-1.0，通过QSlider控件做成透明度控制条
2）无边框设置
setWindowFlags(Qt::FramelessWindowHint);
3）窗体圆角设置
setAttribute(Qt::WA_TranslucentBackground);
通过paintEvent绘制窗体背景色与圆角
void Widget::paintEvent(QPaintEvent *event)
{
QPainter painter(this);
painter.setRenderHint(QPainter::Antialiasing); // 反锯齿;
painter.setBrush(QBrush(QColor("#616F76"))); //窗体背景色
painter.setPen(Qt::transparent);
QRect rect = this->rect(); //rect为绘制大小
rect.setWidth(rect.width() - 1);
rect.setHeight(rect.height() - 1);
painter.drawRoundedRect(rect, 15, 15); //15为圆角角度
//也可用QPainterPath 绘制代替 painter.drawRoundedRect(rect, 15, 15);
//QPainterPath painterPath;
//painterPath.addRoundedRect(rect, 15, 15);//15为圆角角度
//painter.drawPath(painterPath);
QWidget::paintEvent(event);
}
2、通过图片贴图，设置局部透明
1）窗体设置
setAttribute(Qt::WA_TranslucentBackground);//背景半透明属性设置
setWindowFlags(Qt::FramelessWindowHint);//无边框窗体设置
2）采用样式加载图片
ui->m_BgWidget->setStyleSheet("background-image:url(:/images/bg.png);");
注意：m_BgWidget为窗体对象的子窗体，不能直接设置QWidget
3）效果图如下（录制gif时刷新有点延时）
3、通过paintEvent重绘背景色透明度
1）窗体属性设置
setAttribute(Qt::WA_TranslucentBackground);//背景半透明属性设置
setWindowFlags(Qt::FramelessWindowHint);//无边框窗体设置
m_BgColor = QColor("#616F76");//默认背景色
m_BgColor.setAlphaF(0.8);
this->setContextMenuPolicy(Qt::CustomContextMenu);
connect(this, SIGNAL(customContextMenuRequested(const QPoint &)),
this, SLOT(showContextMenuSlot(const QPoint &)));//右击出现菜单
2）右击出现菜单
void Widget::showContextMenuSlot(const QPoint &pos)
{
QAction *act = NULL;
if(NULL == m_Menu)
{
m_Menu = new QMenu();//菜单
m_Actions.clear();//记录所有Action
act = m_Menu->addAction("1.0", this, SLOT(funcSlot()));
m_Actions << act;
act->setCheckable(true);
act = m_Menu->addAction("0.8", this, SLOT(funcSlot()));
m_Actions << act;
act->setCheckable(true); //设置可选中
act->setChecked(true); //设置被选中
act = m_Menu->addAction("0.5", this, SLOT(funcSlot()));
m_Actions << act;
act->setCheckable(true);
act = m_Menu->addAction("0.3", this, SLOT(funcSlot()));
m_Actions << act;
act->setCheckable(true);
act = m_Menu->addAction("0.1", this, SLOT(funcSlot()));
m_Actions << act;
act->setCheckable(true);
}
m_Menu->exec(mapToGlobal(pos));//弹出菜单
}
3）选择菜单Action，修改背景颜色透明度
void Widget::funcSlot()
{
QAction *act = qobject_cast<QAction *>(sender());//获取选中的Action
if(act)
{
double alpha = act->text().toDouble();
m_BgColor.setAlphaF(alpha);//背景色透明度修改
foreach(QAction *action, m_Actions)//去除其余选中，互斥
{
if(act != action)
action->setChecked(false);
}
this->update();//刷新界面
}
}
4）通过paintEvent重绘背景色
void Widget::paintEvent(QPaintEvent *event)
{
QPainter painter(this);
painter.setRenderHint(QPainter::Antialiasing); // 反锯齿;
painter.setBrush(QBrush(m_BgColor));//修改后的背景色
painter.setPen(Qt::transparent);
QRect rect = this->rect(); //rect为绘制窗体大小
rect.setWidth(rect.width() - 1);
rect.setHeight(rect.height() - 1);
painter.drawRoundedRect(rect, 15, 15);//15为圆角角度
//也可用QPainterPath 绘制代替 painter.drawRoundedRect(rect, 15, 15);
//QPainterPath painterPath;
//painterPath.addRoundedRect(rect, 15, 15);
//painter.drawPath(painterPath);
QWidget::paintEvent(event);
}
5）效果如下（录频有点重影）
4、通过paintEvent采用Clear模式绘图，实现局部透明
1）窗体属性设置
m_Margin = 60;//各个绘制图形与边框的距离
m_BgColor = QColor("#00BFFF");//窗体背景色
installEventFilter(this);//事件过滤器，用于鼠标按下后界面移动
setWindowFlags(Qt::FramelessWindowHint);//无边框窗体设置
setAttribute(Qt::WA_TranslucentBackground);//背景半透明属性设置
2）画笔属性设置
void Widget::paintEvent(QPaintEvent *)
{
QPainter painter(this);
painter.setPen(Qt::NoPen);
painter.setBrush(m_BgColor);
painter.drawRoundedRect(this->rect(), 15, 15);//设置整体窗体圆角为15°
painter.setCompositionMode(QPainter::CompositionMode_Clear);//设置Clear绘图模式
//绘制三角形
drawTriangle(&painter);
//绘制圆
drawCircular(&painter);
//绘制矩形
drawRectangle(&painter);
}
3）绘制三角形
void Widget::drawTriangle(QPainter *painter)
{
QPainterPath path;
int width = this->width() / 2;
int height = this->height() / 2;
//顶点
int topX = width / 2;
int topY = m_Margin;
//左下顶点
int leftX = m_Margin;
int leftY = height - m_Margin;
//右下顶点
int rightX = width - m_Margin;
int rightY = height - m_Margin;
path.moveTo(topX, topY);//起点
path.lineTo(leftX, leftY);//画线段1
path.lineTo(rightX, rightY);//画线段2
path.lineTo(topX, topY);//画线段3
painter->fillPath(path, QBrush(m_BgColor));//绘制三角形
}
4）绘制圆
void Widget::drawCircular(QPainter *painter)
{
int width = this->width() / 2;
int height = this->height() / 2;
int x = width + width / 2;//X向坐标
int y = height / 2; //Y向坐标
int r = width / 2 - m_Margin;
//第一个参数为中心点，r为x向、y向长度（不一致时可绘制椭圆）
painter->drawEllipse(QPoint(x, y), r, r);
}
5）绘制矩形
void Widget::drawRectangle(QPainter *painter)
{
int width = this->width() / 2;
int height = this->height() / 2;
int rectWidth = width - 2 * m_Margin;//矩形宽度
int rectHeight = height - 2 * m_Margin;//矩形高度
int rectX = width - rectWidth / 2;//矩形X向长度
int rectY = height + m_Margin;//矩形Y向长度
painter->drawRect(QRect(rectX, rectY, rectWidth, rectHeight));
}
6）运行效果
