Custom ItemDelegate for QListView State_Selected - qt

I created CustomItemDelegate from QStyledItemDelegate and i'm using the paint() method to give a better look to my QListView.
If I click on an item, option.state never has State_Selected, why is that?
I have a selection model, single, row, and the selection rectangle is visible.
qDebug only prints out these:
QStyle::State( "Active | Enabled" )
QStyle::State( "Active | Enabled | MouseOver" )
void SyrupItemDelegate::paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const
{
QRect rect = option.rect;
qDebug() << option.state;
if (option.state & QStyle::State_Selected)
{
painter->drawRoundedRect(option.rect,5,5);
painter->setPen(QPen(QPalette::HighlightedText ) );
if (option.state & QStyle::State_Active)
{
painter->setBrush(QBrush(QPalette().highlight()));
} else
{
//painter->setBrush(QBrush(QPalette().color(QPalette::Inactive,
//QPalette::Highlight)));
QLinearGradient gradient(0, 0, 0, 100);
gradient.setColorAt(0.0, QColor(0,0,230));
gradient.setColorAt(1.0, QColor(250,250,250));
painter->setBrush(gradient);
}
} else
painter->setPen(QPen(QPalette::Text));
if ( !index.isValid() )
return;
int row = index.row();
// painter->save();
// painter->setRenderHint(QPainter::Antialiasing,true);
QString res = index.sibling(row,SyrupsSQLModel::SYRUP_NM_COL_INDEX).data().toString();
QRectF rc(rect);
rc.setTop(rc.top()+ PADDING);
rc.setLeft(rc.left()+ 2* PADDING + IMG_WIDTH);
QFont font = option.font;
font.setPointSize(font.pointSize()+4);
painter->setFont(font);
painter->drawText(rc,res);
res = index.sibling(row,SyrupsSQLModel::SYRUP_GRP_COL_INDEX).data().toString().toLower();
rc.setTop(rect.top()+PADDING );
rc.setLeft(rect.left()+PADDING );
painter->drawPixmap(rc.topLeft(),QIcon(":/prodgrp/"+res).pixmap(QSize(IMG_WIDTH,IMG_HEIGHT)));
//SyrupsSQLModel::FORMULA_COL_INDEX:
//SyrupsSQLModel::SYRUP_ID_COL_INDEX:
//Painter->restore();
}
I'm using Qt 5.0.2 32bit (Win).

The problem was in the delegate class I reimplemented editorEvent() function badly. I commented out that sections and it works.

Related

Wrong rich text height (QTextDocument) in item rendered by custom item delegate [Qt]

