I extended the qstyleditemview class. When I am in the editing mode for the qtreeview item, the paint method seems not to be executing right. When I change state to QStyle::State_Selected it works - it paints the selected row (text) in the qtreeview.
Any idea why it is not working in editing mode?
void myQItemDelegate::paint(QPainter *painter,const QStyleOptionViewItem &option,const QModelIndex &index) const
{
QStyleOptionViewItem s = *qstyleoption_cast<const QStyleOptionViewItem*>(&option);
if(s.state & QStyle::State_Editing)
{
painter->fillRect(s.rect, s.palette.highlight());
s.palette.setColor(QPalette::HighlightedText, QColor(Qt::blue));
}
QStyledItemDelegate::paint(painter, s, index);
}
In the State_Editing state the editor that is a widget created in createEditor() method is opened so that it will not be affected by the QStyleOptionViewItem palette.
Also instead of overwriting the paint method, use the initStyleOption() method:
#include <QtWidgets>
class StyledItemDelegate: public QStyledItemDelegate
{
public:
using QStyledItemDelegate::QStyledItemDelegate;
QWidget *createEditor(QWidget *parent, const QStyleOptionViewItem &option, const QModelIndex &index) const override {
QWidget * widget = QStyledItemDelegate::createEditor(parent, option, index);
QPalette pal(widget->palette());
pal.setColor(QPalette::HighlightedText, QColor(Qt::blue));
pal.setBrush(QPalette::Highlight, option.palette.highlight());
widget->setPalette(pal);
return widget;
}
protected:
void initStyleOption(QStyleOptionViewItem *option, const QModelIndex &index) const override{
QStyledItemDelegate::initStyleOption(option, index);
option->palette.setColor(QPalette::HighlightedText, QColor(Qt::blue));
}
};
int main(int argc, char *argv[])
{
QApplication a(argc, argv);
QTreeView w;
QStandardItemModel model;
w.setModel(&model);
w.setItemDelegate(new StyledItemDelegate);
for(int i=0; i<3; ++i){
auto it = new QStandardItem(QString::number(i));
model.appendRow(it);
for (int j=0; j<4; ++j) {
it->appendRow(new QStandardItem(QString("%1-%2").arg(i).arg(j)));
}
}
w.expandAll();
w.show();
return a.exec();
}
Thanks for helping me out.
I understand now. I added code in QWidget *createEditor(QWidget *parent, const QStyleOptionViewItem &option, const QModelIndex &index) const metod to style QLineEdit. I am trying to get the same background color for QLineEdit when it is created- when I am editing qtreeview item. The problem is when I select the item in qtreeview the whole row gets colored. That's ok. Now when I edit the item for example to change the text in qtreeview item, only the text part gets selected and colored with the same color as previous row selection color. The rest of the QLineEdit is white. In editing mode I would like to color the whole row which is edited with the same color. I could as obviously from my code color it with RGB but I don't know the exact RGB values. Is there any way to get the exact RGB color from item selection and then use it in
pal.setColor(QPalette::Highlight,QColor(qRgb(0,0,255)));
my code:
QWidget* myQItemDelegate::createEditor(QWidget *parent,const QStyleOptionViewItem &option,const QModelIndex &index) const
{
QLineEdit *lineEdit = new QLineEdit(parent);
connect(lineEdit,SIGNAL(editingFinished()),this,SLOT(commitAndCloseEditor()));
QPalette pal;
pal.setColor(QPalette::HighlightedText, QColor(Qt::white));
pal.setColor(QPalette::Highlight,QColor(qRgb(0,0,255)));
lineEdit->setPalette(pal);
lineEdit->setFrame(false);
return lineEdit;
}
Thanks, Tom
Related
I have a QTableWidget in which some cells have QComboBox as cellWidget. I want to create the comboBox only when the user clicks in the cell. For this, I have caught itemClicked signal and created the comboBox and set it as cellWidget.
Now, I want to delete this comboBox in two scenarios - if the user selects some value from the comboBox, or the user simply focusses out (click anywhere in the dialog).
For the first case, I have use the signal QComboBox::activated which is invoked when something is selected in the drop-down. There I delete the comboBox and it works fine.
However, I am not sure how to proceed for the second case (delete the comboBox when the user focusses out of the drop-down without selecting anything).
I tried capturing eventFilter for focusOut for the tablewidget as well as the comboBox, but it didn't help.
You can use QItemDelegate for this purpose:
comboboxdelegate.h
class ComboBoxDelegate : public QItemDelegate
{
Q_OBJECT
public:
ComboBoxDelegate(QObject *parent = nullptr) :
QItemDelegate(parent)
{
}
QWidget* createEditor(QWidget *parent, const QStyleOptionViewItem &option, const QModelIndex &index) const
{
QComboBox *editor = new QComboBox(parent);
editor->addItems(QStringList() << "1" << "2" << "3" << "4"); // fill it with your own values
return editor;
}
void setEditorData(QWidget *editor, const QModelIndex &index) const
{
QString text = index.model()->data(index, Qt::EditRole).toString();
QComboBox *cb = static_cast<QComboBox*>(editor);
cb->setCurrentText(text);
}
void setModelData(QWidget *editor, QAbstractItemModel *model, const QModelIndex &index) const
{
QComboBox *cb = static_cast<QComboBox*>(editor);
QString text = cb->currentText();
model->setData(index, text, Qt::EditRole);
}
void updateEditorGeometry(QWidget *editor, const QStyleOptionViewItem &option, const QModelIndex &index) const
{
editor->setGeometry(option.rect);
}
};
mainwindow.cpp
...
ui->tableWidget->setItemDelegate(new ComboBoxDelegate);
...
I want to show my database tabel content in a QTableView. I use the following codes to do that:
QSqlDatabase test = QSqlDatabase::addDatabase("QMYSQL");
test.setDatabaseName("dbText");
test.setHostName("localhost");
test.setUserName("***");
test.setPassword("***");
if (!test.open())
qDebug()<<"ERROR ";
QSqlTableModel *model = new QSqlTableModel(this,test);
model->setTable("textTable");
model->setEditStrategy(QSqlTableModel::OnManualSubmit);
model->select();
ui->tableView->horizontalHeader()->setSectionResizeMode(QHeaderView::ResizeToContents);
ui->tableView->setModel(model);
ui->tableView->show();
As it is depicted in the following picture, ui->tableView columns are resized to the content of the database table columns.
Now, I want to clear the display text of Description column and paint it with new text and color. For this propose, I have used the function QTableView::setItemDelegateForColumn as follow:
ui->tableView->setItemDelegateForColumn(2,new PowerColorDelegate(this));
And here are PowerColorDelegate header and source file content:
PowerColorDelegate.h
#include <QStyledItemDelegate>
class PowerColorDelegate : public QStyledItemDelegate
{
Q_OBJECT
public:
PowerColorDelegate(QObject *parent = 0);
protected:
void paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const;
QString displayText(const QVariant &value, const QLocale &locale) const;
};
PowerColorDelegate.cpp
#include <QApplication>
#include <QPainter>
#include "powercolordelegate.h"
PowerColorDelegate::PowerColorDelegate(QObject *parent) : QStyledItemDelegate(parent)
{
}
void PowerColorDelegate::paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const
{
QStyleOptionViewItem opt = option;
initStyleOption(&opt, index);
if(!index.isValid())
{
QStyledItemDelegate::paint(painter, option, index);
return;
}
// Position our pixmap
const int x = option.rect.left();
const int y = option.rect.top();
QString newColor = "#fcaf9e";
QString newText = "This is my new text which I want to paint!";
painter->fillRect(option.rect, newColor);
painter->drawText(QRect(x, y, 80, 20), newText);
QStyledItemDelegate::paint(painter, opt, index);
}
QString PowerColorDelegate::displayText(const QVariant &value, const QLocale &locale) const
{
return "";
}
The result of using PowerColorDelegate on ui->tableView is shown in this picture:
How can I resize the third ui->tableView column (Description) horizontally to the content of the painted column?
Implement sizeHint for your delegate according to required text format
I'd like to have the different selection colors for the different cells of the QTableWidget.
To change selection color for the whole table I can use
QTableWidget* table = new QTableWidget;
table->setStyleSheet("QTableWidget::item{selection-background-color:#ff0000;}");
To set the usual background color of the single cells it's possible to write in the following way:
table->setItem(row, column, new QTableWidgetItem(""));
table->item(row, column)->setBackgroundColor(QColor(255,255,0));
But I couldn't find any info about the different selection colors for the different cells.
Please, help!
it was a very interesting question for me and I wrote an example))
I use the delegate to resolve this issue
class MyDelegate : public QItemDelegate
{
public:
MyDelegate( QObject *parent ) : QItemDelegate( parent ) { }
void paint( QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index ) const;
};
void MyDelegate::paint( QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index ) const
{
QItemDelegate::paint( painter, option, index );
QColor background = QColor(rand()%255, rand()%255, rand()%255);
QColor background2 = QColor(255, 255, 255);
painter->fillRect(option.rect, background);
if (option.state & QStyle::State_Selected) {
painter->fillRect(option.rect, background);
} else {
painter->fillRect(option.rect, background2);
}
}
how will it work? with each selection, it will generate a new color for selected item
delegate integration
int main(int argc, char *argv[])
{
QApplication a(argc, argv);
QTableWidget* m_pTableWidget = new QTableWidget();
m_pTableWidget->setRowCount(10);
m_pTableWidget->setColumnCount(10);
for (int i = 0; i < m_pTableWidget->rowCount(); ++i) {
m_pTableWidget->setItemDelegateForRow(i, new MyDelegate(m_pTableWidget));
}
m_pTableWidget->show();
return a.exec();
}
results
you can change the code and give a specific color for certain item .
I want to have a QTreeView without an indentation on the left side increasing at each nesting level. I tried setting QTreeView::setIndentation(0). It removes the indentations just as I want, however it also hides the tree arrows.
Default behavior:
With indentations ✗
With arrows ✔
After setIndentation(0):
Without indentations ✔
Without arrows ✗
Desired behavior:
Without indentations ✔
With arrows ✔
So how can I achieve the result shown in the third example? Is there any standard way of doing it, or I will have to reimplement the QTreeView::paintEvent(), QTreeView::drawBranches(), etc.?
To solve the problem I used a delegate to translate the paint of the items, and paint the arrows.
#include <QtWidgets>
class BranchDelegate: public QStyledItemDelegate
{
public:
using QStyledItemDelegate::QStyledItemDelegate;
void paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const override{
QStyleOptionViewItem opt(option);
if(index.column() == 0)
opt.rect.adjust(opt.rect.height(), 0, 0, 0);
QStyledItemDelegate::paint(painter, opt, index);
if(index.column() == 0){
QStyleOptionViewItem branch;
branch.rect = QRect(0, opt.rect.y(), opt.rect.height(), opt.rect.height());
branch.state = option.state;
const QWidget *widget = option.widget;
QStyle *style = widget ? widget->style() : QApplication::style();
style->drawPrimitive(QStyle::PE_IndicatorBranch, &branch, painter, widget);
}
}
};
class TreeView: public QTreeView
{
public:
TreeView(QWidget *parent=nullptr):QTreeView(parent)
{
BranchDelegate *delegate = new BranchDelegate(this);
setItemDelegate(delegate);
setIndentation(0);
}
protected:
void mousePressEvent(QMouseEvent *event) override{
QModelIndex index = indexAt(event->pos());
bool last_state = isExpanded(index);
QTreeView::mousePressEvent(event);
if(index.isValid() && last_state == isExpanded(index))
setExpanded(index, !last_state);
}
};
int main(int argc, char *argv[])
{
QApplication a(argc, argv);
TreeView w;
QFileSystemModel model;
model.setRootPath(QDir::rootPath());
w.setModel(&model);
w.setRootIndex(model.index(QDir::homePath()));
/*for (int i = 1; i< model.columnCount() ; ++i) {
w.hideColumn(i);
}*/
w.expandAll();
w.resize(640, 480);
w.show();
return a.exec();
}
eyllanesc's falls appart if there is horizontal scrolling. Also usually the view only expands/collapses when clicking the branch-indicator, not the index.
My Solution: Only change the Rect of indices which have a parent but no children. Also dont set the indentation to 0. No need to subclass QTreeView.
#include <QtWidgets>
class BranchDelegate: public QStyledItemDelegate
{
public:
mIndent = 50;
using QStyledItemDelegate::QStyledItemDelegate;
void paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const override
{
QStyleOptionViewItem opt(option);
if(index.parent().isValid && (!index.model() || !index.model()->index(0, 0, index).isValid()))
{
opt.rect.adjust(-mIndent, 0, 0, 0);
}
QStyledItemDelegate::paint(painter, opt, index);
}
};
int main(int argc, char *argv[])
{
QApplication a(argc, argv);
QTreeView apView;
BranchDelegate* const apDelegate = new BranchDelegate(apView);
apDelegate->mIndent = 50;
apView->setIndentation(apDelegate->mIndent);
apView->setItemDelegateForColumn(0, apDelegate);
QFileSystemModel model;
model.setRootPath(QDir::rootPath());
apView.setModel(&model);
apView.setRootIndex(model.index(QDir::homePath()));
/*for (int i = 1; i< model.columnCount() ; ++i) {
apView.hideColumn(i);
}*/
apView.expandAll();
apView.resize(640, 480);
apView.show();
return a.exec();
}
ellyanesc's answer works, but is incorrect by one small detail in the line:
branch.rect = QRect(0, opt.rect.y(), opt.rect.height(), opt.rect.height());
The reason is because when the view is horizontally scrolled, option.rect.x() becomes negative. If branch.rect.x() is 0 (as in ellyanesc's answer), the branch indicator will always be shown, which also causes artifacts during scroll:
https://i.stack.imgur.com/O518A.png
https://i.stack.imgur.com/qYJMj.png
To solve this, replace the above line with:
branch.rect = QRect(option.rect.x(), opt.rect.y(), opt.rect.height(), opt.rect.height());
(I would have just pointed that out as a comment in ellyanesc's answer, but I don't have enough reputation for that.)
I've never done any item delegates in Qt before, and I think the documentation doesn't explain well about more complex delegates.
I need to create 2 styles of Symbian(^3) style lists
Type 1:
This is for common navigation lists, the icon and the lower label are optional.
Type 2:
This is for settings lists, where the pushbutton can be a toggle(on/off)-button or execute a context menu, etc.
How would I go on creating these sort of item delegates?
Best Regards,
Rat
I had to make something similar once. This is how I did it.
My delegate class declaration. As you can see it has a member: QLabel *label. You can add another label or a pushbutton, depending on your needs.
class MyItemDelegate : public QStyledItemDelegate
{
public:
explicit MyItemDelegate(QObject *parent = 0);
~MyItemDelegate();
protected:
void paint(QPainter *painter,
const QStyleOptionViewItem &option, const QModelIndex &index) const;
QSize sizeHint(const QStyleOptionViewItem &option,
const QModelIndex &index) const;
private:
QLabel *label;
};
My paint() and sizeHint() methods.
QSize MyItemDelegate::sizeHint(const QStyleOptionViewItem &option, const QModelIndex &index) const
{
if(!index.isValid())
return QSize();
QVariant data = index.data(Qt::DisplayRole);
label->setText(data.toString());
label->resize(label->sizeHint());
QSize size(option.rect.width(), label->height());
return size;
}
void MyItemDelegate::paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const
{
if(!index.isValid())
return;
QVariant data = index.data(Qt::DisplayRole);
// Not necessary to do it here, as it's been already done in sizeHint(), but anyway.
label->setText(data.toString());
painter->save();
QRect rect = option.rect;
// This will draw a label for you. You can draw a pushbutton the same way.
label->render(painter, QPoint(rect.topLeft().x(), rect.center().y() - label->height() / 2),
QRegion(label->rect()), QWidget::RenderFlags());
painter->restore();
}
Hope this is what you've been looking for. Good luck!
You have 2 options ,
1) QML - This in my opinion is the best way to go and easier to achieve what you are trying to do.
Link to Example
This shows you how to use a Delegate for a listview.
2)QItemDelegate - Subclass QItemDelegate then Assign a this delegate to a listview ,
Link to QItemDelegate