【qt】QTableWidget 表格组件

news2024/10/6 16:24:09

QTableWidget 表格组件

  • 一.应用场景
  • 二.初始化表格
    • 1.界面拖放
    • 2.设置列数
    • 3.表头的处理
      • ①：表头装的是啥
      • ②：设置为标头
      • ③：设置列宽的模式
    • 4.设置行数
    • 5.添加每个单元格
      • ①：设置单元格信息
      • ②：添加单元格
      • ③：单元格附加值
      • ④：单元格文本对其方式
  • 三.编辑功能
    • 1.编辑逻辑
    • 2.设置编辑触发器
    • 3.实现编辑action
  • 四.插入功能
    • 1.插入逻辑
    • 2.获取当前行
    • 3.插入行
    • 4.选择新行
    • 5.能否编辑
  • 五.删除功能
    • 1.删除逻辑
    • 2.获取当前选中的单元格
    • 3.判断单元格是否被选中
    • 4.删除行
  • 六.查找功能
    • 1.查找逻辑
    • 2.查找字符
    • 3.设置选中
    • 4.设置样式表
    • 5.清除高亮
  • 七.显示信息
    • 1.显示逻辑
    • 2.信号
    • 3.读出单元格的信息
  • 八.总结

一.应用场景

顾名思义，就是我们日常使用的一些表格，可以进行增删改查的功能。
我们还是来跟着一个项目来边做边学。
目标图：
在这里插入图片描述
话不多说，直接开肝！

二.初始化表格

1.界面拖放

记得先添加资源哦，需要的可以dd我。
在这里插入图片描述
OK，界面我就拖好了，如果不会的，可以跟我说，这个前面一直有讲，应该都会了把，不会的可以看看前面的。

2.设置列数

void MainWindow::initUI()
{
    QStringList headList={"姓名","性别","出生日期","职位","是否已婚"};
    ui->tableWidget->setColumnCount(headList.count());

}

运行结果：
在这里插入图片描述

3.表头的处理

①：表头装的是啥

里面是装的QTableWidgetItem，可以理解为一个单元格，可以用我们刚刚的列表来初始化单元格的内容

for(int i=0;i<ui->tableWidget->columnCount();i++)
    {
        QTableWidgetItem*item=new QTableWidgetItem(headList[i]);
    }

②：设置为标头

 for(int i=0;i<ui->tableWidget->columnCount();i++)
    {
        QTableWidgetItem*item=new QTableWidgetItem(headList[i]);       
        ui->tableWidget->setHorizontalHeaderItem(i,item);
        
    }

运行结果：
在这里插入图片描述

③：设置列宽的模式

但是现在表头非常的丑陋，不能自适应我们的窗口。
解决方法通过表头视图来设置列宽模式。

QHeaderView*headView= ui->tableWidget->horizontalHeader();//返回表头的视图
    headView->setSectionResizeMode(QHeaderView::Stretch);//可伸展

运行结果：
在这里插入图片描述
现在还有个问题，我们明明是表头，肯定要设置一点特殊的字体了

for(int i=0;i<ui->tableWidget->columnCount();i++)
    {
        QTableWidgetItem*item=new QTableWidgetItem(headList[i]);
        ui->tableWidget->setHorizontalHeaderItem(i,item);
        QFont font=item->font();
        font.setPointSize(12);//设置字体大小
        font.setBold(true);//设置字体为粗体
        font.setFamily("微软雅黑");//设置字体样式
        item->setFont(font);
        item->setForeground(Qt::red);//设置字体颜色
    }

运行结果：
在这里插入图片描述
nice,有那个味道了。
还可以教大家一个玩法，可以设置表头的固定宽度。
但是在设置的时候，要先将刚刚的扩展模式改正固定的模式。

headView->setSectionResizeMode(1，QHeaderView::Fixed);

