Dynamic image management on GUI



  • Hello, I am trying to develop an application that will process images. Users will add images in a batch (via file selection or camera feed) and click "start" to process the batch.

    I'm trying to make a GUI that displays the images the user has chosen, which will be an unknown amount. If the user wishes to remove the image, they have to click the image to be prompted to remove it.

    What I currently have will add frames to my grid, each containing a QLabel to hold the image.

    "ImagePreview.h"

    #pragma once
    
    #include <QLabel>
    
    class ImagePreview : public QLabel
    {
    	Q_OBJECT
    
    public:
    	explicit ImagePreview(const QString& text = "", QWidget* parent = 0);
    	~ImagePreview();
    	void addPix(QPixmap pix);
    
    signals:
    	void clicked();
    
    protected:
    	void mousePressEvent(QMouseEvent* event);
    
    };
    

    ImagePreview.cpp

    #include "ImagePreview.h"
    
    ImagePreview::ImagePreview(const QString& text, QWidget* parent)
    : QLabel(parent)
    {
    	setText(text);
    }
    
    ImagePreview::~ImagePreview()
    {
    }
    
    void ImagePreview::addPix(QPixmap pix)
    {
    	setPixmap(pix);
    }
    
    
    void ImagePreview::mousePressEvent(QMouseEvent* event)
    {
    	emit clicked();
    }
    
    

    main.h

    #include "ui_TISACompanion.h"
    #include <QString>
    #include "addNewPerson.h"
    #include <array>
    #include "ImagePreview.h"
    #include <QSignalMapper>
    
    
    class TISACompanion : public QMainWindow
    {
    	Q_OBJECT
    
    public:
    	TISACompanion(QWidget *parent = Q_NULLPTR);
    	~TISACompanion();
    
    	QWidget central{ this };
    	QGridLayout centralLayout{ &central };
    
    	std::array<QFrame, 10> frames;
    	std::array<ImagePreview, 10> imageViews;
    	std::array<QVBoxLayout, 10> layouts;
    
    	QSignalMapper *signalMapper = new QSignalMapper(this);
    
    private:
    	Ui::TISACompanionClass ui;
    
    public slots:
    	void removeItem(int);
    };
    

    main.cpp

    TISACompanion::TISACompanion(QWidget* parent)
    : QMainWindow(parent)
    {
    	ui.setupUi(this);
    	setCentralWidget(&central);
    
    //Populate frames
    	const int n = ceil(sqrt(10));
    	for (int i = 0; i < 10; ++i) {
    		frames[i].setFrameShape(QFrame::StyledPanel);
    		centralLayout.addWidget(&frames[i], i / n, i%n, 1, 1);
    	}
    //Prepare images
    	for (int i = 0; i < 10; ++i) {
    		QPixmap pix("./Pictures/myImage.jpg");
    		imageViews[i].addPix(pix);
    
    //Map our current index to the slot as a reference
    		QObject::connect(&imageViews[i], SIGNAL(clicked()), signalMapper, SLOT(map()));
    		signalMapper->setMapping(&imageViews[i], i);
    
    		//connect(&imageViews[i], SIGNAL(clicked()), this, SLOT(removeItem()));
    		QObject::connect(signalMapper, SIGNAL(mapped(int)), (&imageViews[i], SLOT(removeItem(int))));
    
    //images->layouts, layouts->frames
    		layouts[i].addWidget(&imageViews[i]);
    		frames[i].setLayout(&layouts[i]);
    	}
    
       void TISACompanion::removeItem(int index)
       {
    	 //To do
       }
    }
    

    I'm not particularly married to this strategy of adding images, so i'm open to changes. I'm struggling especially with the removal.

    Edit - SGaist priovided the perfect direction needed for my problem


  • Qt Champions 2016

    Hi
    If you thrown in a scrollarea
    http://doc.qt.io/qt-5/qscrollarea.html
    It could work ok.
    There is nothing inherently bad using labels but it might get heavy if you
    have too many.

    About removing.
    http://doc.qt.io/qt-5/qlayout.html#takeAt
    You must take back ownership from layout, then delete it.



  • How about using your own widget, use paintEvent() & use drawPixmap to draw the image. While removing you, you simply pass the null pixmap for redrawing. This way removal also will be easy stuff.


  • Lifetime Qt Champion

    Hi,

    Sounds rather like a good fit for the MVC pattern. You can use a QAbstractListModel to manage your list of images and a QListView to show them.



  • @SGaist Thanks for the suggestion! I will try :)


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.