QT从入门到精通（三）——实现文件列表遍历的图像浏览器

使用 Qt 实现文件列表遍历的图像浏览器

在本篇博客中将介绍如何使用 Qt 框架创建一个简单的图像浏览器应用程序。该应用程序能够选择文件夹，遍历其中的图像文件，并显示这些图像。我们将重点关注如何使用 Qt 的文件对话框和 OpenCV 库来处理图像。

1. 项目结构

• 头文件 (ImageBrowserPanel.h)：定义了 ImageBorwser 类及其成员变量和方法。
• 源文件 (ImageBrowserPanel.cpp)：实现了 ImageBorwser 类的方法，包括用户界面初始化和图像浏览功能。

2. 头文件 (ImageBrowserPanel.h)

定义了 ImageBorwser 类，包含以下成员变量和方法：

class ImageBorwser: public QWidget {
    Q_OBJECT
public:
    ImageBorwser();
    void initUI();
public slots:
    void selectDirimages();
    void last_image();
    void next_image();

private:
    QPushButton *selectDirBtn{nullptr};
    QLabel *dirLabel{nullptr};
    QLabel *allNumLabel{nullptr};
    QLabel *imageLabel{nullptr};
    QPushButton *lastButton{nullptr};
    QPushButton *nextButton{nullptr};
    QHBoxLayout *hboxlayout{nullptr};
    QHBoxLayout *hboxlayout_Btn{nullptr};
    QVBoxLayout *vboxlayout{nullptr};
    std::vector<std::string> images_dir;
    int index = 0;
};

关键成员变量

• QPushButton *selectDirBtn：用于选择文件夹的按钮。
• QLabel *dirLabel：显示当前选择的文件夹路径。
• QLabel *allNumLabel：显示图像总数。
• QLabel *imageLabel：用于显示当前图像。
• std::vector<std::string> images_dir：存储图像文件路径的向量。
• int index：当前显示的图像索引。

3. 源文件 (ImageBrowserPanel.cpp)

在源文件中，我们实现了构造函数和用户界面初始化方法。

3.1 构造函数

ImageBorwser::ImageBorwser() {
    std::cout << "hello world!\n\n\n" << std::endl;
    initUI();
}

构造函数中调用 initUI() 方法来初始化用户界面。

3.2 用户界面初始化

在 initUI() 方法中，我们创建了按钮、标签和布局，并设置了它们的属性。

void ImageBorwser::initUI() {
    this->selectDirBtn = new QPushButton(QString::fromLocal8Bit("请选择文件夹:"));
    this->dirLabel = new QLabel();
    this->allNumLabel = new QLabel();
    this->imageLabel = new QLabel();
    this->imageLabel->setAlignment(Qt::AlignCenter);
    this->imageLabel->setFixedSize(QSize(800, 600));

    // 设置布局 this->vboxlayout = new QVBoxLayout();
    this->hboxlayout = new QHBoxLayout();
    this->hboxlayout_Btn = new QHBoxLayout();

    // 添加按钮和标签到布局
    this->hboxlayout->addWidget(this->selectDirBtn);
    this->hboxlayout->addStretch(1);
    this->hboxlayout->addWidget(this->dirLabel);
    this->hboxlayout->addStretch(1);
    this->hboxlayout->addWidget(this->allNumLabel);
    this->vboxlayout->addLayout(this->hboxlayout);
    this->vboxlayout->addWidget(this->imageLabel);
    this->setLayout(this->vboxlayout);

    // 连接信号和槽 connect(this->selectDirBtn, SIGNAL(clicked()), this, SLOT(selectDirimages()));
}

3.3 选择文件夹

在 selectDirimages() 方法中，我们使用 QFileDialog 选择文件夹，并遍历其中的图像文件。

void ImageBorwser::selectDirimages() {
    QString dir = QFileDialog::getExistingDirectory(this, QString::fromUtf8("选择文件夹"), "D:/images/images", QFileDialog::ShowDirsOnly | QFileDialog::DontResolveSymlinks);
    if (!dir.isEmpty()) {
        this->dirLabel->setText(QString::fromLocal8Bit("当前路径:") + dir);
        cv::glob(dir.toStdString(), images_dir);
        this->allNumLabel->setText(QString::fromLocal8Bit("图像总数:") + QString::number(images_dir.size()));
    }
    index = 0;

    // 显示第一张图像 cv::Mat img = cv::imread(images_dir[index]);
    cv::cvtColor(img, img, cv::COLOR_BGR2RGB);
    QImage qimg(img.data, img.cols, img.rows, img.step, QImage::Format_RGB888);
    QPixmap pixmap = QPixmap::fromImage(qimg);
    pixmap = pixmap.scaled(QSize(800, 600), Qt::KeepAspectRatio, Qt::SmoothTransformation);
    this->imageLabel->setPixmap(pixmap);
}

3.4 浏览图像

next_image() 和 last_image() 方法用于浏览图像。

void ImageBorwser::next_image() {
    this->index += 1;
    if (this->index >= (this->images_dir.size() - 1)) {
        this->index = this->images_dir.size() - 1;
    }
    // 显示下一张图像
    cv::Mat img = cv::imread(images_dir[this->index]);
    cv::cvtColor(img, img, cv::COLOR_BGR2RGB);
    QImage qimg(img.data, img.cols, img.rows, img.step, QImage::Format_RGB888);
    QPixmap pixmap = QPixmap::fromImage(qimg);
    pixmap = pixmap.scaled(QSize(800, 600), Qt::KeepAspectRatio, Qt::SmoothTransformation);
    this->imageLabel->setPixmap(pixmap);
}

void ImageBorwser::last_image() {
    this->index -= 1;
    if (this->index < 0) {
        this->index = 0;
    }
    // 显示上一张图像 cv::Mat img = cv::imread(images_dir[this->index]);
    cv::cvtColor(img, img, cv::COLOR_BGR2RGB);
    QImage qimg(img.data, img.cols, img.rows, img.step, QImage::Format_RGB888);
    QPixmap pixmap = QPixmap::fromImage(qimg);
    pixmap = pixmap.scaled(QSize(800, 600), Qt::KeepAspectRatio, Qt::SmoothTransformation);
    this->imageLabel->setPixmap(pixmap);
}