I have a problem with the text height of a QTextDocument in my tree views item delegate.
My paint() and sizeHint() methods are almost exactly the same, but calculate different height of the text (the same text).
The difference of height varies depending on the font. If everything is written in one size, then the height is correct, but if I use different sizes, the heights doesn't match.
I read a topic about using font metrics, or calcuating the font height form paiter.boundingRect, but I don't know how to use this in a QTextDocument.
I thought that the problem is with the font, so I changed the font globaly to one with the code below. It didn't help.
//in main():
QFont font("MS Shell Dlg 2",8.25,50);
font.setPointSizeF(8.25);
QApplication::setFont(font);
My code in my custom itemDelegate is:
QSize MyItemDelegate::sizeHint(const QStyleOptionViewItem &option, const QModelIndex &index) const
{
QStyleOptionViewItem options = option;
initStyleOption(&options, index);
int scrollBarrWidth = -2;
if(scrollBarVisible){
scrollBarrWidth = 10; //options.widget->style()->pixelMetric(QStyle::PM_ScrollBarExtent);
}
int checkboxWidth = 0;
if(checkboxesForConferenceActive){
checkboxWidth = 18;
}
QRect rectLeft(checkboxWidth,0,26,26);
QRect rectRight((options.widget->rect().right()-30-scrollBarrWidth),0,26,26);
QRect rectCenter((rectLeft.right()+5),-2,(options.widget->rect().width()-(rectLeft.width()+rectRight.width()+scrollBarrWidth+checkboxWidth+8+4)),26);
QRect boundingRect;
QString nameText(index.data(Qt::UserRole).toString());
QString extNoText(index.data(Qt::UserRole+1).toString());
QString phoneText(index.data(Qt::UserRole+100).toString());
QTextDocument textDoc;
textDoc.setDefaultFont(options.font);
textDoc.setTextWidth(rectCenter.width());
textDoc.setDocumentMargin(0);
QTextCursor textCursor(&textDoc);
QString wholeText("");
QImage statusIcon(*icoChooser->choseCustomStateImageForSubscriber(index.data(Qt::UserRole+12).toInt()));
bool wczytajfote = !statusIcon.isNull();
wholeText.append("<b>");
wholeText.append(nameText);
wholeText.append("</b>");
textCursor.insertHtml(wholeText);
if(wczytajfote){
textCursor.movePosition(QTextCursor::EndOfLine, QTextCursor::MoveAnchor);
textCursor.insertImage(statusIcon.scaledToWidth(12));
textCursor.movePosition(QTextCursor::End, QTextCursor::MoveAnchor);
} else {
textCursor.insertHtml("&nbsp");
}
wholeText.clear();
if(!extNoText.isEmpty()){
wholeText.append("<font color = #005c99>");
wholeText.append(QString(" ("+extNoText+") "));
wholeText.append("</font>");
wholeText.append("<br><font style=\"font-size:10px; color: #6d6d78\">");
wholeText.append(index.data(Qt::UserRole+4).toString());
wholeText.append("</font>");
textCursor.insertHtml(wholeText);
if(textDoc.idealWidth() < rectCenter.width() ){
QRect clip(0,0,textDoc.idealWidth(), textDoc.size().height());
return QSize(textDoc.idealWidth(), textDoc.size().height()+4);
} else {
QRect clip(0,0,textDoc.idealWidth(), textDoc.size().height());
return QSize(textDoc.idealWidth(), textDoc.size().height()+4);
}
} else {
wholeText.append("<br>");
wholeText.append("<font size = 2 color = #005c99>");
wholeText.append(QString(" ("+phoneText+") "));
wholeText.append("</font>");
textCursor.insertHtml(wholeText);
QRect clip(0,0,textDoc.idealWidth(), textDoc.size().height());
return QSize(textDoc.idealWidth(), textDoc.size().height()+6);
}
}
and the paint method is almost exactly the same.
void MyItemDelegate::paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const
{
QStyleOptionViewItem options = option;
initStyleOption(&options, index);
painter->save();
painter->setRenderHint(QPainter::Antialiasing, true);
painter->setRenderHint(QPainter::SmoothPixmapTransform, true);
painter->setRenderHint(QPainter::TextAntialiasing, true);
options.text = "";
int scrollBarrWidth = -2;
if(scrollBarVisible){
scrollBarrWidth = 10; //options.widget->style()->pixelMetric(QStyle::PM_ScrollBarExtent);
}
int checkboxWidth = 0;
if(checkboxesForConferenceActive){
checkboxWidth = 18;
}
QRect rectLeft(checkboxWidth,0,26,26);
QRect rectRight((options.widget->rect().right()-30-scrollBarrWidth),0,26,26); //obliczam na podstawie prostokąta, który jest przed nim i który ma dynamicznie ustawiane wymiary
QRect rectCenter((rectLeft.right()+5),-2,(options.widget->rect().width()-(rectLeft.width()+rectRight.width()+scrollBarrWidth+checkboxWidth+8+4)),26); //obliczam prostokąt na podstawie wcześniejszego prostokąta i prostokąta wymiarów okna
QRect boundingRect;
QString nameText(index.data(Qt::UserRole).toString());
QString extNoText(index.data(Qt::UserRole+1).toString());
QString phoneText(index.data(Qt::UserRole+100).toString());
painter->translate(options.widget->rect().left(), options.rect.top());
QTextDocument textDoc;
textDoc.setTextWidth(rectCenter.width());
QTextCursor textCursor(&textDoc);
QString wholeText("");
QImage statusIcon(*icoChooser->choseCustomStateImageForSubscriber(index.data(Qt::UserRole+12).toInt()));
bool wczytajfote = !statusIcon.isNull();
wholeText.append("<b>");
wholeText.append(nameText);
wholeText.append("</b>");
textCursor.insertHtml(wholeText);
if(wczytajfote){
textCursor.movePosition(QTextCursor::EndOfLine, QTextCursor::MoveAnchor);
textCursor.insertImage(statusIcon.scaledToWidth(12));
textCursor.movePosition(QTextCursor::End, QTextCursor::MoveAnchor);
} else {
textCursor.insertHtml("&nbsp");
}
wholeText.clear();
if(!extNoText.isEmpty()){
wholeText.append("<font size = 2 color = #005c99>");
wholeText.append(QString(" ("+extNoText+") "));
wholeText.append("</font>");
wholeText.append("<br><font style=\"font-size:10px; color: #6d6d78\">");
wholeText.append(index.data(Qt::UserRole+4).toString());
wholeText.append("</font>");
} else {
wholeText.append("<br>");
wholeText.append("<font size = 2 color = #005c99>");
wholeText.append(QString(" ("+phoneText+") "));
wholeText.append("</font>");
}
textCursor.insertHtml(wholeText);
painter->translate(rectCenter.left(), rectCenter.top());
QRect clip(0,0,textDoc.size().width(), textDoc.size().height());
textDoc.drawContents(painter, clip);
painter->restore();
}
}
The text in sizeHint is used to determine the item height, so now it looks like the pic below:
I'm using Qt 5.7.1 MSVC 2015 64 bit on windows, but the problem is the same on Ubuntu 16.04 with gcc.
(Posted on behalf of the asker)
It turned out to be my fault all along.
The following line responsible in the sizeHint() method was responsible:
textDoc.setDocumentMargin(0);

