Qt之透明提示框
简述
经常使用企鹅的小伙伴一定对登录失败的提示框很熟悉,主要涉及窗口透明并添加图标、提示信息、关闭按钮的显示等。
我们可以利用QWidget创建一个提示框,然后通过样式设置我们想要的效果。
效果
源码
QMessageWidget.h
#ifndef MESSAGE_WIDGET
#define MESSAGE_WIDGET
#include <QWidget>
class QLabel;
class QPushButton;
class QMessageWidget : public QWidget
{
Q_OBJECT
public:
explicit QMessageWidget(QWidget *parent = 0);
~QMessageWidget();
// 设置显示文本
void setText(const QString &text);
protected:
void paintEvent(QPaintEvent *event);
private:
QLabel *m_pMessageLabel;
};
#endif // MESSAGE_WIDGET
QMessageWidget.cpp
#include <QLabel>
#include <QStyleOption>
#include <QPainter>
#include <QPushButton>
#include <QHBoxLayout>
#include "QMessageWidget.h"
QMessageWidget::QMessageWidget(QWidget *parent)
: QWidget(parent)
{
setFixedHeight(25);
setAutoFillBackground(true);
setObjectName("messageWidget");
// 提示图标
QLabel *pIconLabel = new QLabel(this);
m_pMessageLabel = new QLabel(this);
QPushButton *pCloseButton = new QPushButton(this);
pCloseButton->setFixedSize(8, 8);
pIconLabel->setFixedSize(16, 16);
pIconLabel->setScaledContents(true);
pIconLabel->setObjectName("informationLabel");
m_pMessageLabel->setAlignment(Qt::AlignLeft | Qt::AlignVCenter);
m_pMessageLabel->setObjectName("highlightLabel");
m_pMessageLabel->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
pCloseButton->setObjectName("closeTipButton");
QHBoxLayout *pLayout = new QHBoxLayout();
pLayout->addWidget(pIconLabel);
pLayout->addWidget(m_pMessageLabel);
pLayout->addWidget(pCloseButton);
pLayout->setSpacing(5);
pLayout->setContentsMargins(3, 3, 5, 3);
setLayout(pLayout);
connect(pCloseButton, SIGNAL(clicked(bool)), this, SLOT(close()));
}
QMessageWidget::~QMessageWidget()
{
}
// 设置显示文本
void QMessageWidget::setText(const QString &text)
{
m_pMessageLabel->setText(text);
}
// 设置样式需要重写
void QMessageWidget::paintEvent(QPaintEvent *event)
{
Q_UNUSED(event);
QStyleOption opt;
opt.init(this);
QPainter p(this);
style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this);
}
样式
// 界面样式
QWidget#messageWidget {
background: rgba(255, 255, 255, 20%);
}
// 提示信息样式
QLabel#highlightLabel {
color: rgb(0, 160, 230);
}
// 图标样式
QPushButton#closeTipButton {
border-radius: none;
border-image: url(:/Images/tipClose);
background: transparent;
}
QPushButton#closeTipButton:hover {
border-image: url(:/Images/tipCloseHover);
}
QPushButton#closeTipButton:pressed {
border-image: url(:/Images/tipClosePressed);
}
这里实现了设置信息,贾娜比隐藏等效果,可以在此基础上进行扩展。背景色、字体颜色、图标等样式都可以自行设置,主要是实现思路,愿大家共勉。