QListWidget自定义item的两种方式（二）——使用QWidget作为item

一. 效果

使用QWidget作为QListWidget的Item，测试程序效果如下（下面内容包含测试程序源代码）：

 

二. 步骤

使用QWidget作为QListWidget的Item的步骤如下

1. 定义要作为QListWidget的Item的自定义的QWidget

class CItemWidget : public QWidget

2. 创建自定义的QWidget并和QListWidget的Item关联起来

CItemWidget* pItemWidget = new CItemWidget(this)；
QListWidgetItem* pItem = new QListWidgetItem();
pItem->setSizeHint(QSize(350, 40));
ui->listWidget->addItem(pItem);
ui->listWidget->setItemWidget(pItem, pItemWidget);

注意：如果要QListWidget的每行显示多个自定义的QWidget，则需进行下面的设置

ui->listWidget->setResizeMode(QListView::Adjust);
ui->listWidget->setViewMode(QListView::IconMode);

三. 测试程序及效果

ItemWidget.h

#ifndef ITEMWIDGET_H
#define ITEMWIDGET_H

#include <QWidget>

namespace Ui {
class CItemWidget;
}

class CItemWidget : public QWidget
{
    Q_OBJECT

public:
    explicit CItemWidget(QWidget *parent = 0);
    ~CItemWidget();

    //设置数据
    void SetData(const QString& qstrFileName, int iFileSize, const QString& qstrPic);

private:
    Ui::CItemWidget *ui;

};

#endif // ITEMWIDGET_H

ItemWidget.cpp

#include "ItemWidget.h"
#include "ui_ItemWidget.h"

CItemWidget::CItemWidget(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::CItemWidget)
{
    ui->setupUi(this);
}

CItemWidget::~CItemWidget()
{
    delete ui;
}

void CItemWidget::SetData(const QString& qstrFileName, int iFileSize, const QString& qstrPic)
{
    ui->label_fileName->setText(qstrFileName);
    ui->label_fileSize->setText(QString::number(iFileSize));

    QPixmap pixmapPic(qstrPic);
    int iWidth = ui->label_pic->width();
    int iHeight = ui->label_pic->height();
    QPixmap pixmapPicFit = pixmapPic.scaled(iWidth, iHeight, Qt::IgnoreAspectRatio, Qt::SmoothTransformation);//饱满填充
    ui->label_pic->setPixmap(pixmapPicFit);
}

MainWidget.h

#ifndef MAINWIDGET_H
#define MAINWIDGET_H

#include <QWidget>

namespace Ui {
class CMainWidget;
}

class CMainWidget : public QWidget
{
    Q_OBJECT

public:
    explicit CMainWidget(QWidget *parent = 0);
    ~CMainWidget();

private:
    Ui::CMainWidget *ui;

    //添加Item
    void AddItem(const QString& qstrFileName, int iFileSize, const QString& qstrPic);
};

#endif // MAINWIDGET_H

MainWidget.cpp

#include "MainWidget.h"
#include "ui_MainWidget.h"
#include "ItemWidget.h"

CMainWidget::CMainWidget(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::CMainWidget)
{
    ui->setupUi(this);

    ui->listWidget->setResizeMode(QListView::Adjust);
    ui->listWidget->setViewMode(QListView::IconMode);

    AddItem("Video1", 1024, ":/images/video_1.png");
    AddItem("Video2", 2048, ":/images/video_2.png");
    AddItem("Video3", 3072, ":/images/video_3.png");
    AddItem("Video4", 4096, ":/images/video_4.png");
    AddItem("Video5", 5120, ":/images/video_1.png");
}

CMainWidget::~CMainWidget()
{
    delete ui;
}

void CMainWidget::AddItem(const QString& qstrFileName, int iFileSize, const QString& qstrPic)
{
    CItemWidget* pItemWidget = new CItemWidget(this);
    pItemWidget->SetData(qstrFileName, iFileSize, qstrPic);
    QListWidgetItem* pItem = new QListWidgetItem();
    pItem->setSizeHint(QSize(350, 40));
    ui->listWidget->addItem(pItem);
    ui->listWidget->setItemWidget(pItem, pItemWidget);
}

main.cpp

#include "MainWidget.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    CMainWidget w;
    w.show();

    return a.exec();
}

程序运行效果如下：

 

 

相关资料：

QListWidget自定义item的两种方式（一）——使用Delegate

自定义QWidget作为QListWidget的Item时偶尔出现位置偏移问题的解决方法和原理