QTableWidget 控件入门

1. 基本创建和设置

创建表格

cpp

#include <QTableWidget>
#include <QTableWidgetItem>// 创建表格控件
QTableWidget *tableWidget = new QTableWidget(5, 3); // 5行3列
tableWidget->setParent(this);// 或者动态设置行列数
tableWidget->setRowCount(10);    // 设置10行
tableWidget->setColumnCount(4);  // 设置4列

设置表头

cpp

​
// 设置列数
ui->tableWidgetMaxMin->setColumnCount(2);  // 必须先设置列数// 设置水平表头标签
QStringList horizontalHeaders;
horizontalHeaders << tr("Max") << tr("Min");
ui->tableWidgetMaxMin->setHorizontalHeaderLabels(horizontalHeaders);// 确保表头可见并设置合适的尺寸
ui->tableWidgetMaxMin->horizontalHeader()->setVisible(true);
ui->tableWidgetMaxMin->horizontalHeader()->setDefaultSectionSize(80);  // 列宽
ui->tableWidgetMaxMin->horizontalHeader()->setMinimumHeight(30);       // 表头最小高度// 如果需要，可以设置表头样式
ui->tableWidgetMaxMin->horizontalHeader()->setStyleSheet("QHeaderView::section {""    background-color: #e0e0e0;""    padding: 4px;""    border: 1px solid #cccccc;""    font-weight: bold;""}"
);​

隐藏行号和列号

// 同时隐藏行号和列号
tableWidget->verticalHeader()->setVisible(false);
tableWidget->horizontalHeader()->setVisible(false);

或者

// 使用样式表隐藏所有表头
tableWidget->setStyleSheet("QTableWidget::verticalHeader { width: 0px; }""QTableWidget::horizontalHeader { height: 0px; }"
);

设置所有行的高度

// 设置统一的行高度为50像素
ui->tableWidget->verticalHeader()->setDefaultSectionSize(50);// 或者使用setRowHeight方法（需要在有行的时候使用）
for (int row = 0; row < ui->tableWidget->rowCount(); ++row) {ui->tableWidget->setRowHeight(row, 50);
}

2. 数据操作

添加数据

cpp

// 方法1：直接设置单元格内容
tableWidget->setItem(0, 0, new QTableWidgetItem("张三"));
tableWidget->setItem(0, 1, new QTableWidgetItem("25"));
tableWidget->setItem(0, 2, new QTableWidgetItem("工程师"));
tableWidget->setItem(0, 3, new QTableWidgetItem("8000"));// 方法2：创建带样式的项目
QTableWidgetItem *item = new QTableWidgetItem("李四");
item->setTextAlignment(Qt::AlignCenter);
item->setBackground(QBrush(QColor(240, 240, 240)));
item->setForeground(QBrush(QColor(0, 0, 0)));
tableWidget->setItem(1, 0, item);// 设置数字内容并右对齐
QTableWidgetItem *ageItem = new QTableWidgetItem();
ageItem->setData(Qt::EditRole, 30); // 对于数字，使用EditRole
ageItem->setTextAlignment(Qt::AlignRight | Qt::AlignVCenter);
tableWidget->setItem(1, 1, ageItem);

批量添加数据

cpp

// 准备数据
QVector<QStringList> data = {{"王五", "28", "设计师", "7500"},{"赵六", "32", "经理", "12000"},{"钱七", "26", "开发", "9000"}
};for (int row = 0; row < data.size(); ++row) {for (int col = 0; col < data[row].size(); ++col) {QTableWidgetItem *item = new QTableWidgetItem(data[row][col]);tableWidget->setItem(row + 2, col, item);}
}

3. 样式和外观设置

基本样式

cpp

// 设置表格样式
tableWidget->setStyleSheet("QTableWidget {""    gridline-color: #d0d0d0;""    background-color: white;""    alternate-background-color: #f8f8f8;""    selection-background-color: #e3f2fd;""    selection-color: black;""}""QTableWidget::item {""    padding: 4px;""    border: none;""}""QTableWidget::item:selected {""    background-color: #bbdefb;""}"
);// 启用交替行颜色
tableWidget->setAlternatingRowColors(true);// 设置网格线
tableWidget->setShowGrid(true);
tableWidget->setGridStyle(Qt::SolidLine);// 设置选择行为
tableWidget->setSelectionMode(QAbstractItemView::SingleSelection); // 单选
tableWidget->setSelectionBehavior(QAbstractItemView::SelectRows);  // 整行选择// 设置编辑触发方式
tableWidget->setEditTriggers(QAbstractItemView::DoubleClicked | QAbstractItemView::EditKeyPressed);

