QLabel 設置背景圖片的方法和解決圖片太大不能完顯示的辦法

QLabel 設置背景圖片的方法和解決圖片太大不能完顯示辦法

目錄

• QLabel 設置背景圖片的方法和解決圖片太大不能完顯示辦法
  • 1、通過QPixmap來設置
    • 方法
    • 注意
  • 2、通過QSS設置
    • 方法
    • 注意

1、通過QPixmap來設置

方法

// 獲取到圖片目錄
QDir dir(qApp->applicationDirPath());
dir.cd("src");
// 構建pixmap
QPixmap pixmap(QDir().absoluteFilePath("Title.png"));
// 設置pixmap
ui.title_label->setPixmap(pixmap);

注意

通過上面的的設置效果如下:

發現圖片太大，沒有完全顯示
這時候就需要對圖片做一些處理，加上一行代碼：pixmap = pixmap.scaled(ui.title_label->size())
這是構建好pixmap之后直接設置pixmap的比例為Label的大小，第二個參數默認即可：Qt::IgnoreAspectRatio
官方解釋：

所以完整代碼應該是

// 獲取到圖片目錄
QDir dir(qApp->applicationDirPath());
dir.cd("src");
// 構建pixmap
QPixmap pixmap(QDir().absoluteFilePath("Title.png"));
// 設置pixmap比例
pixmap = pixmap.scaled(ui.title_label->size());
// 將pixmap設置到label
ui.title_label->setPixmap(pixmap);

效果：

2、通過QSS設置

方法

ui.title_label->setStyleSheet(
      "QLabel#title_label {"
      "background-image: url(""./src/Title.png"");"
      });

注意

通過上面的的設置效果如下:

還是出現圖片太大不能完全顯示的的問題，查找相關資源發現，設置Qss的時候要注意Qt的盒子模型

於是將background-image改為border-image:

ui.title_label->setStyleSheet(
      "QLabel#title_label {"
      "border-image: url(""./src/Title.png"");"
      });

具體可以參考：https://www.freesion.com/article/3632850648/
改完之后，最后效果：