QStyledItemDelegate: how to make checkbox button to change its state on click

I have a delegate MyDelegate which is used for QListWidget. The delegate is derived from QStyledItemDelegate. One of the goals of MyDelegate is to place a checkbox button on each row of ListWidget. It is done within the paint() event of MyDelegate:
void MyDelegate::paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const
{
QStyledItemDelegate::paint(painter, option, index);
// ... drawing other delegate elements
QStyleOptionButton checkbox;
// setting up checkbox's size and position
// now draw the checkbox
QApplication::style()->drawControl(QStyle::CE_CheckBox, &checkbox, painter);
}
At first I thought the checkbox would automatically change its state on click, since I specified QStyle::CE_CheckBox. But it is not the case. Looks like I have to specify the checkbox visual behavior manually.
Data-wise, When user clicks on that checkbox, certain signal is emitted and the scene data is changed. I perform this action in editorEvent():
bool MyDelegate::editorEvent(QEvent *event, QAbstractItemModel *model, const QStyleOptionViewItem &option, const QModelIndex &index)
{
if (event->type() == QEvent::MouseButtonRelease) {
if (/* within checkbox area */)
emit this->clickedCheckbox(index);
}
}
The backend part works. However, I cannot figure out how to make the checkbox button to change its visual state from checked to unchecked, and backwards.
I realized that I can change the checkbox state manually by doing something like this from paint():
checkbox.state = someCondition? (QStyle::State_Enabled | QStyle::State_On) :
(QStyle::State_Enabled | QStyle::State_Off) ;
QStyle::State_On/Off does the trick of manual checkbox state change.
But I do not know how to set up that someCondition and where I should set it up. I tried to introduce it as a private bool variable which would be set in editorEvent() when the checkbox area gets a click, however, it does not produce the desired behavior: it sets all the other checkboxes of ListWidget to the same visual state. So, it behaved like some global condition for all the checkboxes.
I feel like, to accomplish my task, I have to re-implement the button and make it to change the checkbox state on click. But I'm lost on this way and not sure how to approach the problem. From the QStyleOptionButton API I do not see a clicked() or any other method I could use.
So, the question is: how do I make checkbox to behave like a checkbox, visually? If I need to re-implement a checkbox, then what class do I inherit?
You can set some value that describes your checkbox state in MyDelegate::editorEvent and then use it to paint a proper checkbox:
const int CHECK_ROLE = Qt::UserRole + 1;
bool MyDelegate::editorEvent(QEvent *event,
QAbstractItemModel *model,
const QStyleOptionViewItem &option,
const QModelIndex &index)
{
if (event->type() == QEvent::MouseButtonRelease)
{
bool value = index.data(CHECK_ROLE).toBool();
// invert checkbox state
model->setData(index, !value, CHECK_ROLE);
return true;
}
return QStyledItemDelegate::editorEvent(event, model, option, index);
}
void MyDelegate::paint(QPainter *painter,
const QStyleOptionViewItem &option,
const QModelIndex &index) const
{
QStyleOptionButton cbOpt;
cbOpt.rect = option.rect;
bool isChecked = index.data(CHECK_ROLE).toBool();
if (isChecked)
{
cbOpt.state |= QStyle::State_On;
}
else
{
cbOpt.state |= QStyle::State_Off;
}
QApplication::style()->drawControl(QStyle::CE_CheckBox, &cbOpt, painter);
}
I added the following:
data(Qt:CheckStateRole) is toggled.
enable/disable the item.
center the box in the cell.
only toggle checkmark with left mouse button, and when checkmark is clicked (not the entire cell).
Here's the code:
// -------------------------------- //
class GFQtCheckboxItemDelegate : public QStyledItemDelegate
{
Q_OBJECT
public:
const int CHECK_ROLE = Qt::CheckStateRole;
// dont't let the default QStyledItemDelegate create the true/false combobox
QWidget* createEditor(QWidget *parent, const QStyleOptionViewItem &option, const QModelIndex &index) const Q_DECL_OVERRIDE
{
(void)parent;
(void)option;
(void)index;
return nullptr;
}
QRect GetCheckboxRect(const QStyleOptionViewItem &option)const
{
QStyleOptionButton opt_button;
opt_button.QStyleOption::operator=(option);
QRect sz = QApplication::style()->subElementRect(QStyle::SE_ViewItemCheckIndicator, &opt_button);
QRect r = option.rect;
// center 'sz' within 'r'
int dx = (r.width() - sz.width())/2;
int dy = (r.height()- sz.height())/2;
r.setTopLeft(r.topLeft() + QPoint(dx,dy));
r.setWidth(sz.width());
r.setHeight(sz.height());
return r;
}
// click event
bool editorEvent(QEvent *event, QAbstractItemModel *model, const QStyleOptionViewItem &option, const QModelIndex &index)
{
if (event->type() == QEvent::MouseButtonRelease)
{
QMouseEvent* pME = static_cast<QMouseEvent*>(event);
if(pME->button() == Qt::LeftButton)
{
QRect ro = GetCheckboxRect(option);
QPoint pte = pME->pos();
if(ro.contains(pte) )
{
bool value = index.data( CHECK_ROLE).toBool();
// invert checkbox state
model->setData(index, !value, CHECK_ROLE);
return true;
}
}
}
return QStyledItemDelegate::editorEvent(event, model, option, index);
}
void paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const
{
QStyleOptionButton cbOpt;
cbOpt.rect = GetCheckboxRect(option);
bool isChecked = index.data(CHECK_ROLE ).toBool();
if (isChecked)
{
cbOpt.state |= QStyle::State_On;
}
else
{
cbOpt.state |= QStyle::State_Off;
}
QVariant enabled = index.data(Qt::ItemIsEnabled);
if(enabled.isNull() || enabled.toBool() )
{
cbOpt.state |= QStyle::State_Enabled;
}
QApplication::style()->drawControl(QStyle::CE_CheckBox, &cbOpt, painter);
}
};
And for completeness, here's how to apply it:
m_p_QTableView->setItemDelegateForColumn(iTableColumnIndex, new GFQtCheckboxItemDelegate() );
...
bool yesno ...;
pGrid->setData(index, yesno, Qt::CheckStateRole);
qtqcheckboxqtableview
This is much easier if you change the QListWidget to a QListModel and a QListView.
Qt::ItemFlags ListModel::flags(const QModelIndex &index) const
{
return QAbstractListModel::flags(index) | Qt::ItemIsUserCheckable;
}
QVariant ListModel::data(const QModelIndex &index, int role) const
{
if (role == Qt::EditRole) {
return m_checkStateForRow[index.row()];
}
}
bool ListModel::setData(const QModelIndex &index, const QVariant &value, int role)
{
if (role == Qt::CheckStateRole) {
m_checkStateForRow[index.row()] = value.toInt();
emit dataChanged(index, index, {role});
return true;
}
return false;
}