4. 列设置

列宽设置

cpp

// 设置列宽
tableWidget->setColumnWidth(0, 100);  // 第一列宽100
tableWidget->setColumnWidth(1, 80);   // 第二列宽80
tableWidget->setColumnWidth(2, 120);  // 第三列宽120
tableWidget->horizontalHeader()->setStretchLastSection(true); // 最后一列拉伸// 或者自动调整列宽
tableWidget->horizontalHeader()->setSectionResizeMode(QHeaderView::Stretch); // 平均分配
tableWidget->horizontalHeader()->setSectionResizeMode(QHeaderView::ResizeToContents); // 根据内容调整

隐藏列/显示列

cpp

tableWidget->setColumnHidden(3, true);  // 隐藏第4列（工资列）
// tableWidget->setColumnHidden(3, false); // 显示第4列

5. 信号和槽连接

常用信号连接

cpp

// 单元格内容改变
connect(tableWidget, &QTableWidget::cellChanged, [](int row, int column) {qDebug() << "单元格改变:" << row << "," << column;
});// 单元格被点击
connect(tableWidget, &QTableWidget::cellClicked, [](int row, int column) {qDebug() << "单元格点击:" << row << "," << column;
});// 单元格被双击
connect(tableWidget, &QTableWidget::cellDoubleClicked, [](int row, int column) {qDebug() << "单元格双击:" << row << "," << column;
});// 当前单元格改变
connect(tableWidget, &QTableWidget::currentCellChanged, [](int currentRow, int currentColumn, int previousRow, int previousColumn) {qDebug() << "当前单元格从" << previousRow << "," << previousColumn<< "变为" << currentRow << "," << currentColumn;
});

6. 数据获取和操作

获取数据

cpp

// 获取特定单元格数据
QTableWidgetItem *item = tableWidget->item(0, 0);
if (item) {QString text = item->text();qDebug() << "单元格内容:" << text;
}// 获取所有数据
for (int row = 0; row < tableWidget->rowCount(); ++row) {for (int col = 0; col < tableWidget->columnCount(); ++col) {QTableWidgetItem *item = tableWidget->item(row, col);if (item) {qDebug() << "行" << row << "列" << col << ":" << item->text();}}
}// 获取选中的行
QList<QTableWidgetItem*> selectedItems = tableWidget->selectedItems();
foreach (QTableWidgetItem *item, selectedItems) {qDebug() << "选中项:" << item->text() << "位于行" << item->row();
}

数据操作

cpp

// 插入行
tableWidget->insertRow(2); // 在第3行前插入新行// 删除行
tableWidget->removeRow(0); // 删除第1行// 清空表格
tableWidget->clearContents();        // 清空内容，保留表头
tableWidget->setRowCount(0);         // 删除所有行// 排序
tableWidget->sortByColumn(1, Qt::AscendingOrder); // 按第2列升序排序

7. 高级功能

自定义单元格控件

cpp

// 添加按钮到单元格
QPushButton *button = new QPushButton("操作");
tableWidget->setCellWidget(0, 3, button);connect(button, &QPushButton::clicked, [this]() {qDebug() << "按钮被点击";
});// 添加组合框
QComboBox *comboBox = new QComboBox();
comboBox->addItems({"选项1", "选项2", "选项3"});
tableWidget->setCellWidget(1, 2, comboBox);// 添加复选框
QCheckBox *checkBox = new QCheckBox("启用");
checkBox->setChecked(true);
tableWidget->setCellWidget(2, 3, checkBox);

上下文菜单

cpp

// 启用上下文菜单
tableWidget->setContextMenuPolicy(Qt::CustomContextMenu);connect(tableWidget, &QTableWidget::customContextMenuRequested, [this](const QPoint &pos) {QMenu *menu = new QMenu(this);QAction *addAction = menu->addAction("添加行");QAction *deleteAction = menu->addAction("删除行");QAction *editAction = menu->addAction("编辑");QAction *selectedAction = menu->exec(tableWidget->viewport()->mapToGlobal(pos));if (selectedAction == addAction) {tableWidget->insertRow(tableWidget->currentRow() + 1);} else if (selectedAction == deleteAction) {tableWidget->removeRow(tableWidget->currentRow());}delete menu;
});

8. 完整示例

cpp

