qt qlistWidget和QListWidgetItem的使用

mainwindow.ui如图，用到的元素比较简单，自己创建就可以

mainwindow.h

点击查看代码

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QFileDialog>
#include <QDir>
#include <QDebug>
#include <QGridLayout>
#include <QHBoxLayout>
#include <QVBoxLayout>



#include <QStyledItemDelegate>

class PortalItemDelegate : public QStyledItemDelegate
{
    Q_OBJECT
public:
    PortalItemDelegate(QWidget *parent = nullptr){}
    virtual ~PortalItemDelegate(){}
    void updateEditorGeometry(QWidget *editor, const QStyleOptionViewItem &option, const QModelIndex &index) const {
        editor->setGeometry(option.rect);// option.rect属性中保存了Item的位置
    }
};



namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

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

private slots:
    void on_pushButton_image_clicked();

private:
    Ui::MainWindow *ui;

    QString dirPath_;
    QDir imageDir_;
};

#endif // MAINWINDOW_H

mainwindow.cpp

点击查看代码

#include "mainwindow.h"
#include "ui_mainwindow.h"

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

    /*******************属性设置************************************/
    // 设置显示模式
    ui->listWidget_image->setViewMode(QListView::IconMode);

    // 甚至随略图的大小
    ui->listWidget_image->setIconSize(QSize(100,100));

    // 设置图标间距
    ui->listWidget_image->setSpacing(15);
//    ui->listWidget_image->set

    // 设置图标是否可以拖动，这里设置静止
    ui->listWidget_image->setMovement(QListWidget::Static);
    ui->listWidget_image->setResizeMode(QListWidget::Adjust);//主窗口缩放，设置这个会跟随自动变化

    // 连接点击信号
    //connect(ui->listWidget_image,&QListWidget::itemClicked,this,&ImageListWidget::listwidgetImageOnclicked);

//    ui->listWidget_image->setIconSize(QSize(25, 25));  //设置item图标大小
//    ui->listWidget_image->setGridSize(QSize(100, 100)); // 设置后，如果图标排布不满，最后一个会有问题
    ui->listWidget_image->setFocusPolicy(Qt::NoFocus);  //这样可禁用tab键和上下方向键并且除去复选框
    ui->listWidget_image->setFont(QFont("宋体", 10, QFont::DemiBold));
    ui->listWidget_image->setStyleSheet(
                "*{outline:0px;}"  //除去复选框
                "QListWidget{background:rgb(245, 245, 247); border:0px; margin:0px 0px 0px 0px;}"
                "QListWidget::Item{height:40px; border:0px; padding-left:14px; color:rgba(200, 40, 40, 255);}"
                "QListWidget::Item:hover{color:rgba(40, 40, 200, 255);}"
                "QListWidget::Item:selected{background:rgb(230, 231, 234); color:rgba(40, 40, 200, 255);}"
//                "QListWidget::Item:selected{background:rgb(230, 231, 234); color:rgba(40, 40, 200, 255); border-left:4px solid rgb(180, 0, 0);}"
                //"QListWidget::Item:selected:active{background:rgb(230, 231, 234); color:rgba(40, 40, 200, 255); border-left:4px solid rgb(180, 0, 0);}"
                );



    connect(ui->listWidget_image,&QListWidget::itemClicked,this, [=] (QListWidgetItem *pItem) mutable {
        int idx = ui->listWidget_image->row(pItem);
        QString imagePath=QString("%1/%2").arg(dirPath_).arg(imageDir_[idx]); // 图片路径拼接
        ui->label_path->setText(imagePath);
    });
}

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

void MainWindow::on_pushButton_image_clicked()
{
    QString path = QFileDialog::getExistingDirectory(this,QStringLiteral("选择图片文件夹"));
    if(path.isEmpty())
        return;
    dirPath_=path;
    qDebug()<<path;
    QDir dir(path);
    QStringList filters;
    filters<<"*.png"<<"*.jpg";  // 设置哪些格式图片的可以显示
    dir.setNameFilters(filters);

    imageDir_ = dir;

    // 设置显示的itme
    for(uint idx=0;idx<dir.count();idx++)
    {
        QListWidgetItem *pItem = new QListWidgetItem();
        QString imagePath = QString("%1\\%2").arg(path).arg(dir[idx]);
        qDebug()<<dir[idx];

        // 这种方式无法居中，图片会自动定格，自由度太差
//        pItem->setIcon(QIcon(imagePath));
//        pItem->setSizeHint(QSize(100,100));
//        pItem->setText(dir[idx]);
//        pItem->setTextAlignment(Qt::AlignHCenter|Qt::AlignVCenter);
//        pItem->setBackgroundColor(QColor(100,100,100));
//        ui->listWidget_image->addItem(pItem);


        QWidget *itemWidget = new QWidget(ui->listWidget_image);
        QGridLayout *itemLayout = new QGridLayout();
        QVBoxLayout *itemContentLayout = new QVBoxLayout;
        QLabel *lblPicture = new QLabel("");
        QPixmap pixmap(imagePath);
        lblPicture->setPixmap(pixmap.scaled(64, 64, Qt::KeepAspectRatio, Qt::SmoothTransformation));
        lblPicture->setAlignment(Qt::AlignCenter);

//        QLabel *lblContent = new QLabel("模块");
        QLabel *lblContent = new QLabel(dir[idx]);
        lblContent->setAlignment(Qt::AlignCenter);
        itemContentLayout->addWidget(lblPicture,4);//图片控件占4行
        itemContentLayout->addWidget(lblContent,1);//文字占1行
        itemLayout->addLayout(itemContentLayout,0,0,1,1);
//        itemLayout->addWidget(lblPicture,0,0,1,4);
//        itemLayout->addWidget(lblContent,4,0,1,1);//使用这种方式，不知道为啥字体无法居中
        itemWidget->setLayout(itemLayout);
        QListWidgetItem *item = new QListWidgetItem(ui->listWidget_image);
        item->setSizeHint(ui->listWidget_image->iconSize());
        ui->listWidget_image->setItemWidget(item,itemWidget);
    }

    // 最后一个图标位置会有一点偏差，设置这个可以修复这个问题
    PortalItemDelegate *delegate = new PortalItemDelegate(this);
    ui->listWidget_image->setItemDelegate(delegate);
    //ui->listWidget_image->repaint();//使用重绘无法解决最后一个图标偏移问题
}