这些参赛都可以通过帮助文档来找，前面的1参数就是对第一列有效，也就是性别项。
在这里插入图片描述
现在我们就可以来固定大小了

ui->tableWidget->setColumnWidth(1,100);

运行结果：
在这里插入图片描述
是不是非常的优雅？

4.设置行数

一个表，有列就当然有行了，接下来，我们来添加行。

 int rows=100;
 ui->tableWidget->setRowCount(rows);

5.添加每个单元格

①：设置单元格信息

我们可以来创建一个函数来实现我们行信息的初始化，这里使用了随机数来模拟我们的数据。

QStringList jobs={"开发商","高级工程师","架构师","程序员","牛马"};
for(int i=0;i<rows;i++)
    {
        MaxNo++;//每创建一行，我就计数加1
        creatRows(i,QString::asprintf("员工%d",MaxNo),MaxNo,rand()%2?"男":"女",
                  QDate(rand()%2000+10,rand()%12+1,rand()%30+1),jobs[rand()%5],rand()%2);
    }

在mainwindow.cpp中添加一个成员函数和一个计数的MaxNo,记得对于时间参数姚家一个头文件。

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QDate>

QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private:
    Ui::MainWindow *ui;
    void initUI();
    int MaxNo;
    void creatRows(int rowNumber,QString name,int number,QString gender,QDate birthday,QString job,bool married);
};
#endif // MAINWINDOW_H

②：添加单元格

基本逻辑就是先创建一个单元格，然后用setItem来加到表格中。

void MainWindow::creatRows(int rowNumber,QString name,int number,QString gender,QDate birthday,QString job,bool married)
{
    QTableWidgetItem*item=new QTableWidgetItem(name);
    item->setData(Qt::UserRole,QVariant(number));//添加附加值
    ui->tableWidget->setItem(rowNumber,0,item);//设置单元格信息

    item=new QTableWidgetItem(gender);
    QIcon icon;
    if(gender=="男")
    {
        icon.addFile(":/image/boy.png");
    }
    else
    {
        icon.addFile(":/image/girl.png");
    }
    item->setIcon(icon);//这个是显示图片的，下面的截图忘记添加了
    ui->tableWidget->setItem(rowNumber,1,item);

    item=new QTableWidgetItem(birthday.toString("yyyy-MM-dd"));
    ui->tableWidget->setItem(rowNumber,2,item);

    item=new QTableWidgetItem(job);
    ui->tableWidget->setItem(rowNumber,3,item);

    item=new QTableWidgetItem(married?"已婚":"未混");
    if(married)
    {
        item->setBackground(Qt::gray);//还可以设置背景色
    }
    ui->tableWidget->setItem(rowNumber,4,item);

}

③：单元格附加值

item->setData(Qt::UserRole,QVariant(number));//添加附加值

④：单元格文本对其方式

现在的运行结果：
在这里插入图片描述
我们可以发现我们单元格的信息没有居中，我们可以通过setTextAlignment接口来设置

item->setTextAlignment(Qt::AlignHCenter|Qt::AlignVCenter);

参数可以在F1文档中去查找：
在这里插入图片描述
运行结果：
在这里插入图片描述
哈哈，我们的表格就生成好了，是不是很完美哈哈，接下来我们要来添加功能了，让表格动起来！

三.编辑功能

1.编辑逻辑

就是有一个接口可以设置表格编辑的触发器，来使我们可以控制表格是否可以被编辑。

2.设置编辑触发器

默认状态下表格是可以进行编辑的
在这里插入图片描述
现在我们来设置不能对其进行编辑。
在mianWindow的构造函数里添加

ui->tableWidget->setEditTriggers(QAbstractItemView::NoEditTriggers);

参数还是可以通过F1在线文档去找。

在这里插入图片描述
现在就不可以编辑了。

3.实现编辑action

根据是否打开复选框acyion来设置编辑触发器的模式来控制是否能编辑。

