先看一下實現效果:
類 QGraphicsBlurEffect 可以實現圖像的模糊效果,它的相關接口主要有如下兩個:
- void setBlurHints(QGraphicsBlurEffect::BlurHints hints)
- void setBlurRadius(qreal blurRadius)
setBlurHints 是設置模糊質量的函數,它的參數有如下幾種:
- PerformanceHint 表明渲染性能是最重要的因素,但可能會降低渲染質量。(默認參數)
- QualityHint 表明渲染質量是最重要的因素,但潛在的代價是降低性能。
- AnimationHint 表示模糊半徑將是動畫的,暗示實現可以保留一個源的模糊路徑緩存。如果源要動態更改,則不要使用此提示。
setBlurRadius 設置模糊半徑,半徑越大,模糊效果越明顯,默認爲5。
完整代碼如下:
頭文件:
#ifndef WIDGET_H
#define WIDGET_H
#include <QWidget>
class QSlider;
class QGraphicsBlurEffect;
class ImageWidget : public QWidget
{
Q_OBJECT
public:
ImageWidget(QWidget* parent = nullptr);
~ImageWidget();
void setPixmap(const QPixmap& pixmap);
protected:
void paintEvent(QPaintEvent* event) override;
private:
QPixmap m_pixmap;
};
// ==========================================================
class Widget : public QWidget
{
Q_OBJECT
public:
Widget(QWidget *parent = 0);
~Widget();
private:
ImageWidget* m_pImageWidget = nullptr;
ImageWidget* m_pEffectImageWidget = nullptr;
QGraphicsBlurEffect* m_pBlurEffect = nullptr;
protected:
virtual void resizeEvent(QResizeEvent *event) override;
private slots:
void onChangeButtonClicked(void);
void onChangedSlder(int value);
};
#endif // WIDGET_H
源文件:
#include "widget.h"
#include "UICustomSingleControl/UICustomImageViewer.h"
#include <QVBoxLayout>
#include <QPainter>
#include <QGraphicsBlurEffect>
#include <QPushButton>
#include <QFileDialog>
#include <QSlider>
#include "CustomCombineControl/UICustomIntControl.h"
ImageWidget::ImageWidget(QWidget* parent)
:QWidget(parent)
{
}
ImageWidget::~ImageWidget()
{
}
void ImageWidget::setPixmap(const QPixmap& pixmap)
{
m_pixmap = pixmap;
this->update();
}
void ImageWidget::paintEvent(QPaintEvent* event)
{
QWidget::paintEvent(event);
QPainter painter(this);
if (!m_pixmap.isNull())
painter.drawPixmap(this->rect(), m_pixmap);
}
// ==========================================================
Widget::Widget(QWidget *parent)
: QWidget(parent)
{
QVBoxLayout* layout = new QVBoxLayout(this);
layout->setMargin(0);
layout->setSpacing(10);
layout->addSpacing(50);
m_pImageWidget = new ImageWidget;
QPixmap pixmap("./t2.jpg");
m_pImageWidget->setPixmap(pixmap);
m_pImageWidget->setFixedSize(150, 150);
layout->addWidget(m_pImageWidget, 0, Qt::AlignTop | Qt::AlignHCenter);
QPushButton* pChangedButton = new QPushButton(tr("Change Image"));
layout->addWidget(pChangedButton, 0, Qt::AlignTop | Qt::AlignHCenter);
QObject::connect(pChangedButton, &QPushButton::clicked, this, &Widget::onChangeButtonClicked);
layout->addStretch();
UICustomIntControl *pIntSlider = new UICustomIntControl;
pIntSlider->setRangeValue(1, 200);
pIntSlider->setCurrentValue(50);
pIntSlider->setTagText(tr("Radius: "));
pIntSlider->setColumnWidth(0, 80);
pIntSlider->setStyleSheet("background: transparent;");
layout->addWidget(pIntSlider);
layout->addSpacing(30);
QObject::connect(pIntSlider, &UICustomIntControl::valueChanged, this, &Widget::onChangedSlder);
// Effect
m_pEffectImageWidget = new ImageWidget(this);
m_pEffectImageWidget->setPixmap(pixmap);
m_pBlurEffect = new QGraphicsBlurEffect;
m_pBlurEffect->setBlurRadius(50);
m_pBlurEffect->setBlurHints(QGraphicsBlurEffect::PerformanceHint);
m_pEffectImageWidget->setGraphicsEffect(m_pBlurEffect);
pChangedButton->raise();
m_pImageWidget->raise();
pIntSlider->raise();
}
Widget::~Widget()
{
}
void Widget::onChangeButtonClicked(void)
{
QString fileName = QFileDialog::getOpenFileName(this, "Open Image", "./");
if (fileName.isEmpty())
return;
QPixmap pixmap(fileName);
m_pImageWidget->setPixmap(pixmap);
m_pEffectImageWidget->setPixmap(pixmap);
}
void Widget::onChangedSlder(int value)
{
m_pBlurEffect->setBlurRadius(value);
m_pBlurEffect->update();
m_pEffectImageWidget->update();
}
void Widget::resizeEvent(QResizeEvent *event)
{
m_pEffectImageWidget->setGeometry(0, 0, this->width(), this->height());
return QWidget::resizeEvent(event);
}
這裏關鍵代碼如下:
m_pEffectImageWidget->setGraphicsEffect(m_pBlurEffect);
main.cpp
#include "widget.h"
#include <QApplication>
#include "UICustomCore/CustomStyleConfig.h"
int main(int argc, char *argv[])
{
QApplication a(argc, argv);
g_StyleConfig->init();
Widget w;
w.resize(400, 600);
w.show();
return a.exec();
}