PyQT5开发之网格化显示多张图像

PyQT5开发案例之简易图像浏览器

import os

from PyQt5 import QtWidgets, QtCore, QtGui
import sys


class ImageBrowserPanel(QtWidgets.QWidget):
    def __init__(self, parent=None):
        super().__init__(parent)
        self.image_files = []
        self.current_index = -1
        self.grid_labels = []
        # 文本标签
        self.pathLabel = QtWidgets.QLabel()
        self.pathLabel.setText("文件名称: test.png")
        self.pathLabel.setStyleSheet("background-color:deeppink; color: blue; border-radius:5px")
        self.pathLabel.setAlignment(QtCore.Qt.AlignCenter)
        # 图像总数
        self.numLabel = QtWidgets.QLabel()
        self.numLabel.setText("图像总数: 0")
        self.pathLabel.setStyleSheet("background-color:deeppink; color: blue; border-radius:5px")
        self.numLabel.setAlignment(QtCore.Qt.AlignCenter)

        fileBtn = QtWidgets.QPushButton("选择...")
        hbox_layout = QtWidgets.QHBoxLayout()
        hbox_layout.addWidget(self.pathLabel)
        hbox_layout.addWidget(self.numLabel)
        hbox_layout.addWidget(fileBtn)
        hbox_layout.addStretch(1)
        panel1 = QtWidgets.QGroupBox("图像信息")
        panel1.setLayout(hbox_layout)

        # 图像标签
        panel3 = QtWidgets.QWidget()
        grid_layout = QtWidgets.QGridLayout()
        for i in range(9):
            item_label = QtWidgets.QLabel()
            item_label.setStyleSheet("background-color:royalblue; border-radius:5px")
            pixmap = QtGui.QPixmap("test3.png")
            pix = pixmap.scaled(QtCore.QSize(210, 160), QtCore.Qt.KeepAspectRatio)
            item_label.setPixmap(pix)
            item_label.setAlignment(QtCore.Qt.AlignCenter)
            grid_layout.addWidget(item_label, int(i/3), int(i%3))
            self.grid_labels.append(item_label)
        panel3.setLayout(grid_layout)

        # 添加到布局管理器中
        vbox_layout = QtWidgets.QVBoxLayout()
        vbox_layout.addWidget(panel1)
        vbox_layout.addWidget(panel3)
        vbox_layout.addStretch(1)

        # 面板容器
        self.setLayout(vbox_layout)

        # setup listener
        fileBtn.clicked.connect(self.on_select_image_dir)

    def on_select_image_dir(self):
        img_dir = QtWidgets.QFileDialog.getExistingDirectory(self, "图像文件夹", ".")
        files = os.listdir(img_dir)
        self.image_files.clear()
        self.current_index = -1
        for f in files:
            if f.endswith(".png") or f.endswith(".jpg") or f.endswith(".bmp"):
                self.image_files.append(os.path.join(img_dir, f))
        if len(self.image_files) > 0:
            self.current_index = 0
            self.numLabel.setText("图像总数: " + str(len(self.image_files)))
            for im_file in self.image_files:
                pixmap = QtGui.QPixmap(im_file)
                pix = pixmap.scaled(QtCore.QSize(210, 160), QtCore.Qt.KeepAspectRatio)
                self.grid_labels[self.current_index % 9].setPixmap(pix)
                self.current_index = self.current_index + 1

本文主要是演示了PyQT5网格布局使用，同时结合多个QLabel，显示更新多张图像。实现了图像的网格化显示预览功能。

扫码关注

OpenCV开发者联盟，

专注各种语言的OpenCV开发教程分享

OpenCV周边开发技术应用！

扫码查看OpenCV+OpenVIO+Pytorch系统化学习路线图