标签:
最近在学习Qt使用QSS样式美化窗口部件的内容。发现在对QWidget应用background-image改变窗口背景图片时,QWidget的窗口背景并未生效。工程建立如下:
1、新建 Qt Application 工程
2、窗口选择从 QWidget 继承
3、最后生成的工程目录
4、工程源文件如下
main.cpp
1
2
3
4
5
6
7
8
9
|
#include "qwdg_backimage.h" #include <QtGui/QApplication> int main( int argc, char *argv[]) { QApplication a(argc, argv); QWdg_backImage w; w.show(); return a.exec(); } |
qwdg_backImage.h
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
#ifndef QWDG_BACKIMAGE_H #define QWDG_BACKIMAGE_H #include <QtGui/QWidget> #include "ui_qwdg_backimage.h" class QWdg_backImage : public QWidget { Q_OBJECT public : QWdg_backImage(QWidget *parent = 0, Qt::WFlags flags = 0); ~QWdg_backImage(); private : Ui::QWdg_backImageClass ui; }; #endif // QWDG_BACKIMAGE_H |
qwdg_backImage.cpp
1
2
3
4
5
6
7
8
9
10
|
#include "qwdg_backimage.h" QWdg_backImage::QWdg_backImage(QWidget *parent, Qt::WFlags flags) : QWidget(parent, flags) { ui.setupUi( this ); } QWdg_backImage::~QWdg_backImage() { } |
5、加入做为背景的图片资源
6、修改 继承的QWidget子类
qwdg_backImage.cpp
1
2
3
4
5
6
7
8
9
10
11
12
|
#include "qwdg_backimage.h" QWdg_backImage::QWdg_backImage(QWidget *parent, Qt::WFlags flags) : QWidget(parent, flags) { ui.setupUi( this ); // 这里是添加的背景图片 // 背景图片已事先添加入 qwdg_backimage.qrc 文件 setStyleSheet(tr( "background-image: url(:/images/background.png)" )); } QWdg_backImage::~QWdg_backImage() { } |
7、编译运行
咦,这时发现继承自QWidget的qwdg_backImage子类背景并未改变为构造函数里的图片背景。
解决办法如下:
1、修改 qwdg_backImage.h头文件,添加入 paintEvent 事件。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
#ifndef QWDG_BACKIMAGE_H #define QWDG_BACKIMAGE_H #include <QtGui/QWidget> // 新添加的头文件 #include <QPainter> #include "ui_qwdg_backimage.h" class QWdg_backImage : public QWidget { Q_OBJECT public : QWdg_backImage(QWidget *parent = 0, Qt::WFlags flags = 0); ~QWdg_backImage(); // 此处加入 paintEvent 事件 protected : void paintEvent(QPaintEvent *event); private : Ui::QWdg_backImageClass ui; }; #endif // QWDG_BACKIMAGE_H |
2、修改qwdg_backImage.cpp源文件,实现 paintEvent 事件。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
#include "qwdg_backimage.h" QWdg_backImage::QWdg_backImage(QWidget *parent, Qt::WFlags flags) : QWidget(parent, flags) { ui.setupUi( this ); // 这里是添加的背景图片 // 背景图片已事先添加入 qwdg_backimage.qrc 文件 setStyleSheet(tr( "background-image: url(:/images/background.png)" )); } QWdg_backImage::~QWdg_backImage() { } // 此处实现 paintEvent 事件 void QWdg_backImage::paintEvent(QPaintEvent *event) { QStyleOption opt; opt.init( this ); QPainter p( this ); style()->drawPrimitive(QStyle::PE_Widget, &opt, &p, this ); } |
再次编译运行:
总结:
1、QSS样式的语法和CSS样式的语法类似。
2、Qt的窗口部件可以直接应用QSS样式做出界面美化的工作,应用QSS样式有多种方法,其中一种就如本文件使用 setStyleSheet 函数
3、QWidget是可以直接用QSS样式的background-image属性的,但如果象本文生成的qwdg_backimage继承自QWidget的子类,在应用background-image属性时,必须实现重绘事件,即 paintEvent 事件。
QWidget使用qss样式的background-image属性
标签:
原文地址:http://www.cnblogs.com/RecreateBySelf/p/4221754.html