Qt 学习笔记-Qt中添加背景图片的方法

2019-9-3 05:24| 发布者: admin| 查看: 1095| 评论: 0

摘要: 做一个界面，用到QFrame和QPushButton，QFrame做主面板，QPushButton为其子控件，需要在主面板上贴背景图片，还需要在QPushButton上贴上相应的图标1. QPalette的方法#includeQApplication#includeQtGuiintmain(int a ...

做一个界面，用到QFrame和QPushButton，QFrame做主面板，QPushButton为其子控件，需要在主面板上贴背景图片，还需要在QPushButton上贴上相应的图标

1. QPalette的方法

#include<QApplication>#include<QtGui>

intmain(int argc, char *argv[]){QApplication app(argc,argv); QFrame *frame = new QFrame; frame->resize(400,700);QPixmap pixmap("images/frame.png"); QPalette palette; palette.setBrush(frame->backgroundRole(),QBrush(pixmap)); frame->setPalette(palette); frame->setMask(pixmap.mask()); //可以将图片中透明部分显示为透明的 frame->setAutoFillBackground(true); frame->show();

return app.exec();}

注意图片路径怎么表示，我的图片放在该工程下的images文件夹中。
存在问题：图片可以显示出来，但是图片大小不能和frame大小一致，显示效果不好，具体怎样调整大小，以后再补充，效果如下(设置了透明的，好像很漂亮～透明部分将我的桌面显示出来了~_~)

2.setStyleSheet方法(非常好用的方法)

#include<QApplication>#include<QtGui>

intmain(int argc, char *argv[]){QApplication app(argc,argv); QFrame *frame = new QFrame; frame->setObjectName("myframe"); frame->resize(400,700); frame->setStyleSheet("QFrame#myframe{border-image:url(images/frame.png)}" ); frame->show();

return app.exec();}

效果如下：

注意：很漂亮的效果吧，设置ObjectName后，才能保证setStyleSheet只作用在我们的frame上，不影响其子控件的背景设置。之所以用border-image而不用background-image，还是上面的问题，用background-image不能保证图片大小和控件大小一致，图片不能完全显示，这个以后再补充了，现在还没有找到方法。

3.paintEvent事件方法

//myframe.h文件#ifndef MYFRAME_H#define MYFRAME_H

#include<QWidget>#include<QtGui>

classMyFrame :public QWidget{public: MyFrame();voidpaintEvent(QPaintEvent *event);};

#endif// MYFRAME_H

//myframe.cpp文件#include"myframe.h"

MyFrame::MyFrame(){}

void MyFrame::paintEvent(QPaintEvent *event){QPainter painter(this); painter.drawPixmap(0,0,400,700,QPixmap("images/frame.png"));}

//main.cpp文件#include<QApplication>#include<QtGui>

#include"myframe.h"

intmain(int argc, char *argv[]){QApplication app(argc,argv); MyFrame *frame = new MyFrame; frame->resize(400,700); frame->show();

return app.exec();}

效果如下：

注意：跟前面一样的效果吧，与前面的差别就是这个背景图片不随着窗口的大小而变化，因为它的固定大小被设置成(400，700)了。重写QWidget的paintEvent事件，当控件发生重绘事件，比如show()时，系统就会自动调用paintEvent函数。

好了，上面是三种设置背景图片的方法，下面我要说一个设置QPushButton的背景图片的方法，用的是setIcon方法(其实QPushButton设置背景图片也可以用前面三种方法的，不过现在这种Icon方法的看起来也不错)

#include <QApplication>#include <QtGui>

int main(int argc, char *argv[]){ QApplication app(argc,argv);

QFrame *frame = new QFrame; QPushButton * button0 = new QPushButton(frame); QPushButton * button1 = new QPushButton(frame); QPushButton * button2 = new QPushButton(frame); QPushButton * button3 = new QPushButton(frame); QPushButton * button4 = new QPushButton(frame); QPushButton * button5 = new QPushButton(frame);

frame->setObjectName("myframe"); frame->resize(400,700); frame->setStyleSheet("QFrame#myframe{border-image:url(images/frame.png)}" );

button0->setGeometry(60,150,68,68); button1->setGeometry(160,150,68,68); button2->setGeometry(260,150,68,68); button3->setGeometry(60,280,68,68); button4->setGeometry(160,280,68,68); button5->setGeometry(260,280,68,68);

QIcon icon; QPixmap pixmap0("images/SMS.png"); icon.addPixmap(pixmap0); button0->setIcon(icon); button0->setIconSize(QSize(68,68)); button0->setFixedSize(pixmap0.size()); button0->setMask(pixmap0.mask());

QPixmap pixmap1("images/EMail.png"); icon.addPixmap(pixmap1); button1->setIcon(icon); button1->setIconSize(QSize(68,68)); button1->setFixedSize(pixmap1.size()); button1->setMask(pixmap1.mask());

QPixmap pixmap2("images/Contacts.png"); icon.addPixmap(pixmap2); button2->setIcon(icon); button2->setIconSize(QSize(68,68)); button2->setFixedSize(pixmap2.size()); button2->setMask(pixmap2.mask());

QPixmap pixmap3("images/Calendar.png"); icon.addPixmap(pixmap3); button3->setIcon(icon); button3->setIconSize(QSize(68,68)); button3->setFixedSize(pixmap3.size()); button3->setMask(pixmap3.mask());

QPixmap pixmap4("images/GoogleVoice.png"); icon.addPixmap(pixmap4); button4->setIcon(icon); button4->setIconSize(QSize(68,68)); button4->setFixedSize(pixmap4.size()); button4->setMask(pixmap4.mask());

QPixmap pixmap5("images/AndroidMarket.png"); icon.addPixmap(pixmap5); button5->setIcon(icon); button5->setIconSize(QSize(68,68)); button5->setFixedSize(pixmap5.size()); button5->setMask(pixmap5.mask());

frame->show();

return app.exec();}

效果如下：

补充:这样就可以让图片跟窗口一样大小了。

int main(int argc, char *argv[]){ QApplication app(argc,argv); QFrame *frame = new QFrame; frame->resize(400,700);

QImage image1； image1.load("images/frame1.jpg"); QImage image2 = image1.scaled(400,700);

QPalette palette; palette.setBrush(frame->backgroundRole(),QBrush(image2)); frame->setPalette(palette); frame->setMask(pixmap.mask()); //可以将图片中透明部分显示为透明的 frame->setAutoFillBackground(true); frame->show();

return app.exec();}

推荐阅读

（点击标题可跳转阅读）

Qt 学习笔记-强势入门

关注公众号【技术让梦想更伟大】，获取更多Linux/C/C++/Python/FPGA等原创技术文章。后台免费获取经典电子书籍和视频资源,实时更新,原创不易,请多支持,谢谢!

----------------------------------------------------------------------------------------------------------------------
我们尊重原创，也注重分享，文章来源于微信公众号：技术让梦想更伟大，建议关注公众号查看原文。如若侵权请联系qter@qter.org。
----------------------------------------------------------------------------------------------------------------------

鲜花

握手

雷人

路过

鸡蛋

收藏分享邀请

帐号		自动登录	找回密码
密码			立即注册

账号		自动登录	找回密码
密码			立即注册