今天要實現一個新的需求，要求一個選圖界面的每一個單元項以文字在上，圖片在下的形式顯示。但QListWidget中只有兩種搭配，一是文字在下圖片在上，二是圖片在左文字在右，以下圖所示。字體
查找資料後，受到這位朋友的啓發（https://blog.csdn.net/DK29030901065/article/details/50017795?utm_source=blogxgwz5），能夠把要呈現的圖片和文字轉化爲圖片畫在QListWidgetItem，實現代碼大概以下。ui
//文字框高度 const int textHight = 30; //圖片框距左邊界距離 const int imgMarin = 20; //得到圖片路徑 QString strPath = "./library/1.bmp"; QFileInfo fi(strPath); if(fi.isFile()) { //生成圖像objPixmap QPixmap objPixmap(strPath); //生成圖標對象 QPixmap iconPixmap(m_W_ICONSIZE,m_H_ICONSIZE); iconPixmap.fill(QColor(255,255,255)); // 在圖標上生成QPainter對象 QPainter painter(&iconPixmap); // 設置畫筆顏色 painter.setPen(QColor(0, 0, 0)); // 設置字體：SimSun、大小15 QFont font; font.setFamily("SimSun"); font.setPointSize(15); painter.setFont(font); // 定義文本框矩形 const QRect rectangle = QRect(0, 0, m_W_ICONSIZE, textHight); // 繪製文本 painter.drawText(rectangle, Qt::AlignHCenter, QString("text name")); // 反走樣 painter.setRenderHint(QPainter::Antialiasing, true); // 定義繪圖框矩形,畫圖 const QRect img_rectangle = QRect(imgMarin, textHight, m_W_ICONSIZE-(2*imgMarin), m_H_ICONSIZE-textHight-imgMarin); painter.drawPixmap(img_rectangle, objPixmap); // 定義繪圖框矩形,並畫圖 const QRect img2_rectangle = QRect(m_W_ICONSIZE-textHight, 0, textHight, textHight); QPixmap objPixmap2(":/image/image/open.png"); painter.drawPixmap(img2_rectangle, objPixmap2); // 爲單元項添加圖標對象 QListWidgetItem *pItem = new QListWidgetItem(QIcon(iconPixmap.scaled(QSize(m_W_ICONSIZE,m_H_ICONSIZE),Qt::KeepAspectRatio,Qt::SmoothTransformation)),QString("0")); // 設置單元項的寬度和高度 pItem->setSizeHint(QSize(m_W_ICONSIZE,m_H_ICONSIZE)); ui->listWidget->insertItem(0, pItem); }