Qt中使用delegate来自定义控件的显示方法。与传统的MVC模式不同,在此之前,先了解一下何为MVC模式。
MVC架构是"Model-View-Controller"的缩写,中文翻译为"模式-视图-控制器"。MVC应用程序总是由这三个部分组成。Event(事件)导致Controller改变Model或View,或者同时改变两者。只要Controller改变了Models的数据或者属性,所有依赖的View都会自动更新。类似的,只要Controller改变了View,View会从潜在的Model中获取数据来刷新自己。
Qt使用的是model/view 模式, 与MVC模式不同,model/view结构没有用于与用户交互的完全独立的组件。一般来讲, view负责把数据展示给用户,也处理用户的输入。为了获得更多的灵性性,交互通过delegagte执行。它既提供输入功能又负责渲染view中的每个数据项。
使用Delegate的原因 Qt中当用到QTreeView和QTableView等用于显示item的视图时,你要编辑一个item用到的编辑工具可能是除了默认文字编辑lineEdit以外的工具,例如button,spinBox,甚至Slider,ProgressBar,也有可能是自定义的widget。所以Qt提供了一个委托类,用来处理View中的数据展示方式。
现在来看一下使用步骤。
1. 新建一个类 ,继承于QStyledItemDelegate;
2. 重写以下函数
virtual QSize sizeHint(const QStyleOptionViewItem & option,
const QModelIndex & index) const;
// 决定如何绘图
virtual void paint(QPainter * painter,
const QStyleOptionViewItem & option,
const QModelIndex & index) const;
3.对于原位编辑,采取以下步骤:
/* 原位编辑 */
// 第1步:创建一个widget作为编辑器
QWidget *createEditor(QWidget *parent, const QStyleOptionViewItem &option,
const QModelIndex &index) const;
// 第2步:调用编辑器的显示位置
void updateEditorGeometry(QWidget *editor,
const QStyleOptionViewItem &option, const QModelIndex &index) const;
// 第3步:初始化显示数据
void setEditorData(QWidget *editor, const QModelIndex &index) const;
// -------------------------
// 第4步:用户完成编辑、编辑器被关闭时,提供数据到model
void setModelData(QWidget *editor, QAbstractItemModel *model,
const QModelIndex &index) const;
4.最后,在要使用的控件调用如下函数
ui.treeWidget->setItemDelegate(new Mydelegate(ui.treeWidget));
//以树控件为例
源代码示例
头文件: mydelegate.h
#pragma once
#include
#include
#include
class Mydelegate : public QStyledItemDelegate
{
Q_OBJECT
public:
Mydelegate(QObject *parent);
~Mydelegate();
private:
/* 自定义单元格显示 */
// 决定该单元格的推荐大小
virtual QSize sizeHint(const QStyleOptionViewItem & option,
const QModelIndex & index) const;
// 决定如何绘图
virtual void paint(QPainter * painter,
const QStyleOptionViewItem & option,
const QModelIndex & index) const;
private:
/* 原位编辑 */
// 第1步:创建一个widget作为编辑器
QWidget *createEditor(QWidget *parent, const QStyleOptionViewItem &option,
const QModelIndex &index) const;
// 第2步:调用编辑器的显示位置
void updateEditorGeometry(QWidget *editor,
const QStyleOptionViewItem &option, const QModelIndex &index) const;
// 第3步:初始化显示数据
void setEditorData(QWidget *editor, const QModelIndex &index) const;
// -------------------------
// 第4步:用户完成编辑、编辑器被关闭时,提供数据到model
void setModelData(QWidget *editor, QAbstractItemModel *model,
const QModelIndex &index) const;
private:
QString m_defaultText;
};
Cpp文件:mydelegate.cpp
#include "Mydelegate.h"
#include "GBK.h"
#include
Mydelegate::Mydelegate(QObject *parent)
: QStyledItemDelegate(parent)
{
m_defaultText = GBK::ToUnicode("双击添加...");
}
Mydelegate::~Mydelegate()
{
}
void Mydelegate::paint(QPainter * painter,
const QStyleOptionViewItem & option,
const QModelIndex & index) const
{
// QStyledItemDelegate::paint(painter,option, index);
QRect rect = option.rect; // 目标矩形
rect.adjust(2, 2, -2, -2); // 缩小一圈,留出空白间隔
// 状态显示: 若该项被选中,背景高亮显示
bool selected = false;
if (option.state & QStyle::State_Selected)
{
selected = true;
painter->setPen(Qt::NoPen);
painter->setBrush(Qt::SolidPattern);
painter->setBrush(QColor(0x53, 0x86,0x8b));
painter->drawRoundedRect(rect, 2, 2);
}
int rowid = index.data(Qt::UserRole).toInt();
if (rowid < 0)
{
// 空条目
painter->setBrush(Qt::NoBrush);
painter->setPen(Qt::DotLine);
painter->drawRect(rect);
QRect dst = rect;
dst.adjust(2, 2, -2, -2);
if (selected)
painter->setPen(QColor(0xCC, 0xCC,0xCC));
else
painter->setPen(QColor(0x99, 0x99,0x99));
painter->drawText(dst, Qt::AlignLeft | Qt::AlignVCenter, m_defaultText);
}
else
{
// 有意义的条目
QString text = index.data(Qt::DisplayRole).toString();
QRect dst = rect;
if (selected)
painter->setPen(QColor(0xFF, 0xFF,0xFF));
else
painter->setPen(QColor(0x00, 0x00,0x00));
painter->drawText(dst, Qt::AlignLeft | Qt::AlignVCenter, text);
}
}
// 决定该单元格的推荐大小
QSize Mydelegate::sizeHint(const QStyleOptionViewItem & option,
const QModelIndex & index) const
{
// returnQStyledItemDelegate::sizeHint(option, index);
QSize size = QStyledItemDelegate::sizeHint(option, index);
size.setHeight(32);
return size;
}
// 第1步:创建一个widget作为编辑器
QWidget* Mydelegate::createEditor(QWidget *parent,
const QStyleOptionViewItem &option,
const QModelIndex &index) const
{
// qDebug() <<"createEditor";
QLineEdit* editor = new QLineEdit(parent); //创建一个文本框作为编辑器
return editor;
}
// 第2步:调用编辑器的显示位置
void Mydelegate::updateEditorGeometry(QWidget *editor,
const QStyleOptionViewItem &option,
const QModelIndex &index) const
{
// qDebug() <<"updateEditorGeometry";
QRect rect = option.rect.adjusted(2, 2, -2, -2);
editor->setGeometry(rect);
}
// 第3步:初始化显示数据
void Mydelegate::setEditorData(QWidget *editor, const QModelIndex &index) const
{
// qDebug() <<"setEditorData";
QString text = index.data(Qt::DisplayRole).toString();
QLineEdit* ed = (QLineEdit*)editor;
ed->setText(text);
}
// 第四步:用户完成编辑,编辑器被关闭时,提供数据到model
void Mydelegate::setModelData(QWidget *editor,
QAbstractItemModel *model,
const QModelIndex &index) const
{
// qDebug() <<"setModelData";
QLineEdit* lineEdit = (QLineEdit*)editor;
QString value = lineEdit->text();
if (value.length() > 0)
{
model->setData(index, value, Qt::DisplayRole);
}
// 修改数据,触发QListWidget的信号:QListWidget::itemChanged
}