1. 新创建1个Qt设计类(Widget):

    • Add New > Qt设计师界面类 > 模板选择: Widget > MyListWidgetItem

  2. 在界面布局好
    自定义 QListWidgetItem - 图1

    • 垂直策略: Fixed
    • 高度: 45

自定义 QListWidgetItem - 图2

  1. 头文件 MyListWidgetItem.h:
  1. lass MyListWidgetItem : public QWidget
  2. {
  3.     Q_OBJECT
  5. public:
  6.     explicit MyListWidgetItem(QWidget *parent = nullptr);
  7.     ~MyListWidgetItem();
  10.     void setData(QString title, QString subTitle, QString picFilePath);
  12. private:
  13.     Ui::MyListWidgetItem *ui;
  14. };
  1. 代码 MyListWidgetItem.cpp:
  1. void MyListWidgetItem::setData(QString title, QString subTitle, QString picFilePath)
  2. {
  3.     this->title = title;
  4.     this->subTitle = subTitle;
  5.     this->picFilePath = picFilePath;
  7.     ui->labelTitle->setText(title);
  8.     ui->labelSubTitle->setText(subTitle);
  10.     QPixmap pixmapPic(picFilePath);
  11.     int w = ui->labelPic->width();
  12.     int h  =ui->labelPic->height();
  13.     QPixmap pixmapPicFit = pixmapPic.scaled(w, h, Qt::IgnoreAspectRatio, Qt::SmoothTransformation); // 饱满填充
  14.     ui->labelPic->setPixmap(pixmapPicFit);
  15. }
  1. 调用 MainWindow.cpp
  1. // 设置自动适应布局调整(Adjust适应,Fixed不适应), 默认为不适应
  2. ui->listWidgetTalk->setResizeMode(QListView::Adjust);
  3. // 默认ListMode上下排列，IconMode左右
  4. // ui->listWidgetTalk->setViewMode(QListView::IconMode);
  5. ui->listWidgetTalk->setVerticalScrollBarPolicy(Qt::ScrollBarAsNeeded);
  1. QMap<QString, QMap<QString, QString>>::const_iterator iter;
  2. for (iter = this->myContacts.constBegin(); iter != this->myContacts.constEnd(); ++iter) {
  3.     QString uid = iter.key();
  4.     QString nickName = iter.value().value("nickName");
  5.     QString email = iter.value().value("email");
  6.     QString gender = iter.value().value("gender");
  7.     QString pic = ":/images/images/male_white.png";
  8.     if (gender == "0") {
  9.         pic = ":/images/images/female_white.png";
  10.     }
  12.     QListWidgetItem *item = new QListWidgetItem();
  13.     item->setData(Qt::UserRole+1, uid);
  14.     item->setSizeHint(QSize(100, 50));
  15.     ui->listWidgetTalk->addItem(item);
  17.     MyListWidgetItem *myItem = new MyListWidgetItem();
  18.     myItem->setData(nickName, email, pic);
  19.     myItem->setUid(uid);
  20.     myItem->setSizeIncrement(100, 50);
  21.     ui->listWidgetTalk->setItemWidget(item, myItem);
  22. }
  1. MainWindow界面设置样式:
  1. QListWidget{background-color: #131313}
  2. QListWidget:Item{background-color: #131313}
  3. QListWidget:item:selected{background:#2b2a2b}
  • QListWidget和QListWidgetItem 的背景色
  • QListWidgetItem 被选中的背景色

其它的一些参数说明:

  1. // 设置自动适应布局调整(Adjust适应,Fixed不适应), 默认为不适应
  2. ui->listWidget->setResizeMode(QListView::Adjust);
  4. // 默认ListMode上下排列，IconMode左右
  5. ui->listWidget->setViewMode(QListView::IconMode);
  7. // 设置QListWidget中单元项的间距
  8. ui->listWidget->setSpacing(10); 
  10. // 设置不能移动
  11. ui->listWidget->setMovement(QListWidget::Static);
  13. // 文字没虚线
  14. ui->listWidget->setFocusPolicy(Qt::NoFocus);
  16. // 设置滚轮策略
  17. ui->listWidget->setVerticalScrollMode(QAbstractItemView::ScrollPerItem);
  19. // 设置滚轮滚动速度
  20. ui->listWidget->verticalScrollBar()->setSingleStep(10);