QTextDocument in QAbstractItemDelegate paint method

I have a class which inherits QAbstractItemDelegate and I use QTextDocument inside the paint() method. My model contains two items, but when I run my qt application, the items are drawn in the first item of QListView.
CODE
void ProductItemDelegate::paint(QPainter *painter, const QStyleOptionViewItem &option,
const QModelIndex &index) const
{
bool selected = (option.state & QStyle::State_Selected) == QStyle::State_Selected;
if (selected)
{
painter->fillRect(option.rect, option.palette.highlight());
}
painter->save();
painter->setRenderHint(QPainter::Antialiasing, true);
if (selected)
{
painter->setPen(option.palette.highlightedText().color());
}
else
{
painter->setPen(option.palette.text().color());
}
mTextDocument.drawContents(painter);
painter->restore();
}
QSize ProductItemDelegate::sizeHint(const QStyleOptionViewItem &option,
const QModelIndex &index) const
{
MyItem *myItem = index.data(Qt::UserRole + 1).value<MyItem *>();
mTextDocument->clear();
mTextDocument->setDefaultFont(option.font);
mTextDocument->setPageSize(QSizeF(option.rect.width(), -1));
QTextCursor cursor = QTextCursor(mTextDocument);
QVector<QTextLength> columnConstraints;
columnConstraints << QTextLength(QTextLength::PercentageLength, 60);
columnConstraints << QTextLength(QTextLength::PercentageLength, 30);
columnConstraints << QTextLength(QTextLength::PercentageLength, 10);
QTextTableFormat tableFormat;
tableFormat.setBorder(1);
tableFormat.setBorderBrush(QBrush(Qt::black));
tableFormat.setColumnWidthConstraints(columnConstraints);
QTextTable *table = cursor.insertTable(2, 3, tableFormat);
table->mergeCells(0, 0, 1, 3);
QTextCursor cellCursor;
QTextTableCell cell00 = table->cellAt(0, 0);
cellCursor = cell00.firstCursorPosition();
cellCursor.insertText(myItem->name());
QTextTableCell cell10 = table->cellAt(1, 0);
cellCursor = cell10.firstCursorPosition();
cellCursor.insertText(myItem->text1());
QTextTableCell cell11 = table->cellAt(1, 1);
cellCursor = cell11.firstCursorPosition();
cellCursor.insertText(myItem->text2());
return mTextDocument->size().toSize();
}
These are the result of the code above.
The item was not drawn in second entry.
Both items are painted in the first entry.
You should place your painter to the right spot before painting with it.
After the first painter->save() add :
painter->resetTransform();
painter->translate(option.rect.topLeft());

