最近在学习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属性的更多相关文章

  1. QT源码剖析之QSS样式表

    1. "QApplication::setStyleSheet()"设置样式表: 1. 创建新的样式表. 2. 设置新的样式. void QApplication::setStyl ...

  2. GUI学习之三十四——QSS样式表

    今天是一个大课题:QSS样式表 一.概念: QSS是Qt Style Sheet——Qt样式表,是用来自定义控件外观的一种机制;可以把他类比成CSS,但是不及其功能强大. 二.使用: 我们做一个模板, ...

  3. QSS 样式表 (一)

    在开发应用程序时,往往对界面的美观有一定的要求.Qt 引入了 QSS 机制,使得界面的美化工作变的轻轻松松.嗯,QSS听着有点耳熟.是的,QSS的语法和CSS类似.在此做些总结. 先来看一个简单的例子 ...

  4. background复合属性详解(上):background-image

    background复合属性是个很复杂的属性,花样非常多,比较神奇的是css3 中支持多图片背景了,这篇文章先讲讲background-image属性,其他背景属性会在后续的文章综合总结. 一.最基本 ...

  5. Qss样式(二)

    Qss 其实就是一段文本,当然得按一定格式来写.下面请看Qss的语法格式: 选择器 { 属性1:值:属性2:值:--属性n:值:} 对应上篇文章的Qss样式: 现在我们可以来解释这段话的意思了: 对应 ...

  6. jQuery 选择器 筛选器 样式操作 文本操作 属性操作 文档处理 事件 动画效果 插件 each、data、Ajax

    jQuery jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方 ...

  7. 前端CSS-font属性,超链接的美化,css精灵,background综合属性

    前端CSS-font属性,超链接的美化,css精灵,background综合属性 1. font属性 使用font属性,能够将字号.行高.字体,能够一起设置. font:14px/24px " ...

  8. Qt之界面实现技巧-- 窗体显示,绘制背景,圆角,QSS样式

    转自 --> http://blog.sina.com.cn/s/blog_a6fb6cc90101dech.html 总结一下,在开发Qt的过程中的一些技巧!可遇而不可求... 一.主界面 1 ...

  9. 这些Android系统样式中的颜色属性你知道吗?

    Android 系统样式中的颜色属性 推荐阅读看完后彻底搞清楚Android中的 Attr . Style .Theme 几个常用的颜色属性 先放上一张经典的图片,图片来自网络. 这张图在网上很是流传 ...

随机推荐

  1. uva 296 - Safebreaker

    枚举法 #include <cstdio> using namespace std; int main() { int t, n, i, j, k; scanf("%d" ...

  2. Java语言实现简单FTP软件------>FTP软件效果图预览之上传功能(三)

    下面展示一下上传功能的过程 1.上传前 上传前选择好要将文件或文件夹上传到远程FTP服务器的哪个目的目录下. 2.上传中 添加上传任务 上传任务完成进度显示 3.上传完成 ============== ...

  3. 使用Hammer.js的H5页面开发DOM的一些小说法

    前几天,一个小伙伴说叫我帮他写一个移动端上的一个轮播图,个人一般是不接私活的,毕竟平时工作也是单双休,时间也不很多. 可能大部分程序员,多余的时间都是看看新闻,打游戏,或者学习新的知识,缺少运动吧. ...

  4. iOS学习之页面之间传值的方式总结

    传值三种场景: 1.属性传值(从前往后传) 需求:第二个界面标签显示第一个界面输入框文字. 第一步, 在前一个界面定义属性. (语义属性声明为copy); 第二步, 在进入下一个界面之前,给属性传入数 ...

  5. Java并发编程--线程封闭(Ad-hoc封闭 栈封闭 ThreadLocal)

    线程封闭实现好的并发是一件困难的事情,所以很多时候我们都想躲避并发.避免并发最简单的方法就是线程封闭.什么是线程封闭呢?就是把对象封装到一个线程里,只有这一个线程能看到此对象.那么这个对象就算不是线程 ...

  6. Java学习笔记--集合元素的比较Comparable,Comparator

    原文见: http://www.cnblogs.com/sunflower627/p/3158042.html 1. Comparator 和 Comparable 相同的地方 他们都是java的一个 ...

  7. Java学习笔记--Socket和ServerSocket

    参考资料: http://haohaoxuexi.iteye.com/blog/1979837http://zhidao.baidu.com/link?url=OeOSa0YbOzSbMVPa8sgP ...

  8. 从事web前端的这些日子

    不知不觉从事web前端快要一年了,在这一年的时间,自己的技术也得到了不小的进步,但毕竟还是停留在摸索的阶段,前端的这条路还有很长的路要走,前端要掌握的东西太多,知识也在频繁的更新.每天在群里和别人的交 ...

  9. Chrome下的语音控制框架MyVoix.js使用篇(三)

    上篇文末已经提及,google分析出的单词可能和大家预想的输入有差别.上文我们通过预先绑定多个语音指令,权益地解决了这个问题.在这一章,我将介绍myvoix.js框架自带的smart learning ...

  10. 页面正在载入js

    页面显示(pageshow)和页面隐藏(pagehide)事件 http://blog.163.com/jiang_tao_2010/blog/static/121126890200911403336 ...