QListWidget和QListView的使用和item点击事件

QListWidget和QListView很常用，但是使用上功能类似，往往容易分不清区别，但是不知道如何选择。这里总结下二者之间的区别和使用，分享给有需要的人，有需要的可点击收藏。

QListView介绍

QListView是Qt中用于显示列表的一个控件，它可以显示一个单列的列表，每个item可以是一个文本、图像或自定义的QWidget对象。QListView提供了丰富的接口，可以设置列表的选择模式、排序方式、滚动条等属性，还可以设置item的样式、大小、对齐方式等信息。QListView还可以通过自定义QAbstractItemModel类来管理item，实现更加灵活的功能。
 QListView的常用接口包括：
 - setModel()：设置QListView的model。
- setSelectionMode()：设置列表的选择模式。
- setSortingEnabled()：设置是否启用排序。
- setIconSize()：设置item的图标大小。
- setViewMode()：设置列表的显示模式。
- setSpacing()：设置item之间的间距。
- setUniformItemSizes()：设置是否使用统一的item大小。
- setWordWrap()：设置是否自动换行。
- setHorizontalScrollBarPolicy()和setVerticalScrollBarPolicy()：设置滚动条的显示策略。
 下面是一个简单的例子，演示了如何使用QListView来显示一个简单的列表：

// 创建一个QStringListModel
QStringListModel* model = new QStringListModel();
model->setStringList({"Item 1", "Item 2", "Item 3"});
// 创建一个QListView，并设置model
QListView* listView = new QListView();
listView->setModel(model);
// 设置列表的选择模式为单选
listView->setSelectionMode(QAbstractItemView::SingleSelection);
// 设置列表的排序方式为升序
listView->setSortingEnabled(true);
// 设置item的图标大小为32x32
listView->setIconSize(QSize(32, 32));
// 设置item之间的间距为10
listView->setSpacing(10);
// 设置列表的显示模式为图标模式
listView->setViewMode(QListView::IconMode);
// 设置是否自动换行
listView->setWordWrap(true);
// 设置滚动条的显示策略
listView->setHorizontalScrollBarPolicy(Qt::ScrollBarAlwaysOff);
listView->setVerticalScrollBarPolicy(Qt::ScrollBarAsNeeded);

在上面的代码中，首先创建了一个QStringListModel，并设置了三个item的文本。然后创建了一个QListView，并将model设置为其model。设置了列表的选择模式为单选，排序方式为升序，图标大小为32x32，item之间的间距为10，显示模式为图标模式，自动换行，滚动条的显示策略为水平不显示，垂直按需显示。最后将QListView添加到窗口中，就可以显示列表了。

QListWidget介绍

QListWidget类提供了一个基于item的列表小部件。QListWidget是一个方便的类，它提供了类似于QlistView所具有的列表视图，但是具有增加和删除的功能。QListWidget使用内部模型来管理列表中的每个QListWidgetItem。想要有更灵活的列表视图，请使用具有标准模型的QListView类。

QListWidget和QListView区别

QListWidget和QListView都是Qt中用于显示列表的控件，它们之间的区别主要在于显示方式和使用方法。QListView是基于Model，而QListWidget是基于Item。这是它们的本质区别。

QListWidget是一个基于QListView的高级控件，它提供了一个方便的列表视图，可以在其中显示图像、文本和其他自定义内容。QListWidget中的每个item都是一个QListWidgetItem对象，可以通过addItem()函数向列表中添加item，通过setItemSelected()函数设置item是否被选中，通过setSelectionMode()函数设置列表的选择模式。

QListView是一个更加底层的控件，它提供了一个显示列表的视图，但是不提供item的管理功能。QListView中的每个item都是一个QModelIndex对象，可以通过QAbstractItemModel类的接口来管理item。QListView中的item可以是任何自定义的QWidget对象，可以通过setIndexWidget()函数将QWidget对象设置为item的显示内容。

QListWidget是继承QListView，QListView是基于model的，需要自己来建模（例如建立QStringListModel、QSqlTableModel等），保存数据，这样就大大降低了数据冗余，提高了程序的效率。QListWidget是一个升级版本的QListView，它已经自己为我们建立了一个数据存储模型（QListWidgetItem），操作方便，直接调用addItem即可添加项目（ICON，文字）。

下面是一个简单的使用示例，分别演示了如何使用QListWidget和QListView来显示一个简单的列表：

// 使用QListWidget显示一个简单的列表
QListWidget* listWidget = new QListWidget();
listWidget->addItem("Item 1");
listWidget->addItem("Item 2");
listWidget->addItem("Item 3");

// 使用QListView显示一个简单的列表
QStringListModel* model = new QStringListModel();
model->setStringList({"Item 1", "Item 2", "Item 3"});
QListView* listView = new QListView();
listView->setModel(model);

QListWidget使用