Using a QStyledItemDelegate on a QListView with QSqlQueryModel

I have a QListView, that has a QSqlQueryModel set as its model. How can I use a QStyledItemDelegate in order to customise the QListView's rows' appearence (e.g. show 2 text lines) ?
QSqlDatabase db = QSqlDatabase::addDatabase( "QSQLITE" );
db.setDatabaseName( "test.db" );
if( !db.open() )
{
qDebug() << db.lastError();
qFatal( "Failed to connect." );
}
qDebug( "Connected!" );
QSqlQueryModel *sqlModel = new QSqlQueryModel;
sqlModel->setQuery("SELECT * FROM entries");
mListWidget->setModel(sqlModel);
Essentially, what I think I need to do is to somehow "match" roles to db table's fields, in order to be able to get the data from the QStyledItemDelegate, using something like this:
void ListViewDelegate::paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const
{
[...]
QString headerText = qvariant_cast<QString>(index.data(headerRole));
QString subText = qvariant_cast<QString>(index.data(subHeaderRole));
[...]
}
Thanks!
You certainly can use QStyledItemDelegate for custom item drawing. QModelIndex has a reference to the model object which you can use to get "entries" record fields. You also have to redefine model's sizeHint method to increase items size if you need to show more data then a single data. Other then that it's more or less trivial.
Pls, see if an example below would work you:
class ListViewDelegate : public QStyledItemDelegate
{
protected:
void paint(QPainter* painter, const QStyleOptionViewItem& option, const QModelIndex& index) const
{
QStyleOptionViewItemV4 opt = option;
initStyleOption(&opt, index);
QString line0 = index.model()->data(index.model()->index(index.row(), 1)).toString();
QString line1 = index.model()->data(index.model()->index(index.row(), 2)).toString();
// draw correct background
opt.text = "";
QStyle *style = opt.widget ? opt.widget->style() : QApplication::style();
style->drawControl(QStyle::CE_ItemViewItem, &opt, painter, opt.widget);
QRect rect = opt.rect;
QPalette::ColorGroup cg = opt.state & QStyle::State_Enabled ? QPalette::Normal : QPalette::Disabled;
if (cg == QPalette::Normal && !(opt.state & QStyle::State_Active))
cg = QPalette::Inactive;
// set pen color
if (opt.state & QStyle::State_Selected)
painter->setPen(opt.palette.color(cg, QPalette::HighlightedText));
else
painter->setPen(opt.palette.color(cg, QPalette::Text));
// draw 2 lines of text
painter->drawText(QRect(rect.left(), rect.top(), rect.width(), rect.height()/2),
opt.displayAlignment, line0);
painter->drawText(QRect(rect.left(), rect.top()+rect.height()/2, rect.width(), rect.height()/2),
opt.displayAlignment, line1);
}
QSize sizeHint(const QStyleOptionViewItem & option, const QModelIndex & index ) const
{
QSize result = QStyledItemDelegate::sizeHint(option, index);
result.setHeight(result.height()*2);
return result;
}
};
The test database set is defined here:
QSqlError initDb()
{
QSqlDatabase db = QSqlDatabase::addDatabase("QSQLITE");
db.setDatabaseName(":memory:");
if (!db.open())
return db.lastError();
QStringList tables = db.tables();
if (tables.contains("test", Qt::CaseInsensitive))
return QSqlError();
QSqlQuery q;
if (!q.exec(QLatin1String("create table entries(id integer primary key, first_line varchar, second_line varchar)")))
return q.lastError();
q.exec("insert into entries(id, first_line, second_line) values(0, 'first line 0', 'second line 0')");
q.exec("insert into entries(id, first_line, second_line) values(1, 'first line 1', 'second line 1')");
q.exec("insert into entries(id, first_line, second_line) values(2, 'first line 2', 'second line 2')");
return QSqlError();
}
model and listview definition:
initDb();
QSqlQueryModel *sqlModel = new QSqlQueryModel();
sqlModel->setQuery("SELECT * FROM entries");
ui->listView->setModel(sqlModel);
ui->listView->setItemDelegate(new ListViewDelegate());
hope this helps, regards