void MainWindow::on_actionEdit_triggered(bool checked)
{
    if(checked)
    {
        //双击和选中单击都可以进行编辑
        ui->tableWidget->setEditTriggers(QAbstractItemView::DoubleClicked|QAbstractItemView::SelectedClicked);
    }
    else
    {
        //禁止编辑
        ui->tableWidget->setEditTriggers(QAbstractItemView::NoEditTriggers);
    }
}

运行结果：
在这里插入图片描述

四.插入功能

1.插入逻辑

我们要获取我们鼠标的位置来确定我们要插入的位置，其次插入有一个接口可以实现插入一行，但是是空行，所以首先需要我们先创建一行。

2.获取当前行

int currentRow=ui->tableWidget->currentRow();

3.插入行

通过我们刚刚的函数来创建行信息

    MaxNo++;//插一行计算加1
    ui->tableWidget->insertRow(currentRow);
    creatRows(currentRow,"未知",MaxNo,"男",QDate(2000,1,1),"未知",false);

4.选择新行

在这里插入图片描述
现在有个问题就是当我插入新行时，他会选择刚刚插入的那个位置，而不是我们新插入的位置。
解决办法：

 ui->tableWidget->selectRow(currentRow);

在这里插入图片描述

5.能否编辑

现在还有一个问题，我们新插入的数据居然不能编辑，这不就插了更没有插入一样的嘛。

void MainWindow::on_actionInsert_triggered()
{
    int currentRow=ui->tableWidget->currentRow();
    //对当前行添加信息

    MaxNo++;
    ui->tableWidget->insertRow(currentRow);
    ui->tableWidget->selectRow(currentRow);
    creatRows(currentRow,"未知",MaxNo,"男",QDate(2000,1,1),"未知",false);
    on_actionEdit_triggered(true);//插入的时候，可以将编辑功能打开
}

在这里插入图片描述
现在就可以进行编辑了。
但是又出现一个小问题
就是我们肯定只希望只能编辑插入的数据，结果这样一开，所有的行都能编辑了。
解决方案：我们可以通过表格的信号来判断，我当前的光标位置是不是在我刚刚插入的位置，是就打开编辑，不是就关闭编辑。
如果默认打开编辑功能，那这种情况不存在。
选择这个信号：

在插入功能函数中记录插入的位置

insertRow=currentRow;

void MainWindow::on_tableWidget_itemSelectionChanged()
{
    if(ui->actionEdit->isChecked()) return;

    if(insertRow==ui->tableWidget->currentRow())
    {
        on_actionEdit_triggered(true);
    }
    else
    {
        on_actionEdit_triggered(false);
    }
}

运行结果：
在这里插入图片描述

五.删除功能

1.删除逻辑

通过获取当前光标在的单元格位置，来删除单元格所在的行。

2.获取当前选中的单元格

void MainWindow::on_actionDel_triggered()
{
    auto item=ui->tableWidget->currentItem();        
    ui->tableWidget->removeRow(item->row());
}

运行结果：
在这里插入图片描述
这样有个问题就是，当我们删除后，没有进行选择，但是还是可以删除，所以我们要进行是否被选中的判断。

3.判断单元格是否被选中

void MainWindow::on_actionDel_triggered()
{
    auto item=ui->tableWidget->currentItem();
    if(item->isSelected())
    {
       ui->tableWidget->removeRow(item->row());
    }
    
}

问题就被完美的解决了。

4.删除行

ui->tableWidget->removeRow(item->row());

六.查找功能

1.查找逻辑

我们是在行编辑器中去输入字符串，通过按钮来关联槽函数来进行包含查找，查找到就进行选中，同时来搞一个高亮显示。

2.查找字符

