一、QtableView实现的表格中添加复选框checkBox控件常用方法。
方法一:设置QAbstractTableModel的flags()函数来实现。特点:直接显示,可定义样式,默认左对齐,很难实现居中、右对齐。
方法二:自定义委托QAbstractItemDelegate,通过paint()函数来实现。特点:这种方式比较复杂,但适合扩展,除了可以嵌入复选框,还可以绘制其它控件-按钮、图片等,定义样式无效。
二、QAbstractTableModel的flags()函数实现方式。
1、继承QAbstractTableModel类,实现MyTableModel类。
#ifndef MYTABLEMODEL_H
#define MYTABLEMODEL_H
#include <QAbstractTableModel>
/**
* @brief 表格展示的一行的数据结构
*/
struct FileRecord
{
bool bChecked;
QString strFilePath;
};
/**
* @brief 自定义TableModel,用于展示接口的使用
* @details
* 继承QAbstractTableModel需要实现至少三个接口:
* rowCount、columnCount、data
*/
class MyTableModel : public QAbstractTableModel
{
Q_OBJECT
public:
explicit MyTableModel(QObject *parent = nullptr);
//更新数据
void updateData(QList<FileRecord> recordList);
//获取行数
int rowCount(const QModelIndex &parent = QModelIndex()) const override;
//获取列数
int columnCount(const QModelIndex &parent = QModelIndex()) const override;
//获取单元格数据
QVariant data(const QModelIndex &index, int role = Qt::DisplayRole) const override;
//设置单元格数据
bool setData(const QModelIndex &index, const QVariant &value,int role = Qt::EditRole) override;
//单元格的可操作性标志位,如可编辑,可选中等
Qt::ItemFlags flags(const QModelIndex& index) const override;
private:
//数据
QList<FileRecord> m_recordList;
};
#endif // MYTABLEMODEL_H
#define CHECK_BOX_COLUMN 0 //复选框
#define FILE_PATH_COLUMN 1 //文件路径
MyTableModel::MyTableModel(QObject *parent)
: QAbstractTableModel(parent)
{
}
MyTableModel::~MyTableModel()
{
}
// 更新表格数据
void MyTableModel::updateData(QList<FileRecord> recordList)
{
beginResetModel();
m_recordList = recordList;
endResetModel();
}
// 行数
int MyTableModel::rowCount(const QModelIndex &parent) const
{
return m_recordList.count();
}
// 列数
int MyTableModel::columnCount(const QModelIndex &parent) const
{
return 2;
}
// 设置表格项数据
bool MyTableModel::setData(const QModelIndex &index, const QVariant &value, int role)
{
if (!index.isValid())
return false;
int nColumn = index.column();
FileRecord record = m_recordList.at(index.row());
switch (role)
{
case Qt::DisplayRole:
{
if (nColumn == FILE_PATH_COLUMN)
{
record.strFilePath = value.toString();
m_recordList.replace(index.row(), record);
emit dataChanged(index, index);
return true;
}
}
case Qt::CheckStateRole:
{
if (nColumn == CHECK_BOX_COLUMN)
{
record.bChecked = (value.toInt() == Qt::Checked);
m_recordList.replace(index.row(), record);
emit dataChanged(index, index);
//这里可以添加checkbox联动事件,emit到上层界面去处理。
return true;
}
}
default:
return false;
}
return false;
}
// 表格项数据
QVariant MyTableModel::data(const QModelIndex &index, int role) const
{
if (!index.isValid())
return QVariant();
int nRow = index.row();
int nColumn = index.column();
FileRecord record = m_recordList.at(nRow);
switch (role)
{
case Qt::TextColorRole:
return QColor(Qt::white);
case Qt::TextAlignmentRole:
return QVariant(Qt::AlignLeft | Qt::AlignVCenter);
case Qt::DisplayRole:
{
if (nColumn == File_PATH_COLUMN)
return record.strFilePath;
return "";
}
case Qt::CheckStateRole:
{
if (nColumn == CHECK_BOX_COLUMN)
return record.bChecked ? Qt::Checked : Qt::Unchecked;
}
default:
return QVariant();
}
return QVariant();
}
// 表头数据
QVariant MyTableModel::headerData(int section, Qt::Orientation orientation, int role) const
{
switch (role)
{
case Qt::TextAlignmentRole:
return QVariant(Qt::AlignLeft | Qt::AlignVCenter);
case Qt::DisplayRole:
{
if (orientation == Qt::Horizontal)
{
if (section == CHECK_BOX_COLUMN)
return QStringLiteral("状态");
if (section == FILE_PATH_COLUMN)
return QStringLiteral("文件路径");
}
}
default:
return QVariant();
}
return QVariant();
}
// 表格可选中、可复选
Qt::MyTableModel TableModel::flags(const QModelIndex &index) const
{
if (!index.isValid())
return QAbstractItemModel::flags(index);
Qt::ItemFlags flags = Qt::ItemIsEnabled | Qt::ItemIsSelectable;
if (index.column() == CHECK_BOX_COLUMN)
flags |= Qt::ItemIsUserCheckable;
return flags;
}
2、设置样式。
QTableView
{
color: white;
gridline-color: white; /*表格内框颜色*/
background-color: rgb(27, 27, 27); /*表格内背景色*/
alternate-background-color: rgb(64, 64, 64);
selection-color: white; /*选中区域的文字颜色*/
selection-background-color: rgb(77, 77, 77); /*选中区域的背景色*/
border: 1px white; /*边框像素和颜色*/
border-radius: 0px; /*边框圆角半径*/
padding: 1px 1px;
outline:0px; /*去除选中时的虚线框*/
}
QTableView::item {
color: #5F5F5F;
text-align: center;
padding-left: 6px;
padding-right: 6px;
}
/* 左上角的空白区域样式 */
QTableView QTableCornerButton::section
{
color: white;
background-color: skyblue;
border: 1px solid white;
border-radius:0px;
border-color: rgb(64, 64, 64);
}
/* 表头样式 */
QTableView QHeaderView {
background: transparent;
}
QTableView QHeaderView::section {
color: #8C8C8C;
background-color: white;
border-bottom: 1px solid #CED4DA;
border-top: none;
border-left: none;
border-right: 1px solid #CED4DA;
text-align: center;
font-weight: bold;
min-width: 30;
min-height: 30;
}
QTableView::item{
border:0;}
/* 表格中复选框样式 */
QTableView::indicator {
width: 20px;
height: 20px;
}
QTableView::indicator:unchecked{image:url(:/SwitchOff.png);}
QTableView::indicator:checked{image:url(:/SwitchOn.png);}
3、使用
QTableView *pTableView = new QTableView(this);
MyTableModel *pModel = new MyTableModel(this);
pTableView->setSelectionBehavior(QAbstractItemView::SelectRows);
pTableView->horizontalHeader()->setStretchLastSection(true);
pTableView->horizontalHeader()->setHighlightSections(false);
pTableView->verticalHeader()->setVisible(false);
pTableView->setShowGrid(false);
pTableView->setFrameShape(QFrame::NoFrame);
pTableView->setSelectionMode(QAbstractItemView::SingleSelection);
pTableView->setModel(pModel);
// 加载数据、更新界面
QList<FileRecord> recordList;
for (int i = 0; i < 5; ++i)
{
FileRecord record;
record.bChecked = false;
record.strFilePath = QString("D:/image%1.png").arg(i + 1);
recordList.append(record);
}
pModel->updateData(recordList);
三、自定义委托QAbstractItemDelegate,通过paint()函数实现方式。
QTableView如果实现指定项不可编辑状态方法:
1)重写Model的虚函数flags,指定index下的item的flags去除Qt::ItemIsEditable标志。
2)重写Delegate的createEditor,实现返回空的editor即可。
1、CheckBoxDelegate委托类。
ifndef CHECKBOXDELETAGE_H
#define CHECKBOXDELETAGE_H
#include <QStyledItemDelegate>
class QPixmap;
class CheckBoxDelegate : public QStyledItemDelegate
{
Q_OBJECT
public:
enum class CheckBoxPaintType : quint8
{
SysControl = 0, // 系统控件
OwnerDraw = 1, // 自绘CheckBox
DrawImage = 2, // 绘制图片
};
public:
explicit CheckBoxDelegate(CheckBoxPaintType type = CheckBoxPaintType::SysControl, QWidget *parent = nullptr);
~CheckBoxDelegate();
void initCheckBoxPixmaps(CheckBoxPaintType type);
void initCheckBoxPixmapBySysControl(const QString& key, bool checked);
void initCheckBoxPixmapByOwnerDraw(const QString& key, bool checked);
void initCheckBoxPixmapByDrawImage(const QString& key, bool checked);
// 虚函数
void paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const override;
bool editorEvent(QEvent *event, QAbstractItemModel *model, const QStyleOptionViewItem &option, const QModelIndex &index) override;
signals:
private:
QPixmap* mCheckedPix = nullptr;
QPixmap* mUnCheckedPix = nullptr;
};
#endif // CHECKBOXDELETAGE_H
#include "checkboxdeletage.h"
#include <QCheckBox>
#include <QApplication>
#include <QMouseEvent>
#include <QPixmapCache>
#include <QPainter>
CheckBoxDelegate::CheckBoxDelegate(CheckBoxDelegate::CheckBoxPaintType type, QWidget *parent)
: QStyledItemDelegate(parent)
{
initCheckBoxPixmaps(type);
}
CheckBoxDelegate::~CheckBoxDelegate()
{
delete mCheckedPix;
delete mUnCheckedPix;
}
void CheckBoxDelegate::initCheckBoxPixmaps(CheckBoxDelegate::CheckBoxPaintType type)
{
switch (type)
{
case CheckBoxPaintType::SysControl:
initCheckBoxPixmapBySysControl("checked", true);
initCheckBoxPixmapBySysControl("unchecked", false);
break;
case CheckBoxPaintType::OwnerDraw:
initCheckBoxPixmapByOwnerDraw("checked", true);
initCheckBoxPixmapByOwnerDraw("unchecked", false);
break;
case CheckBoxPaintType::DrawImage:
initCheckBoxPixmapByDrawImage("checked", true);
initCheckBoxPixmapByDrawImage("unchecked", false);
break;
default:
break;
}
}
void CheckBoxDelegate::initCheckBoxPixmapBySysControl(const QString &key, bool checked)
{
QPixmap* pix = new QPixmap(13,13);
QPainter painter(pix);
QStyleOptionToolButton style;
style.iconSize = QSize(13, 13);
style.state = checked ? QStyle::State_On : QStyle::State_Off;
style.state |= QStyle::State_Enabled;
style.rect = QRect(0,0, 13,13);
QCheckBox box;
QApplication::style()->drawPrimitive(QStyle::PE_IndicatorCheckBox, &style, &painter, &box);
if (checked)
mCheckedPix = pix;
else
mUnCheckedPix = pix;
}
void CheckBoxDelegate::initCheckBoxPixmapByOwnerDraw(const QString &key, bool checked)
{
QPixmap* pix = new QPixmap(13,13);
QPainter painter(pix);
painter.setPen(QColorConstants::Green);
QRect rect(0,0,13,13);
// 抗锯齿
painter.setRenderHint(QPainter::Antialiasing);
painter.setBrush(QBrush(QColorConstants::White));
painter.drawRect(rect);
if (checked)
{
QPointF points[3] = {
QPointF(rect.x() + rect.width() * 2 / 11, rect.y() + rect.height() * 6 / 11),
QPointF(rect.x() + rect.width() * 4 / 11, rect.y() + rect.height() * 8 / 11),
QPointF(rect.x() + rect.width() * 9 / 11, rect.y() + rect.height() * 3 / 11),
};
painter.setPen(QPen(QBrush(QColorConstants::Green),2));
painter.drawPolyline(points, 3);
}
if (checked)
mCheckedPix = pix;
else
mUnCheckedPix = pix;
}
void CheckBoxDelegate::initCheckBoxPixmapByDrawImage(const QString &key, bool checked)
{
QPixmap* pix = new QPixmap(checked ? ":/image/checked.png" : ":/image/unchecked.png");
if (checked)
mCheckedPix = pix;
else
mUnCheckedPix = pix;
}
void CheckBoxDelegate::paint(QPainter *painter, const QStyleOptionViewItem &option, const QModelIndex &index) const
{
QStyleOptionViewItem viewOption(option);
initStyleOption(&viewOption, index);
if (viewOption.state.testFlag(QStyle::State_HasFocus))
viewOption.state ^= QStyle::State_HasFocus;
QStyledItemDelegate::paint(painter, option, index);
bool checked = index.data(Qt::UserRole).toBool();
QPixmap* pix = checked? mCheckedPix : mUnCheckedPix;
if (pix)
{
// 居中显示
QRect rect = pix->rect();
int offsetX = option.rect.width() / 2 - rect.width() / 2;
int offsetY = option.rect.height() / 2 - rect.height() / 2;
rect.translate(option.rect.x() + offsetX, option.rect.y() + offsetY);
painter->drawPixmap(rect, *pix);
}
}
bool CheckBoxDelegate::editorEvent(QEvent *event, QAbstractItemModel *model, const QStyleOptionViewItem &option, const QModelIndex &index)
{
if (event->type() == QEvent::MouseButtonPress || event->type() == QEvent::MouseButtonDblClick)
{
// 鼠标单双击切换选中状态
QMouseEvent* mouseEvent = static_cast<QMouseEvent*>(event);
if (option.rect.contains(mouseEvent->pos()))
{
model->setData(index, !model->data(index, Qt::UserRole).toBool(), Qt::UserRole);
}
}
return QStyledItemDelegate::editorEvent(event, model, option, index);
}
2、继承QAbstractTableModel类,实现MyTableModel类。
#ifndef MYTABLEMODEL_H
#define MYTABLEMODEL_H
#include <QAbstractTableModel>
/**
* @brief 表格展示的一行的数据结构
*/
struct FileRecord
{
bool bChecked;
QString strFilePath;
};
/**
* @brief 自定义TableModel,用于展示接口的使用
* @details
* 继承QAbstractTableModel需要实现至少三个接口:
* rowCount、columnCount、data
*/
class MyTableModel : public QAbstractTableModel
{
Q_OBJECT
public:
explicit MyTableModel(QObject *parent = nullptr);
//更新数据
void updateData(QList<FileRecord> recordList);
//获取行数
int rowCount(const QModelIndex &parent = QModelIndex()) const override;
//获取列数
int columnCount(const QModelIndex &parent = QModelIndex()) const override;
//获取单元格数据
QVariant data(const QModelIndex &index, int role = Qt::DisplayRole) const override;
//设置单元格数据
bool setData(const QModelIndex &index, const QVariant &value,int role = Qt::EditRole) override;
//单元格的可操作性标志位,如可编辑,可选中等
Qt::ItemFlags flags(const QModelIndex& index) const override;
private:
//数据
QList<FileRecord> m_recordList;
};
#endif // MYTABLEMODEL_H
#define CHECK_BOX_COLUMN 0 //复选框
#define FILE_PATH_COLUMN 1 //文件路径
MyTableModel::MyTableModel(QObject *parent)
: QAbstractTableModel(parent)
{
}
MyTableModel::~MyTableModel()
{
}
// 更新表格数据
void MyTableModel::updateData(QList<FileRecord> recordList)
{
beginResetModel();
m_recordList = recordList;
endResetModel();
}
// 行数
int MyTableModel::rowCount(const QModelIndex &parent) const
{
return m_recordList.count();
}
// 列数
int MyTableModel::columnCount(const QModelIndex &parent) const
{
return 2;
}
// 设置表格项数据
bool MyTableModel::setData(const QModelIndex &index, const QVariant &value, int role)
{
if (!index.isValid())
return false;
int nColumn = index.column();
FileRecord record = m_recordList.at(index.row());
switch (role)
{
case Qt::DisplayRole:
{
if (nColumn == FILE_PATH_COLUMN)
{
record.strFilePath = value.toString();
m_recordList.replace(index.row(), record);
emit dataChanged(index, index);
return true;
}
}
case Qt::CheckStateRole:
case Qt::UserRole:
{
if (nColumn == CHECK_BOX_COLUMN)
{
record.bChecked = (value.toInt() == Qt::Checked);
m_recordList.replace(index.row(), record);
emit dataChanged(index, index);
return true;
}
}
default:
return false;
}
return false;
}
// 表格项数据
QVariant MyTableModel::data(const QModelIndex &index, int role) const
{
if (!index.isValid())
return QVariant();
int nRow = index.row();
int nColumn = index.column();
FileRecord record = m_recordList.at(nRow);
switch (role)
{
case Qt::TextColorRole:
return QColor(Qt::white);
case Qt::TextAlignmentRole:
return QVariant(Qt::AlignLeft | Qt::AlignVCenter);
case Qt::DisplayRole:
{
if (nColumn == File_PATH_COLUMN)
return record.strFilePath;
return "";
}
case Qt::CheckStateRole:
case Qt::UserRole:
{
if (nColumn == CHECK_BOX_COLUMN)
return record.bChecked ? Qt::Checked : Qt::Unchecked;
}
default:
return QVariant();
}
return QVariant();
}
// 表头数据
QVariant MyTableModel::headerData(int section, Qt::Orientation orientation, int role) const
{
switch (role)
{
case Qt::TextAlignmentRole:
return QVariant(Qt::AlignLeft | Qt::AlignVCenter);
case Qt::DisplayRole:
{
if (orientation == Qt::Horizontal)
{
if (section == CHECK_BOX_COLUMN)
return QStringLiteral("状态");
if (section == FILE_PATH_COLUMN)
return QStringLiteral("文件路径");
}
}
default:
return QVariant();
}
return QVariant();
}
// 表格可选中、可复选
Qt::MyTableModel TableModel::flags(const QModelIndex &index) const
{
if (!index.isValid())
return QAbstractItemModel::flags(index);
Qt::ItemFlags flags = Qt::ItemIsEnabled | Qt::ItemIsSelectable;
if (index.column() == CHECK_BOX_COLUMN)
flags |= Qt::ItemIsUserCheckable;
return flags;
}
3、使用
QTableView *pTableView = new QTableView(this);
MyTableModel *pModel = new MyTableModel(this);
pTableView->setSelectionBehavior(QAbstractItemView::SelectRows);
pTableView->horizontalHeader()->setStretchLastSection(true);
pTableView->horizontalHeader()->setHighlightSections(false);
pTableView->verticalHeader()->setVisible(false);
pTableView->setShowGrid(false);
pTableView->setFrameShape(QFrame::NoFrame);
pTableView->setItemDelegateForColumn(0, new CheckBoxDelegate(CheckBoxDelegate::CheckBoxPaintType::SysControl, this));
//pTableView->setItemDelegateForColumn(0, new CheckBoxDelegate(CheckBoxDelegate::CheckBoxPaintType::OwnerDraw, this));
//pTableView->setItemDelegateForColumn(0, new CheckBoxDelegate(CheckBoxDelegate::CheckBoxPaintType::DrawImage, this));
// 不可编辑
pTableView->setEditTriggers(QAbstractItemView::EditTrigger::NoEditTriggers);
// 整行选中
pTableView->setSelectionBehavior(QAbstractItemView::SelectRows);
// 多行可选
pTableView->setSelectionMode(QAbstractItemView::SelectionMode::ExtendedSelection);
pTableView->setModel(pModel);
// 加载数据、更新界面
QList<FileRecord> recordList;
for (int i = 0; i < 5; ++i)
{
FileRecord record;
record.bChecked = false;
record.strFilePath = QString("D:/image%1.png").arg(i + 1);
recordList.append(record);
}
pModel->updateData(recordList);