How to make item view render rich (html) text in Qt

Suppose my model has items with the following string for Qt::DisplayRole
<span>blah-blah <b>some text</b> other blah</span>
I want QTreeView (actually, any item view) to render it like a rich text. Instead, item views render it like a pure text by default. How to achieve the desired rendering?
Actually, this is a search results model. User enters a text, some document is searched against that text and the user is presented with search results, where the words being searched should be bolder than surrounding text.
I guess you can use setItemDelegate method of the treeview to setup custom painter for your treeview items. In the delegate's paint method you can use QTextDocument to load item's text as html and render it. Please check if an example below would work for you:
treeview initialization:
...
// create simple model for a tree view
QStandardItemModel *model = new QStandardItemModel();
QModelIndex parentItem;
for (int i = 0; i < 4; ++i)
{
parentItem = model->index(0, 0, parentItem);
model->insertRows(0, 1, parentItem);
model->insertColumns(0, 1, parentItem);
QModelIndex index = model->index(0, 0, parentItem);
model->setData(index, "<span>blah-blah <b>some text</b> other blah</span>");
}
// create custom delegate
HTMLDelegate* delegate = new HTMLDelegate();
// set model and delegate to the treeview object
ui->treeView->setModel(model);
ui->treeView->setItemDelegate(delegate);
...
custom delegate implementation
class HTMLDelegate : public QStyledItemDelegate
{
protected:
void paint ( QPainter * painter, const QStyleOptionViewItem & option, const QModelIndex & index ) const;
QSize sizeHint ( const QStyleOptionViewItem & option, const QModelIndex & index ) const;
};
void HTMLDelegate::paint(QPainter* painter, const QStyleOptionViewItem & option, const QModelIndex &index) const
{
QStyleOptionViewItemV4 options = option;
initStyleOption(&options, index);
painter->save();
QTextDocument doc;
doc.setHtml(options.text);
options.text = "";
options.widget->style()->drawControl(QStyle::CE_ItemViewItem, &options, painter);
painter->translate(options.rect.left(), options.rect.top());
QRect clip(0, 0, options.rect.width(), options.rect.height());
doc.drawContents(painter, clip);
painter->restore();
}
QSize HTMLDelegate::sizeHint ( const QStyleOptionViewItem & option, const QModelIndex & index ) const
{
QStyleOptionViewItemV4 options = option;
initStyleOption(&options, index);
QTextDocument doc;
doc.setHtml(options.text);
doc.setTextWidth(options.rect.width());
return QSize(doc.idealWidth(), doc.size().height());
}
hope this helps, regards
update0: changes to HTMLDelegate to make icons visible and different pen color for selected items
void HTMLDelegate::paint(QPainter* painter, const QStyleOptionViewItem & option, const QModelIndex &index) const
{
QStyleOptionViewItemV4 options = option;
initStyleOption(&options, index);
painter->save();
QTextDocument doc;
doc.setHtml(options.text);
options.text = "";
options.widget->style()->drawControl(QStyle::CE_ItemViewItem, &options, painter);
// shift text right to make icon visible
QSize iconSize = options.icon.actualSize(options.rect.size());
painter->translate(options.rect.left()+iconSize.width(), options.rect.top());
QRect clip(0, 0, options.rect.width()+iconSize.width(), options.rect.height());
//doc.drawContents(painter, clip);
painter->setClipRect(clip);
QAbstractTextDocumentLayout::PaintContext ctx;
// set text color to red for selected item
if (option.state & QStyle::State_Selected)
ctx.palette.setColor(QPalette::Text, QColor("red"));
ctx.clip = clip;
doc.documentLayout()->draw(painter, ctx);
painter->restore();
}
My answer is mostly inspired by #serge_gubenko's one. However, there were made several improvements so that the code is finally useful in my application.
class HtmlDelegate : public QStyledItemDelegate
{
protected:
void paint ( QPainter * painter, const QStyleOptionViewItem & option, const QModelIndex & index ) const;
QSize sizeHint ( const QStyleOptionViewItem & option, const QModelIndex & index ) const;
};
void HtmlDelegate::paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const
{
QStyleOptionViewItemV4 optionV4 = option;
initStyleOption(&optionV4, index);
QStyle *style = optionV4.widget? optionV4.widget->style() : QApplication::style();
QTextDocument doc;
doc.setHtml(optionV4.text);
/// Painting item without text
optionV4.text = QString();
style->drawControl(QStyle::CE_ItemViewItem, &optionV4, painter);
QAbstractTextDocumentLayout::PaintContext ctx;
// Highlighting text if item is selected
if (optionV4.state & QStyle::State_Selected)
ctx.palette.setColor(QPalette::Text, optionV4.palette.color(QPalette::Active, QPalette::HighlightedText));
QRect textRect = style->subElementRect(QStyle::SE_ItemViewItemText, &optionV4);
painter->save();
painter->translate(textRect.topLeft());
painter->setClipRect(textRect.translated(-textRect.topLeft()));
doc.documentLayout()->draw(painter, ctx);
painter->restore();
}
QSize HtmlDelegate::sizeHint(const QStyleOptionViewItem &option, const QModelIndex &index) const
{
QStyleOptionViewItemV4 optionV4 = option;
initStyleOption(&optionV4, index);
QTextDocument doc;
doc.setHtml(optionV4.text);
doc.setTextWidth(optionV4.rect.width());
return QSize(doc.idealWidth(), doc.size().height());
}
Here's the PyQt conversion of the combination of the above answers that worked for me. I would expect this to work virtually identically for PySide as well.
from PyQt4 import QtCore, QtGui
class HTMLDelegate(QtGui.QStyledItemDelegate):
def paint(self, painter, option, index):
options = QtGui.QStyleOptionViewItemV4(option)
self.initStyleOption(options,index)
style = QtGui.QApplication.style() if options.widget is None else options.widget.style()
doc = QtGui.QTextDocument()
doc.setHtml(options.text)
options.text = ""
style.drawControl(QtGui.QStyle.CE_ItemViewItem, options, painter);
ctx = QtGui.QAbstractTextDocumentLayout.PaintContext()
# Highlighting text if item is selected
#if (optionV4.state & QStyle::State_Selected)
#ctx.palette.setColor(QPalette::Text, optionV4.palette.color(QPalette::Active, QPalette::HighlightedText));
textRect = style.subElementRect(QtGui.QStyle.SE_ItemViewItemText, options)
painter.save()
painter.translate(textRect.topLeft())
painter.setClipRect(textRect.translated(-textRect.topLeft()))
doc.documentLayout().draw(painter, ctx)
painter.restore()
def sizeHint(self, option, index):
options = QtGui.QStyleOptionViewItemV4(option)
self.initStyleOption(options,index)
doc = QtGui.QTextDocument()
doc.setHtml(options.text)
doc.setTextWidth(options.rect.width())
return QtCore.QSize(doc.idealWidth(), doc.size().height())
This one is in PySide. Rather than doing a lot of custom drawing, I pass the QPainter to the QLabel and make it draw itself. Highlighting code borrowed from other answers.
from PySide import QtGui
class TaskDelegate(QtGui.QItemDelegate):
#https://doc.qt.io/archives/qt-4.7/qitemdelegate.html#drawDisplay
#https://doc.qt.io/archives/qt-4.7/qwidget.html#render
def drawDisplay(self, painter, option, rect, text):
label = QtGui.QLabel(text)
if option.state & QtGui.QStyle.State_Selected:
p = option.palette
p.setColor(QtGui.QPalette.WindowText, p.color(QtGui.QPalette.Active, QtGui.QPalette.HighlightedText))
label.setPalette(p)
label.render(painter, rect.topLeft(), renderFlags=QtGui.QWidget.DrawChildren)
Writing up yet another answer for how this can be done in C++. The difference to the answers provided so far is that this is for Qt5 and not Qt4. Most importantly however the previous answers neglected that the item delegate should be able to align the text as specified (e.g. in a QTreeWidget). Additionally I also implemented a way to elide rich text in order to get a consistent feeling with plaintext delegates (in ItemViews).
So without further ado, here is my code for a RichTextDelegate:
void RichTextItemDelegate::paint(QPainter *painter, const QStyleOptionViewItem &inOption,
const QModelIndex &index) const {
QStyleOptionViewItem option = inOption;
initStyleOption(&option, index);
if (option.text.isEmpty()) {
// This is nothing this function is supposed to handle
QStyledItemDelegate::paint(painter, inOption, index);
return;
}
QStyle *style = option.widget ? option.widget->style() : QApplication::style();
QTextOption textOption;
textOption.setWrapMode(option.features & QStyleOptionViewItem::WrapText ? QTextOption::WordWrap
: QTextOption::ManualWrap);
textOption.setTextDirection(option.direction);
QTextDocument doc;
doc.setDefaultTextOption(textOption);
doc.setHtml(option.text);
doc.setDefaultFont(option.font);
doc.setDocumentMargin(0);
doc.setTextWidth(option.rect.width());
doc.adjustSize();
if (doc.size().width() > option.rect.width()) {
// Elide text
QTextCursor cursor(&doc);
cursor.movePosition(QTextCursor::End);
const QString elidedPostfix = "...";
QFontMetrics metric(option.font);
#if QT_VERSION >= QT_VERSION_CHECK(5, 11, 0)
int postfixWidth = metric.horizontalAdvance(elidedPostfix);
#else
int postfixWidth = metric.width(elidedPostfix);
#endif
while (doc.size().width() > option.rect.width() - postfixWidth) {
cursor.deletePreviousChar();
doc.adjustSize();
}
cursor.insertText(elidedPostfix);
}
// Painting item without text (this takes care of painting e.g. the highlighted for selected
// or hovered over items in an ItemView)
option.text = QString();
style->drawControl(QStyle::CE_ItemViewItem, &option, painter, inOption.widget);
// Figure out where to render the text in order to follow the requested alignment
QRect textRect = style->subElementRect(QStyle::SE_ItemViewItemText, &option);
QSize documentSize(doc.size().width(), doc.size().height()); // Convert QSizeF to QSize
QRect layoutRect = QStyle::alignedRect(Qt::LayoutDirectionAuto, option.displayAlignment, documentSize, textRect);
painter->save();
// Translate the painter to the origin of the layout rectangle in order for the text to be
// rendered at the correct position
painter->translate(layoutRect.topLeft());
doc.drawContents(painter, textRect.translated(-textRect.topLeft()));
painter->restore();
}
QSize RichTextItemDelegate::sizeHint(const QStyleOptionViewItem &inOption, const QModelIndex &index) const {
QStyleOptionViewItem option = inOption;
initStyleOption(&option, index);
if (option.text.isEmpty()) {
// This is nothing this function is supposed to handle
return QStyledItemDelegate::sizeHint(inOption, index);
}
QTextDocument doc;
doc.setHtml(option.text);
doc.setTextWidth(option.rect.width());
doc.setDefaultFont(option.font);
doc.setDocumentMargin(0);
return QSize(doc.idealWidth(), doc.size().height());
}
Just a slight update from jbmohler's answer, for PyQt5: some classes have apparently been shifted to QtWidgets.
This is way beyond my paygrade (i.e. knowledge of the nuts and bolts behind PyQt5).
I echo the sentiment expressed in Cecil Curry's comment to the question. It is now 2021, and we appear still to have to struggle with this sort of hack. Ridiculous. I've been impressed by Qt5 to date, as compared to JavaFX for example. This deficiency is a let-down.
class HTMLDelegate( QtWidgets.QStyledItemDelegate ):
def __init__( self ):
super().__init__()
# probably better not to create new QTextDocuments every ms
self.doc = QtGui.QTextDocument()
def paint(self, painter, option, index):
options = QtWidgets.QStyleOptionViewItem(option)
self.initStyleOption(options, index)
painter.save()
self.doc.setTextWidth(options.rect.width())
self.doc.setHtml(options.text)
self.doc.setDefaultFont(options.font)
options.text = ''
options.widget.style().drawControl(QtWidgets.QStyle.CE_ItemViewItem, options, painter)
painter.translate(options.rect.left(), options.rect.top())
clip = QtCore.QRectF(0, 0, options.rect.width(), options.rect.height())
painter.setClipRect(clip)
ctx = QtGui.QAbstractTextDocumentLayout.PaintContext()
ctx.clip = clip
self.doc.documentLayout().draw(painter, ctx)
painter.restore()
def sizeHint( self, option, index ):
options = QtWidgets.QStyleOptionViewItem(option)
self.initStyleOption(option, index)
self.doc.setHtml(option.text)
self.doc.setTextWidth(option.rect.width())
return QtCore.QSize(self.doc.idealWidth(), self.doc.size().height())

Resources