#include <QApplication>
#include <QTableWidget>
#include <QVBoxLayout>
#include <QWidget>
#include <QHeaderView>int main(int argc, char *argv[])
{QApplication app(argc, argv);QWidget window;QVBoxLayout *layout = new QVBoxLayout(&window);// 创建表格QTableWidget *table = new QTableWidget(5, 4);// 设置表头QStringList headers;headers << "ID" << "姓名" << "年龄" << "职业";table->setHorizontalHeaderLabels(headers);// 填充数据QStringList data[] = {{"1", "张三", "25", "工程师"},{"2", "李四", "30", "设计师"},{"3", "王五", "28", "经理"},{"4", "赵六", "35", "总监"},{"5", "钱七", "26", "开发"}};for (int row = 0; row < 5; ++row) {for (int col = 0; col < 4; ++col) {QTableWidgetItem *item = new QTableWidgetItem(data[row][col]);table->setItem(row, col, item);}}// 设置样式table->setStyleSheet("QTableWidget {""    gridline-color: #d0d0d0;""    background-color: white;""}""QHeaderView::section {""    background-color: #f0f0f0;""    padding: 4px;""    border: 1px solid #cccccc;""    font-weight: bold;""}");// 设置列宽table->setColumnWidth(0, 50);table->setColumnWidth(1, 100);table->setColumnWidth(2, 80);table->horizontalHeader()->setStretchLastSection(true);layout->addWidget(table);window.resize(600, 400);window.show();return app.exec();
}

9. 性能优化建议

cpp

// 批量操作时禁用刷新
tableWidget->setUpdatesEnabled(false);// 进行大量数据操作...
for (int i = 0; i < 1000; ++i) {tableWidget->insertRow(i);// 填充数据...
}// 操作完成后启用刷新
tableWidget->setUpdatesEnabled(true);// 或者使用阻塞信号
tableWidget->blockSignals(true);
// 进行数据操作...
tableWidget->blockSignals(false);

10. QTableWidget 完整样式

1）. 基本表格样式

css

/* 表格整体样式 */
QTableWidget {background-color: white;border: 1px solid #d0d0d0;border-radius: 4px;gridline-color: #e0e0e0;outline: 0; /* 移除焦点边框 */alternate-background-color: #f8f8f8; /* 交替行背景色 */selection-background-color: #e3f2fd; /* 选中背景色 */selection-color: black; /* 选中文字颜色 */
}

2）. 表头样式

css

/* 水平表头 */
QHeaderView::section:horizontal {background-color: #f0f0f0;padding: 12px 15px;border: 1px solid #cccccc;border-left: none;font-size: 14px;font-weight: bold;color: #333333;
}/* 垂直表头（行号） */
QHeaderView::section:vertical {background-color: #f0f0f0;padding: 8px;border: 1px solid #cccccc;border-top: none;font-size: 12px;color: #666666;
}/* 表头悬停效果 */
QHeaderView::section:hover {background-color: #e8e8e8;
}/* 表头按下效果 */
QHeaderView::section:pressed {background-color: #d8d8d8;
}/* 表头排序指示器 */
QHeaderView::section:sort-indicator {subcontrol-position: right center;
}

3）. 单元格样式

css

/* 所有单元格基础样式 */
QTableWidget::item {font-size: 13px;font-family: 'Microsoft YaHei', 'Segoe UI';padding: 8px 10px;border: none;color: #333333;background-color: white;
}/* 交替行颜色 */
QTableWidget::item:alternate {background-color: #f8f8f8;
}/* 选中状态 */
QTableWidget::item:selected {background-color: #bbdefb;color: #000000;font-weight: bold;
}/* 悬停状态 */
QTableWidget::item:hover {background-color: #f5f5f5;
}/* 焦点状态 */
QTableWidget::item:focus {border: 2px solid #2196f3;background-color: #e3f2fd;
}/* 禁用状态 */
QTableWidget::item:disabled {color: #999999;background-color: #f0f0f0;
}

4）. 行列样式

css

/* 特定列样式 */
QTableWidget::item[column="0"] {/* 第一列样式 */font-weight: bold;color: #1976d2;
}QTableWidget::item[column="1"] {/* 第二列样式 */text-align: center;
}QTableWidget::item[column="2"] {/* 第三列样式 */text-align: right;color: #388e3c;
}/* 特定行样式 */
QTableWidget::item[row="0"] {/* 第一行样式 */background-color: #fffde7;
}QTableWidget::item[row="last"] {/* 最后一行样式 */border-bottom: 2px solid #bdbdbd;
}

5）. 滚动条样式

css

