How to put an image and a QProgressBar inside a QTableView? - c++

Question

I'm developing some kind of download manager and display the file name, it's size and the remaining bytes in a QTableView. Now I want to visualize the progress with a QProgressBar and display an image (to indicate whether it's an down- or upload). How can I add or display a QProgressBar and an image inside the QTableView?

Answer 1

If you are using QTableView, I presume you use a model linked to this view.
One solution would be to use delegates (see QItemDelegate) to paint the progress, In QItemDelegate::paint method you have to define, use QStyle of the widget (widget->style()) to paint the progress (use QStyle::drawControl with QStyle::CE_ProgressBarContents as control identifier).
Check the documentation from the example Star Delegate, to see how to define the delegate for the column you need.
Later edit: Example of defining the delegate paint method (code sketch, not really tested, take it as a principle, not fully working).
void MyDelegate::paint ( QPainter * painter, const QStyleOptionViewItem & option, const QModelIndex & index ) const
{
QStyleOptionProgressBar progressStyle;
progressStyle.rect = option.rect; // Maybe some other initialization from option would be needed
// For the sake of the example, I assume that the index indicates the progress, and the next two siblings indicate the min and max of the progress.
QModelIndex minIndex = index.sibling( index.row(), index.column() + 1);
QModelIndex maxIndex = index.sibling( index.row(), index.column() + 2);
progressStyle.minimum = qvariant_cast< int>( minIndex.data( Qt::UserRole));
progressStyle.maximum = qvariant_cast< int>( maxIndex.data( Qt::UserRole));
progressStyle.progress = qvariant_cast< int>( index.data( Qt::UserRole));
progressStyle.textVisible = false;
qApp->style()->drawControl( QStyle::CE_ProgressBarContents, progressStyleOption, painter);
}

Answer 2

TrackDelegate::TrackDelegate(QObject *parent)
: QItemDelegate(parent)
--------------------------------------------------------------------------------
void TrackDelegate::paint( QPainter* painter,
const QStyleOptionViewItem &option,
const QModelIndex &index) const
{
QStyleOptionViewItem viewOption(option);
QImage image(m_RowBackGroundImagePath);
QPixmap pixmap(m_RowBackGroundImagePath);
qDebug()<<"forward"<<pixmap.width()<<pixmap.height();
pixmap.scaled(option.rect.width(),option.rect.height());
qDebug()<<"back"<<pixmap.width()<<pixmap.height();
qDebug()<<option.rect.width()<<option.rect.height();
QBrush brush(pixmap);
painter->save();
painter->fillRect(option.rect, brush/*QColor(238, 233, 233, 255)*/);
painter->restore();
viewOption.rect = QRect(option.rect.x(), option.rect.y(), option.rect.width(), option.rect.height());
// viewOption.palette.setColor(QPalette::Text, QColor(Qt::red));
// viewOption.palette.setBrush ( QPalette::ButtonText, brush1);
QItemDelegate::paint(painter, viewOption,index);
int progress = index.model()->data(index,Qt::DisplayRole).toInt();
QStyleOptionProgressBar progressBarOption;
progressBarOption.rect = QRect(option.rect.x(), option.rect.y()+(SETHEIGHT - PROGRESSBARHEIGHT)/2, option.rect.width(), /*option.rect.height()*/PROGRESSBARHEIGHT);
//qDebug()<<progressBarOption.rect.x()<<progressBarOption.rect.y()<<progressBarOption.rect.height()<<progressBarOption.rect.width();
//qDebug()<<option.rect.x()<<option.rect.y()<<option.rect.height()<<option.rect.width();
progressBarOption.state |= QStyle::State_Enabled;
progressBarOption.direction = QApplication::layoutDirection();
progressBarOption.fontMetrics = QApplication::fontMetrics();
progressBarOption.minimum = 0;
progressBarOption.maximum = 100;
progressBarOption.textAlignment = Qt::AlignCenter;
progressBarOption.textVisible = true;
progressBarOption.progress = progress < 0 ? 0 : progress;
progressBarOption.text = QString().sprintf("%d%%", progressBarOption.progress);
QApplication::style()->drawControl(QStyle::CE_ProgressBar, &progressBarOption, painter);
break;
}

Answer 3

You probably want to use QTableWidget for this. It has a method which allows you to add widgets like a QProgressBar. It's the "setCellWidget" method.

Answer 4

There is a slot in QProgressBar called setValue(int),
You can update it sending a signal to this progress bar from Your file manager.
This one should be designed in a way it could check or monitor download state and sends those signals periodically.
Good approach to manage up/down/finish images would be to have additional column in table with the image item.
It would be quite easy to update your image if the socket/connection/file corrupt state would change.
Writing any example would be actually writing you a program, so i suggest to post parts of the problems (if any) with code performed by yourself.

Answer 5

QTableView is not for displaying widgets in a layout. Use QGridLayout or some other suitable layout and put the widgets in that layout.