因为我们打算是在状态栏加lineedit和pushbutton所以我们只能用代码来进行添加。

    lineFind=new QLineEdit;
    button=new QPushButton;
    label=new QLabel;
    
    statusBar()->addWidget(lineFind);
    statusBar()->addWidget(button);
    statusBar()->addWidget(label);
    
    lineFind->setMaximumWidth(200);
    button->setText("查找");
    connect(button,SIGNAL(clicked()),this,SLOT(onButtonFind()));//对按钮进行自己定义的槽函数关联

运行结果：
在这里插入图片描述

void MainWindow::onButtonFind()
{
    QString ret=lineFind->text().trimmed();//去除开头和结尾的空白符
    if(ret.length()>0)
    {
        //包含模式查找，返回的是一个容器链表
        auto items=ui->tableWidget->findItems(ret,Qt::MatchContains);
        //遍历所有查找到的结果将其设置为选中
        for(auto it=items.begin();it!=items.end();it++)
        {
            (*it)->setSelected(true);
        }
    }
}

3.设置选中

 //遍历所有查找到的结果将其设置为选中
        for(auto it=items.begin();it!=items.end();it++)
        {
            (*it)->setSelected(true);
        }

4.设置样式表

在这里插入图片描述
可以看成查到了牛马，但是这个颜色太浅了，我们可以来设置选中的样式表来高亮显示。

ui->tableWidget->setStyleSheet("selection-background-color:rgb(255,128,0)");

运行结果;
在这里插入图片描述
这就很清晰了，但是有个问题就是我们下次查询的时候，这些高亮还是在，所有我们要进行清除选中。

5.清除高亮

ui->tableWidget->clearSelection();//清除选中

这就很爽了，你们可以试试。

七.显示信息

1.显示逻辑

当我们随便选择一个单元格的时候，我们就在标签上，显示该单元格所在的一行信息。

2.信号

在这里插入图片描述

3.读出单元格的信息

void MainWindow::on_tableWidget_cellClicked(int row, int column)
{
    QString ret;
    for(int i=0;i<ui->tableWidget->columnCount();i++)
    {
        ret+=ui->tableWidget->item(row,i)->text()+"/";
    }
    label->setText(ret);
}

运行结果：
在这里插入图片描述

八.总结

表格的构建先列（表头）后行,每一个数据都是通过单元格进行设置。
其次就是对增删改查功能的设计的掌握。

人的一切痛苦，本质上都是对自己无能的愤怒。

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1707531.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

P148--章节作业1

P148--章节作业1