/* 垂直滚动条 */
QScrollBar:vertical {border: none;background-color: #f0f0f0;width: 12px;margin: 0px;
}QScrollBar::handle:vertical {background-color: #c0c0c0;border-radius: 6px;min-height: 30px;
}QScrollBar::handle:vertical:hover {background-color: #a0a0a0;
}QScrollBar::add-line:vertical, QScrollBar::sub-line:vertical {height: 0px;
}/* 水平滚动条 */
QScrollBar:horizontal {border: none;background-color: #f0f0f0;height: 12px;margin: 0px;
}QScrollBar::handle:horizontal {background-color: #c0c0c0;border-radius: 6px;min-width: 30px;
}QScrollBar::handle:horizontal:hover {background-color: #a0a0a0;
}QScrollBar::add-line:horizontal, QScrollBar::sub-line:horizontal {width: 0px;
}

6）. 角落按钮样式

css

/* 表格角落按钮 */
QTableCornerButton::section {background-color: #f0f0f0;border: 1px solid #cccccc;border-top-left-radius: 3px;
}

7）. 编辑状态样式

css

/* 编辑状态 */
QTableWidget::item:edit {background-color: #fff8e1;border: 2px solid #ffb300;
}/* 编辑器样式 */
QLineEdit {font-size: 13px;padding: 4px;border: 1px solid #bdbdbd;border-radius: 3px;background-color: white;
}QLineEdit:focus {border: 2px solid #2196f3;
}

8）. 完整样式示例

css

QTableWidget {background-color: #ffffff;border: 1px solid #d0d0d0;border-radius: 6px;gridline-color: #e0e0e0;outline: 0;alternate-background-color: #fafafa;
}QTableWidget::item {font-size: 14px;font-family: 'Microsoft YaHei';padding: 10px 12px;border: none;color: #2c3e50;background-color: transparent;
}QTableWidget::item:selected {background-color: #3498db;color: white;font-weight: bold;
}QTableWidget::item:hover {background-color: #ecf0f1;
}QTableWidget::item:alternate {background-color: #f8f9fa;
}QHeaderView::section {background-color: #34495e;color: white;padding: 12px 15px;border: 1px solid #2c3e50;font-size: 14px;font-weight: bold;
}QHeaderView::section:hover {background-color: #2c3e50;
}QHeaderView::section:pressed {background-color: #1a2530;
}/* 滚动条样式 */
QScrollBar:vertical {background: #f1f1f1;width: 10px;
}QScrollBar::handle:vertical {background: #c1c1c1;border-radius: 5px;
}QScrollBar::handle:vertical:hover {background: #a8a8a8;
}

9）. C++ 代码中的样式设置

cpp

void setupTableStyle()
{QString styleSheet = "QTableWidget {""    background-color: white;""    border: 1px solid #d0d0d0;""    gridline-color: #e0e0e0;""    alternate-background-color: #f8f8f8;""}""QTableWidget::item {""    font-size: 14px;""    font-family: 'Microsoft YaHei';""    padding: 8px;""    border: none;""    color: #333333;""}""QTableWidget::item:selected {""    background-color: #e3f2fd;""    color: black;""}""QHeaderView::section {""    background-color: #f0f0f0;""    padding: 10px;""    border: 1px solid #cccccc;""    font-weight: bold;""}";ui->tableWidget->setStyleSheet(styleSheet);// 启用交替行颜色ui->tableWidget->setAlternatingRowColors(true);// 设置行高ui->tableWidget->verticalHeader()->setDefaultSectionSize(40);// 隐藏垂直表头ui->tableWidget->verticalHeader()->setVisible(false);
}

10）. 响应式样式

cpp

// 根据屏幕DPI调整样式
void adjustTableStyleForDPI()
{int fontSize = 12;int padding = 6;int rowHeight = 35;// 根据DPI缩放qreal dpi = QApplication::primaryScreen()->logicalDotsPerInch() / 96.0;fontSize = qRound(fontSize * dpi);padding = qRound(padding * dpi);rowHeight = qRound(rowHeight * dpi);QString style = QString("QTableWidget::item {""    font-size: %1px;""    padding: %2px;""}""QHeaderView::section {""    font-size: %3px;""    padding: %4px;""}").arg(fontSize).arg(padding).arg(fontSize + 2).arg(padding + 2);ui->tableWidget->setStyleSheet(style);ui->tableWidget->verticalHeader()->setDefaultSectionSize(rowHeight);
}

QTableWidget 是一个功能丰富的控件，适合显示和编辑表格数据。对于非常大的数据集，考虑使用 QTableView 和自定义模型以获得更好的性能。