void MainWindow::initListView()
{

    ui->m_ListWidget->setViewMode(QListWidget::IconMode);//显示模式
    ui->m_ListWidget->setIconSize(QSize(220, 100));//设置图片大小
    ui->m_ListWidget->setSpacing(5);//间距
    ui->m_ListWidget->setResizeMode(QListView::Adjust);//适应布局调整
    ui->m_ListWidget->setMovement(QListView::Static);//不能移动
    ui->m_ListWidget->setFlow(QListWidget::TopToBottom);  //从上到下(横向布局)
    ui->m_ListWidget->setSortingEnabled(true);//自动排序

    QDir dir_(QCoreApplication::applicationDirPath() +"/image/");    //遍历子目录中所有文件
    dir_.setFilter(QDir::Files | QDir::Hidden | QDir::NoSymLinks);        //获取当前所有文件
    dir_.setSorting(QDir::Size | QDir::Reversed);
    dir_.setNameFilters(QStringList("test*.png"));
    QFileInfoList list_file = dir_.entryInfoList();
    QImage* img=new QImage;
    for (int i = 0; i < list_file.size(); ++i) {
         QFileInfo fileInfo = list_file.at(i);
        qDebug()<<"fileInfos:"<<fileInfo.fileName();

        img->load(QCoreApplication::applicationDirPath() +"/image/"+fileInfo.fileName());
        QImage  image = img->scaled(QSize(220, 100),Qt::KeepAspectRatio, Qt::SmoothTransformation);
        QPixmap pixmap = QPixmap::fromImage(image);
        QListWidgetItem *imageItem = new QListWidgetItem;
        imageItem->setIcon(QIcon(pixmap));
        imageItem->setText(fileInfo.fileName());
        imageItem->setSizeHint(QSize(230, 115));
        imageItem->setTextAlignment(Qt::AlignCenter);
        // 连接item的clicked信号到槽函数，实现item的点击事件
        ui->m_ListWidget->addItem(imageItem);
    }

    connect(ui->m_ListWidget,&QListWidget::pressed,[=](QModelIndex pos){
        qDebug()<<"m_ListWidget pos.row:"<<pos.row();
    });

    //我们可以通过信号和槽的方式对列表控件的选项进行响应，例如
    connect(ui->m_ListWidget, SIGNAL(currentTextChanged(QString)),this, SLOT(textChanged(QString)));
}

QListView使用

void MainWindow::initListView1()
{
    listModel = new QStandardItemModel(this);
    ui->listView1->setIconSize(QSize(220, 100));
    for(int listRow=0; listRow< 5; listRow++) {
        QStandardItem* item = new QStandardItem(QString("Item %0").arg(listRow));

        QString filename = QCoreApplication::applicationDirPath() +"test.png";
        QImage* img=new QImage;
        img->load(QCoreApplication::applicationDirPath() +"/test.png");
        QImage  image = img->scaled(QSize(220, 100),Qt::KeepAspectRatio, Qt::SmoothTransformation);
        QPixmap pixmap = QPixmap::fromImage(image);
        item->setIcon(QIcon(pixmap));

        item->setSizeHint(QSize(230, 115));

        listModel->appendRow(item);
    }
    connect(ui->listView1,&QListView::pressed,[=](QModelIndex pos){
        qDebug()<<"listView pos.row:"<<pos.row();
    });

    ui->listView1->setModel(listModel);
}

其他资源

QT的QListWidget使用_蓝天巨人的博客-CSDN博客

Qt QListWidget详解-腾讯云开发者社区-腾讯云

QListWidget用法（一）：列表模式添加item_Qt高级开发视频教程_C/C++视频-51CTO学堂

QT使用QListWidget显示多张图片_listwidget添加图片_妙为的博客-CSDN博客

QT使用QListWidget实现图片列表_qt 图片列表_依旧自由人的博客-CSDN博客

Qt listView添加控件、图片___不高兴的博客-CSDN博客

https://ruikezhishiyun.blog.csdn.net/article/details/122683533

QListWidget添加自定义的widget并自动排序_qlistwidget添加widget_bclshuai的博客-CSDN博客

QListWidget进行行排序功能_qt qlistwidget排序_Pailugou的博客-CSDN博客

[QT_007]Qt学习之QListWidget控件详解_天空之城8020的博客-CSDN博客

Qt中QListWidget排列控件_qt qlistwidget排序_我不是萧海哇~~~~的博客-CSDN博客

https://www.cnblogs.com/tony-yang-flutter/p/15979967.html

QListWidget 中的元素水平排列_qlistwidget横向_Licht小粉的博客-CSDN博客

qt的QListwiget设置横向的排列_qt横向列表控件_liuxizhen2009的博客-CSDN博客

QListWidget显示文件夹内容，选择文件并显示文件夹下图片_qlistwidget 显示图片_前进的小xy的博客-CSDN博客

QListWidget与QTableWidget的使用以及样式设置_qlistwidget样式表_明之季的博客-CSDN博客