qt 背景和控件布局_Qt控件背景图片设置总结
自己開發了一個股票智能分析軟件,功能很強大,需要的點擊下面的鏈接獲取:
掃碼關注公眾號
1.Qss 的setStyleSheet設置背景圖片
1.1background-image設置平鋪或者居中
這種方法設置的要點是要將圖片添加到qrc文件中,形成資源路徑,然后在QT界面編輯或者程序代碼中通過設置路徑來實現背景圖片設置。圖片大小不能自適應控件大小。只能可以實現平鋪或者居中顯示。background-position:center;設置顯示位置,background-repeat:no-repeat;設置是否平鋪;
(1)平鋪重復顯示
QWidget#widgetWinPic
{
background-image:url(:/FaceMatch/Resources/pic/viewbackin.png);
background-repeat:repeat;
}
或者代碼中ui.widgetWinPic.setStyleSheet("QPushButton{ background-image: url(:/FaceMatch/Resources/pic/viewbackin.png);background-repeat:repeat;");
(2)居中不重復設置
QWidget#widgetWinPic
{
background-image:url(:/FaceMatch/Resources/pic/viewbackin.png);
background-position:center;
background-repeat:no-repeat;
}
或者代碼中?ui.widgetWinPic.setStyleSheet("QPushButton{ background-image: url(:/FaceMatch/Resources/pic/viewbackin.png);background-position:center;background-repeat:no-repeat;");
1.2 border-image設置按照控件大小縮放填充整個控件
圖片被拉伸填滿整個控件,可以實現縮放拉伸填充。會跟著控件的大小變化進行縮放,下圖左側是正常尺寸,右側是放大后的樣子
QWidget#widgetViewVedio
{
background-color:rgba(0,48,77,0.7);
border-image:url(:/FaceMatch/Resources/pic/viewbackin.png);
}
或者直接在代碼中設置
ui.widgetViewVedio->setStyleSheet(QLatin1String("QWidget#widgetViewVedio\n"
"{\n"
"background-color:rgba(0,48,77,0.7);\n"
"border-image:url(:/FaceMatch/Resources/pic/viewbackin.png);\n"
"}\n"
""));
2.使用QPixmap load圖片,然后setPixmap到控件上。可以實現圖片的填充,縮放,保持寬高比縮放。可以加載目標路徑下的圖片作為背景圖。缺點是不圖片的大小不能隨著Qlabel的大小變化。如果要能夠根據Qlabel大小自動變化,需要設置ui.labelPic->setScaledContents(true);這樣只能是縮放填充的形式,不能保持圖片的寬高比。也可以重寫resize函數,按照QLabel的大小,動態調整Pixmap的大小,可以實現大小自動調整。但是如果是在自動布局中,窗口放大,再縮小,因為pixmap圖片尺寸由大變小,窗口被大圖片撐大,大小無法及時調整,自動布局中會出現布局亂的情況。
enum AspectRatioMode {
IgnoreAspectRatio,//完全填充,圖片會被拉伸到整個size
KeepAspectRatio,//按圖片比例縮放,保持寬高比,按QLabel的高度或者寬度填滿圖片,如果要聚眾可以調用setAlignment(Qt::AlignCenter);實現居中顯示
KeepAspectRatioByExpanding//? ? 保持圖片的寬高比,同時要放大圖片填充到整個窗口。
};
QPixmap pix(picData.strPicPath);
pix= pix.scaled(ui.labelPic->size(), Qt::KeepAspectRatio, Qt::SmoothTransformation);
ui.labelPic->setPixmap(pix);
3.繼承QLabel類,重寫paintEvent函數,用QPaintEvent去繪制圖片。這種方法是最靈活的,可以按照自己想要的任何方式描繪背景。可以實現“居中”、“平鋪”、“縮放”、“拉伸”。缺點是要計算繪制的尺寸和位置,要實現寬高比縮放,還需要通過判斷圖片的寬高和QLabel的寬高來計算。下面的方法實現的是保持圖片的寬高比,最大化居中顯示圖片,而且可以隨著QLabel的大小動態更新圖片的大小。只要設置一個圖片的路徑進去,就可以。實現的效果是保持寬高比,大小隨著QLabel大小自動變化。
頭文件
#ifndef ASPECTRATIOPIXMAPLABEL_H#define ASPECTRATIOPIXMAPLABEL_H#include#include
class AspectRatioPixmapLabel : publicQLabel
{
Q_OBJECTpublic:
AspectRatioPixmapLabel(QWidget*parent = 0);voidsetPath(QString strPath)//設置圖片路徑
{
m_strPath=strPath;
pix=QPixmap(m_strPath);//創建Pixmap對象
update();//這里需要刷新下,觸發重繪,paintEvent會去畫圖片,否則不觸發重繪,不會花圖片,QLabel大小變化時,也會觸發重繪,自動去按Qlabel尺寸重繪圖片
}void setScalPixmap(constQPixmap p);//設置變化的protected:void paintEvent(QPaintEvent *) Q_DECL_OVERRIDE;//重寫重繪函數private:
QPixmap pix;//保存圖片Pixmap
QString m_strPath= "";//保存圖片路徑
};#endif //ASPECTRATIOPIXMAPLABEL_H
源文件
#include "aspectratiopixmaplabel.h"#includeAspectRatioPixmapLabel::AspectRatioPixmapLabel(QWidget*parent) :
QLabel(parent)
{//this->setMinimumSize(1, 1);
setStyleSheet("font-family: MicrosoftYaHeiUI;font-size: 14px;color:#028EC0;letter-spacing: 0;line-height: 20px;");
setScaledContents(false);
show();
}void AspectRatioPixmapLabel::paintEvent(QPaintEvent *env)
{//讓圖片按照Qlabel的大小進行縮放,保持寬高比。
if (!pix.isNull())
{
QPainter painter(this);
QSize labelsize= this->size();
pix= pix.scaled(this->size(), Qt::KeepAspectRatio, Qt::SmoothTransformation);
QSize pixsize=pix.size();//根據圖片的寬高和QLabel的寬高計算繪圖的矩形區域和坐標
QRect rectPic(0, 0, pix.size().width(), pix.size().height());if (pix.width() < this->width())
{
rectPic.setX((this->width() - pix.width()) / 2);
rectPic.setY(0);
rectPic.setWidth(pix.size().width());
rectPic.setHeight(pix.size().height());
}if (pix.height() < this->height())
{
rectPic.setX(0);
rectPic.setY((this->height() - pix.height()) / 2);
rectPic.setWidth(pix.size().width());
rectPic.setHeight(pix.size().height());
}
QSize pimageszie=pix.toImage().size();
painter.drawImage(rectPic, pix.toImage());
}
}
主程序中new一個對象,然后插入到一個widget的布局中,QLabel大小隨著widget自動縮放,里面的圖片也會自動調整大小。
主程序代碼實例:
m_pAspectLabelPicShow = newAspectRatioPixmapLabel(ui.widgetWinPic);
ui.verticalLayout_5->addWidget(m_pAspectLabelPicShow);
4.小結
方法
優點
缺點
Setstylesheet
Background-image可以實現平鋪、居中,無法實現拉伸,縮放,自動調整。border-image可以實現填充、拉伸、自動調整大小。
需要將圖片添加到資源qrc中,無法實現pixmap的加載。無法實現保持圖片的寬高比。
SetPixMap
可以實現居中、填充、保持寬高比、自動調整大小。
自動布局中縮放會引起窗體尺寸變化,不能恢復到原尺寸。
paintEvent
可以實現居中、平鋪、填充、縮放、保持寬高比、自動調整大小等。
需要計算位置和繪圖區域,計算比較復查。
總結
以上是生活随笔為你收集整理的qt 背景和控件布局_Qt控件背景图片设置总结的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: python字符集_Python任意字符
- 下一篇: todo已完成任务_uTools 插件介