Thumbnails using List Widget

[amarism]

I am making a Thumbnail using list widget. That store the bundle of an image. Now I want to display the image with a number just like If I add 5 images they display the number like 1 to 5.

[mrjj]

hi
Cant you just use the normal text for that ?
new QListWidgetItem(QIcon(":/xxx"), "the number")

or what is the question exactly ?

[amarism]

@mrjj I am using this code for the thumbnail

QPalette p;
	this->ui->m_ThumblistWidget->setViewMode(QListWidget::IconMode);
	this->ui->m_ThumblistWidget->setIconSize(QSize(100, 100));
	this->ui->m_ThumblistWidget->setResizeMode(QListWidget::Adjust);
	p.setBrush(QPalette::Window, Qt::transparent);
	this->ui->m_ThumblistWidget->setPalette(p);
	View>GenerateThumbList(this->ui->m_ThumblistWidget);

Also i need to dynamically assign the number in the image

[mrjj]

@amarism

on the full image or what you ?
or under each item in the widgetlist ?

[amarism]

@mrjjI am attaching the image reference

This one is my thumbnail of list widget containing the 6 image but initially numbering is not there but I want to display the numbering in place one red mark is or bottom of every image like (1,2,3......)

[mrjj]

@amarism
if you insert number as text when you create the
QListWidgetItem in GenerateThumbList
then it will show under each in list.

you can use
QString::number() to convert from int to number.

[VRonin]

Can you show us the content of GenerateThumbList?

[amarism]

@VRonin

[VRonin]

@amarism 😓 I meant the code

[amarism]

@VRonin for adding the image inside the listwidget
QPalette p;
this->ui->m_ThumblistWidget->setViewMode(QListWidget::IconMode);
this->ui->m_ThumblistWidget->setIconSize(QSize(100, 100));
this->ui->m_ThumblistWidget->setResizeMode(QListWidget::Adjust);
p.setBrush(QPalette::Window, Qt::transparent);
this->ui->m_ThumblistWidget->setPalette(p);
View->GenerateThumbList(this->ui->m_ThumblistWidget);

and i try to add numbering to every thumbnail image like this
for (int i = 1; i <= this->ui->m_ThumblistWidget->count(); i++) {
//this->ui->m_ThumblistWidget->addItem(new QListWidgetItem(NULL, i));
}

[VRonin]

What's inside View->GenerateThumbList(this->ui->m_ThumblistWidget);?

[amarism]

@VRonin generating the image in the form of thumbnails in view list

[VRonin]

generating the image in the form of thumbnails in view list

Can you show us the code that does that?

---

A bit in the dark here but this is wrong

for (int i = 1; i <= this->ui->m_ThumblistWidget->count(); i++) {
//this->ui->m_ThumblistWidget->addItem(new QListWidgetItem(NULL, i));
}

it overrides what's already there. Try this:

for (int i = 0, listCnt = ui->m_ThumblistWidget->count(); i < listCnt ; ++i) {
QAbstractItemModel* const model = ui->m_ThumblistWidget->model();
model->setData(model->index(i,0),i+1,Qt::EditRole);
}

[amarism]

@VRonin THIS ONE ALSO NOT WORKING
for (int i = 0, listCnt = ui->m_ThumblistWidget->count(); i < listCnt ; ++i) {
QAbstractItemModel* const model = ui->m_ThumblistWidget->model();
model->setData(model->index(i,0),i+1,Qt::EditRole);
}

[KillerSmath]

@amarism

If you need to insert a text in the thumbnail, you must to use an QPainter and add a Text on Image

Example:

#include <QPainter>
#include <QImage>
#include <QFont>
#include <QPen>
#include <QString>

 ...

    QImage img(<image path>); // load image

    int number = 15;

    QPainter painter(&img); // Pass QImage to Editor
    painter.setPen(QPen(Qt::white));
    painter.setFont(QFont("Arial", 15, QFont::Bold));

    painter.drawText(img.rect(), Qt::AlignCenter, QString::number(number)); // insert number on center of image

   // insertImageToTable(img)

[amarism]

@KillerSmath In the QImage img(<load image>).
I have the series of image. can I load it

[VRonin]

Ok... let's see if an easy example helps:

#include <QApplication>
#include <QStyledItemDelegate>
#include <QListWidget>
class ImageDelegate : public QStyledItemDelegate{
    Q_DISABLE_COPY(ImageDelegate)
public:
    explicit ImageDelegate(QObject* parent = Q_NULLPTR)
        :QStyledItemDelegate(parent)
    {}
    void paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const Q_DECL_OVERRIDE{
        Q_ASSERT(index.isValid());
        QStyleOptionViewItem opt = option;
        initStyleOption(&opt, index);
        QStyle *style = option.widget ? option.widget->style() : QApplication::style();
        QPixmap backPix = index.data(Qt::DecorationRole).value<QPixmap>();
        if(!backPix.isNull())
            style->drawItemPixmap(painter,option.rect,Qt::AlignCenter,backPix.scaled(option.rect.size()));
        style->drawItemText(painter,option.rect,Qt::AlignBottom | Qt::AlignRight,option.palette,option.state & QStyle::State_Enabled,index.data(Qt::EditRole).toString());
    }
};

int main(int argc, char *argv[])
{
    QApplication application(argc, argv);
    QListWidget wid;
    wid.setItemDelegate(new ImageDelegate(&wid));
    QAbstractItemModel* const model= wid.model();
    model->insertRows(0,5);
    QPixmap tempPix(30,30);
    const Qt::GlobalColor colors[] = {Qt::yellow,Qt::magenta,Qt::cyan,Qt::green,Qt::blue};
    for(int i=0;i<wid.count();++i){
        tempPix.fill(colors[i]);
        model->setData(model->index(i,0),tempPix,Qt::DecorationRole);
        model->setData(model->index(i,0),i+1,Qt::EditRole);
    }
    wid.show();
    return application.exec();
}