编辑 编辑 public class Main {public static void main(String args[]){double yxq100000;int cishu0;while(true) {if(yxq > 50000) {yxq yxq - yxq * 0.05;cishucishu1;}else if(yxq > 1000){yxq yxq - 1000;cishucishu1;}else{break;}}System.out.print(cishu);} …
阅读更多...
安装部署统信UOS服务器操作系统1070e

安装部署统信UOS服务器操作系统1070e

原文链接&#xff1a;安装部署统信UOS服务器操作系统1070e Hello&#xff0c;大家好啊&#xff01;今天给大家带来一篇关于安装部署统信UOS服务器操作系统1070e的文章。统信UOS是一款基于Linux的国产操作系统&#xff0c;以其安全性和稳定性受到广泛关注。本文将详细介绍如何安…
阅读更多...
Android 11 Audio音频系统配置文件解析

Android 11 Audio音频系统配置文件解析

在AudioPolicyService的启动过程中&#xff0c;会去创建AudioPolicyManager对象&#xff0c;进而去解析配置文件 //frameworks/av/services/audiopolicy/managerdefault/AudioPolicyManager.cpp AudioPolicyManager::AudioPolicyManager(AudioPolicyClientInterface *clientIn…
阅读更多...
Java常用工具类、包装类

Java常用工具类、包装类

1、工具类的设计 一般地&#xff0c;把那些完成通用功能的方法分类存放到类中&#xff0c;这些类就叫工具类。 工具类起名&#xff1a;XxxUtil、XxxUtils、XxxTool、XxxTools等&#xff0c;其中Xxx表示一类事物&#xff0c;比如ArrayUtil、StringUtil、JdbcUtil。 工具类存放的…
阅读更多...
亚马逊云科技峰会福利来啦

亚马逊云科技峰会福利来啦

2024 亚马逊云科技中国峰会&#xff0c;挑战俱乐部 Hands On 动手实验课程正在直播中&#xff0c;点击链接畅享生成式AI建构之旅&#xff0c;赢心动好礼 &#xff08;直播链接Link&#xff09; 只看不过瘾&#xff1f;别急&#xff01;我们为您准备了【生成式AI助手 Amazon Q 初…
阅读更多...
JeeSite 4.x and 5.x快速开发平台前端技术探索与实践

JeeSite 4.x and 5.x快速开发平台前端技术探索与实践

一、引言 随着企业信息化建设的不断推进&#xff0c;对于快速、高效、安全的企业级应用需求日益增长。JeeSite作为一款企业级快速开发平台&#xff0c;以其强大的后端功能和灵活的前端架构&#xff0c;为开发者提供了强大的支持。本文旨在探讨JeeSite快速开发平台在前端技术方…
阅读更多...
File类.Java

File类.Java

一、File类 1&#xff0c;概述&#x1f3c0;&#x1f3c0;&#x1f3c0; &#xff08;1&#xff09; java.io.File类&#xff1a;文件和文件目录路径的抽象表示形式&#xff0c;与平台无关 &#xff08;2&#xff09; File类中涉及到关于文件或文件目录的创建、删除、重命…
阅读更多...
vue 表格 随手笔记

vue 表格 随手笔记

对表格中单元格回显 做循环 <template slot-scope"scope"> <el-table-column label"责任网格类型" align"center"><template slot-scope"scope"><div v-for"(item, index ) in gridDutyTypeList">&…
阅读更多...
C# 工商银行缺少infosecapiLib.infosec

C# 工商银行缺少infosecapiLib.infosec

搜索Tlbimp.exe 这里使用4.8.1下的处理&#xff0c;以管理员身份打开powershell cd "C:\Program Files (x86)\Microsoft SDKs\Windows\v10.0A\bin\NETFX 4.8.1 Tools".\TlbImp.exe "G:\CSharp\icbc-api-sdk-cop-c#\sdk-cop\sdk-cop\dll\infosecapi.dll" …
阅读更多...
破解微信校验难题，Xinstall助你轻松实现Universal Link功能！

破解微信校验难题，Xinstall助你轻松实现Universal Link功能！

在移动互联网时代&#xff0c;App的推广和运营离不开各种技术手段的支持。其中&#xff0c;Universal Link作为连接App和网页的重要桥梁&#xff0c;被广大开发者所青睐。然而&#xff0c;很多开发者在使用Universal Link时遇到了微信校验不通过的问题&#xff0c;这不仅影响了…
阅读更多...
【Linux】-Kafka集群安装部署[18]

【Linux】-Kafka集群安装部署[18]

简介 Apache Kafka是一款分布式的、去中心化的、高吞吐低延迟、订阅模式的消息队列系统。 同RabbitMQ一样&#xff0c;Kafka也是消息队列。不过RabbitMQ多用于后端系统&#xff0c;因其更加专注于消息的延迟和容错。 Kafka多用于大数据体系&#xff0c;因其更加专注于数据的…
阅读更多...
CLIP 源码分析：model.py 文件

CLIP 源码分析：model.py 文件

from collections import OrderedDict from typing import Tuple, Unionimport numpy as np import torch import torch.nn.functional as F from torch import nn# 上面都是头文件Bottleneck类的作用 残差网络 ResNet 等我再去补一补相关知识。 # 这段代码定义了一个名为 Bot…
阅读更多...
在MySQL中，Linux表同步到Windows，有大小写的就没同步的详细解决方案

在MySQL中，Linux表同步到Windows，有大小写的就没同步的详细解决方案

在 Linux 系统上&#xff0c;文件名是区分大小写的&#xff0c;而在 Windows 系统上&#xff0c;文件名通常不区分大小写。导致在从 Linux 同步文件到 Windows 时&#xff0c;有些文件因为名称冲突而无法同步。为了有效解决这个问题&#xff0c;可以采取以下方法&#xff1a; …
阅读更多...
.NET 轻量级、高效任务调度器：ScheduleTask

.NET 轻量级、高效任务调度器：ScheduleTask

前言 至于任务调度这个基础功能&#xff0c;重要性不言而喻&#xff0c;大多数业务系统都会用到,世面上有很多成熟的三方库比如Quartz&#xff0c;Hangfire&#xff0c;Coravel 这里我们不讨论三方的库如何使用 而是从0开始自己制作一个简易的任务调度,如果只是到分钟级别的粒…
阅读更多...
vue2 案例入门

vue2 案例入门

vue2 案例入门 1 vue环境2 案例2.1 1.v-text v-html2.2 v-bind2.3 v-model2.4 v-on2.5 v-for2.6 v-if和v-show2.7 v-else和v-else-if2.8 计算属性和侦听器2.9 过滤器2.10 组件化2.11 生命周期2.12 使用vue脚手架2.13 引入ElementUI2.13.1 npm方式安装2.13.2 main.js导入element…
阅读更多...
本地源码方式部署启动MaxKB知识库问答系统，一篇文章搞定！

本地源码方式部署启动MaxKB知识库问答系统，一篇文章搞定！

MaxKB 是一款基于 LLM 大语言模型的知识库问答系统。MaxKB Max Knowledge Base&#xff0c;旨在成为企业的最强大脑。 开箱即用&#xff1a;支持直接上传文档、自动爬取在线文档&#xff0c;支持文本自动拆分、向量化、RAG&#xff08;检索增强生成&#xff09;&#xff0c;智…
阅读更多...
YOLOv5改进 | 注意力机制 | 添加全局注意力机制 GcNet【附代码+小白必备】

YOLOv5改进 | 注意力机制 | 添加全局注意力机制 GcNet【附代码+小白必备】

&#x1f4a1;&#x1f4a1;&#x1f4a1;本专栏所有程序均经过测试&#xff0c;可成功执行&#x1f4a1;&#x1f4a1;&#x1f4a1; 非局部网络通过将特定于查询的全局上下文聚合到每个查询位置&#xff0c;为捕获长距离依赖关系提供了一种开创性的方法。然而&#xff0c;通…
阅读更多...
Android 13 高通设备热点低功耗模式

Android 13 高通设备热点低功耗模式

需求： Android设备开启热点，使Iphone设备连接，自动开启低数据模式 低数据模式： 低数据模式是一种在移动网络或Wi-Fi环境下，通过限制应用程序的数据使用、降低数据传输速率或禁用某些后台操作来减少数据流量消耗的优化模式。 这种模式主要用于节省数据流量费用，特别是…
阅读更多...
Github Page 部署失败

Github Page 部署失败

添加 .gitmodules 文件 [submodule "themes/ayer"]path themes/ayerurl https://github.com/Shen-Yu/hexo-theme-ayer.git 添加 .nojekyll 文件
阅读更多...
使用 Orange Pi AIpro开发板基于 YOLOv8 进行USB 摄像头实时目标检测

使用 Orange Pi AIpro开发板基于 YOLOv8 进行USB 摄像头实时目标检测

文章大纲 简介算力指标与概念香橙派 AIpro NPU 纸面算力直观了解 手把手教你开机与基本配置开机存储挂载设置风扇设置 使用 Orange Pi AIpro进行YOLOv8 目标检测Pytorch pt 格式直接推理NCNN 格式推理 是否可以使用Orange Pi AIpro 的 NPU 进行推理 呢&#xff1f;模型开发流程…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023