【Qt】Qt多元素控件深入解析与实战应用:列表(QListWidget)、表格(QTableWidget)与树形(QTreeWidget)结构

文章目录

  • 前言：
  • Qt中多元素控件：
  • 1. List Widget
    • 1.1. 代码示例: 使用 ListWidget
  • 2.Table Widget
    • 2.1. 代码示例: 使用 QTableWidget
  • 3. Tree Widget
    • 3.1. 代码示例: 使用 QTreeWidget
  • 总结：

前言：

在Qt框架中，用户界面的构建是一个至关重要的环节，而其中多元素控件的使用更是构建丰富用户界面的核心。本文将深入探讨Qt中的三种主要多元素控件：List Widget、Table Widget和Tree Widget。通过详细的代码示例和功能解析，本文旨在帮助开发者更好地理解和运用这些控件，以创建具有交互性和功能性的应用程序界面。无论是初学者还是有经验的开发者，都能从本文中获得有价值的信息和启发。

Qt中多元素控件：

Qt 中多元素控件有：
列表： QListWidget + QListView
表格: QTableWidget + QTableView
树形：QTreeWidget + QTreeView

  • xxWidget 与 xxView 是啥区别？
    xxView 是更底层的实现。
    xxWidget 是 基于 xxView 封装而来的。

此处xxView 是 MVC 结构的一种典型实现 MVC 也是软件开发中，非常经典的 软件结构的组织形式了

M：model 数据
V：view 视图（界面）
C：controller 控制器，数据和是同之间的业务流程

  • xxView 只是负责实现了视图，不负责数据如何存储表述，更不负责数据是同之间的交互。因此，如果使用xxView就需要程序员自己实现 model 和 controller 的部分，就比较麻烦。

  • xxWidget 基于 xxView 同时把 model 和 control 都帮我们实现好了，拿过来就可以使用，人家提供了功能很方便的api，让我们直接就用。

  • xxWidget 使用起来比较方便，但是功能会比较的有限。

  • xxView 使用起来更麻烦一些，但可以根据情况自由 DIY ,实现一些更复杂的功能。

1. List Widget

使用 QListWidget 都能显示一个纵向的列表，形如：
在这里插入图片描述
列表中的每一个元素/每一项就称为一个 Item
更具体的说，通过 QListWidgetItem 类表示的！

在这里插入图片描述
在这里插入图片描述

此处的row参数就表示插入完毕之后的元素在第几行，把新元素插入到第几行之前。

takeItem：take 也是用来表示 “删除” 术语 (erase、remove、delete、take)

在这里插入图片描述

1.1. 代码示例: 使用 ListWidget

先往这里添加一些元素

  • 添加方式 1：
ui->listWidget->addItem("C++");
ui->listWidget->addItem("Java");
ui->listWidget->addItem("Python");
  • 添加方式 2：
ui->listWidget->addItem(new QListWidgetItem("C++"));
ui->listWidget->addItem(new QListWidgetItem("Java"));
ui->listWidget->addItem(new QListWidgetItem("Python"));

在 QListWidgetItem 中， 可以设置字体属性，设置图标，设置文字大小， 设置是否被选中等状态。

  • 添加方式 3 ： 通过图形化界面进行添加
    在这里插入图片描述
    通过图形化界面，右键 QListWidget，选择编辑项目就可以之间添加内容。
  • 如果这里初始化内容是固定的，此时你通过那种方式来初始化都可以。
  • 如果这里的内容不是固定的，就要通过 读取文件/读取网络 来构造数据，就需要通过代码的方式来添加了。
#include "widget.h"
#include "ui_widget.h"
#include <QDebug>Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);// 先往这里添加一些元素// 添加方式 1ui->listWidget->addItem("C++");ui->listWidget->addItem("Java");ui->listWidget->addItem("Python");//    // 添加方式 2
//    ui->listWidget->addItem(new QListWidgetItem("C++"));
//    ui->listWidget->addItem(new QListWidgetItem("Java"));
//    ui->listWidget->addItem(new QListWidgetItem("Python"));// 添加方式 3 ： 通过图形化界面进行添加
}Widget::~Widget()
{delete ui;
}void Widget::on_pushButton_insert_clicked()
{// 1. 先获取到输入框中的内容const QString& text = ui->lineEdit->text();// 2. 添加到 QListWidget 中ui->listWidget->addItem(text);
}void Widget::on_pushButton_delete_clicked()
{// 1. 先获取到被选中的元素是哪个int row = ui->listWidget->currentRow();if (row < 0) {return;}// 2. 按行号来删除元素ui->listWidget->takeItem(row);
}void Widget::on_listWidget_currentItemChanged(QListWidgetItem *current, QListWidgetItem *previous)
{// 通过这个槽函数来感知到变化if (current != nullptr) {qDebug() << "当前选中的元素：" << current->text();}if (previous != nullptr) {qDebug() << "上选中的元素：" << previous->text();}}

在这里插入图片描述

2.Table Widget

使用 QTableWidget 表示一个表格控件，一个表格中包含若干行，每一行又包含若干列。
表格中的每一个单元，是一个 QTableWidgetItem 对象。
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

2.1. 代码示例: 使用 QTableWidget

在这里插入图片描述

如果当前表格中的数据是固定的，完全可以通过图形化的方式来进行编辑，但实际开发中，很多时候数据是从 文件/网络 加载过来的， 此时通过图形化编辑就不合适了。

  • 通过代码编写：
#include "widget.h"
#include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);// 创建 3 行ui->tableWidget->insertRow(0);ui->tableWidget->insertRow(1);ui->tableWidget->insertRow(2);// 创建 3 个列ui->tableWidget->insertColumn(0);ui->tableWidget->insertColumn(1);ui->tableWidget->insertColumn(2);// 给 3 个列设定列名（设施水平方向的表头）ui->tableWidget->setHorizontalHeaderItem(0, new QTableWidgetItem("学号"));ui->tableWidget->setHorizontalHeaderItem(1, new QTableWidgetItem("姓名"));ui->tableWidget->setHorizontalHeaderItem(2, new QTableWidgetItem("年龄"));// 给表格中添加数据ui->tableWidget->setItem(0, 0, new QTableWidgetItem("1001"));ui->tableWidget->setItem(0, 1, new QTableWidgetItem("张三"));ui->tableWidget->setItem(0, 2, new QTableWidgetItem("20"));ui->tableWidget->setItem(1, 0, new QTableWidgetItem("1002"));ui->tableWidget->setItem(1, 1, new QTableWidgetItem("李四"));ui->tableWidget->setItem(1, 2, new QTableWidgetItem("19"));ui->tableWidget->setItem(2, 0, new QTableWidgetItem("1003"));ui->tableWidget->setItem(2, 1, new QTableWidgetItem("王五"));ui->tableWidget->setItem(2, 2, new QTableWidgetItem("21"));
}Widget::~Widget()
{delete ui;
}void Widget::on_pushButton_insertLine_clicked()
{// 需要知道当前一共有多少行int rowCount = ui->tableWidget->rowCount();// 在最后一行之后新增行// 注意此处的参数是 “下标”,表示你新增之后这一行是第几行ui->tableWidget->insertRow(rowCount);
}void Widget::on_pushButton_deleteLine_clicked()
{// 获取选中的行号int curRow = ui->tableWidget->currentRow();// 删除这一行ui->tableWidget->removeRow(curRow);
}void Widget::on_pushButton_insertColumn_clicked()
{// 先获取到一共有几列int colCount = ui->tableWidget->columnCount();// 在对应的位置新增这一列ui->tableWidget->insertColumn(colCount);// 设置列名(从输入框中获取到)const QString& text = ui->lineEdit->text();ui->tableWidget->setHorizontalHeaderItem(colCount, new QTableWidgetItem(text));
}void Widget::on_pushButton_Column_clicked()
{// 获取到选中的列号int curCol = ui->tableWidget->currentColumn();// 删除这一列ui->tableWidget->removeColumn(curCol);
}

在这里插入图片描述

3. Tree Widget

使用 QTreeWidget 表示一个树形控件。里面的每个元素，都是一个 QTreeWidgetItem,每个QTreeWidgetItem 可以包含多个文本和图标，每个文本/图标为一个列。
可以给 QTreeWidget 设置顶层节点(顶层节点可以有多个), 然后再给顶层节点添加子节点, 从而构成树形结构。
在这里插入图片描述
QTreeWidget 控件虽然是树形结构，但是这个树形结构，没有体现出根节点，是从根节点的下一层子节点开始计算的。
在这里插入图片描述
针对顶层节点来说，这里也是一个类似于 “List” 这样的结构 !
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

3.1. 代码示例: 使用 QTreeWidget

#include "widget.h"
#include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget)
{ui->setupUi(this);// 设置根节点的名字ui->treeWidget->setHeaderLabel("动物");// 设置顶层节点QTreeWidgetItem* item1 = new QTreeWidgetItem();// 每个节点都可以设置多个列，此处为了简单就只设置一列item1->setText(0, "猫");// 添加到顶层节点中ui->treeWidget->addTopLevelItem(item1);// 设置顶层节点QTreeWidgetItem* item2 = new QTreeWidgetItem();// 每个节点都可以设置多个列，此处为了简单就只设置一列item2->setText(0, "狗");// 添加到顶层节点中ui->treeWidget->addTopLevelItem(item2);// 设置顶层节点QTreeWidgetItem* item3 = new QTreeWidgetItem();// 每个节点都可以设置多个列，此处为了简单就只设置一列item3->setText(0, "鸟");// 添加到顶层节点中ui->treeWidget->addTopLevelItem(item3);// 添加一些子节点QTreeWidgetItem* item4 = new QTreeWidgetItem();item4->setText(0, "中华田园猫");item1->addChild(item4);QTreeWidgetItem* item5 = new QTreeWidgetItem();item5->setText(0, "布偶猫");item1->addChild(item5);QTreeWidgetItem* item6 = new QTreeWidgetItem();item6->setText(0, "暹罗猫");item1->addChild(item6);
}Widget::~Widget()
{delete ui;
}void Widget::on_pushButton_insertTopLeveItem_clicked()
{// 获取到输入框中的内容const QString& text = ui->lineEdit->text();// 判断输入框是否为空if (text.isEmpty()) {return;}// 构造一个 QTreeWidetITemQTreeWidgetItem * item = new QTreeWidgetItem();item->setText(0, text);// 添加到顶层节点中ui->treeWidget->addTopLevelItem(item);
}void Widget::on_pushButton_insertItem_clicked()
{// 获取到当前选中的节点QTreeWidgetItem* currentItem = ui->treeWidget->currentItem();if (currentItem == nullptr) {return;}// 获取到输入框的内容const QString& text = ui->lineEdit->text();// 判断输入框是否为空if (text.isEmpty()) {return;}// 构造一个 QTreeWidgetItemQTreeWidgetItem* item = new QTreeWidgetItem();item->setText(0, text);// 插入到选中节点的子节点中currentItem->addChild(item);
}void Widget::on_pushButton_deleteItem_clicked()
{// 获取到选中元素QTreeWidgetItem* currentItem = ui->treeWidget->currentItem();if (currentItem == nullptr) {return;}// 删除选中元素， 需要先获取到父元素，通过父元素进行删除QTreeWidgetItem* parent = currentItem->parent();if (parent == nullptr) {// 顶层元素int index = ui->treeWidget->indexOfTopLevelItem(currentItem);ui->treeWidget->takeTopLevelItem(index);} else {// 普通元素parent->removeChild(currentItem);}
}

在这里插入图片描述

总结：

本文详细介绍了Qt中的三种多元素控件：List Widget、Table Widget和Tree Widget，它们分别用于展示列表、表格和树形结构的数据。通过代码示例，我们展示了如何使用这些控件进行数据的添加、删除和修改操作。同时，也解释了xxWidget与xxView之间的区别，以及它们在MVC架构中扮演的角色。xxWidget提供了封装好的模型和控制器，使得开发者可以快速地实现功能，而xxView则提供了更底层的视图实现，允许开发者有更大的灵活性来自定义功能。

然而，需要注意的是，这些控件默认情况下只将数据保存在内存中，一旦程序重启，之前的数据就会丢失。为了实现数据的持久化，开发者需要编写额外的代码，将数据写入文件，并在程序启动时从文件中加载数据。通过本文的学习，开发者应该能够更加熟练地使用Qt中的多元素控件，并理解如何通过编程实现数据的持久化存储。

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

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

相关文章

C语言内存函数超详细讲解

C语言内存函数超详细讲解

个人主页&#xff1a;C忠实粉丝 欢迎 点赞&#x1f44d; 收藏✨ 留言✉ 加关注&#x1f493;本文由 C忠实粉丝 原创 C语言内存函数超详细讲解 收录于专栏【C语言学习】 本专栏旨在分享学习C语言学习的一点学习笔记&#xff0c;欢迎大家在评论区交流讨论&#x1f48c; 目录 1. m…
阅读更多...
C++面向对象程序设计-北京大学-郭炜【课程笔记（十一）】

C++面向对象程序设计-北京大学-郭炜【课程笔记（十一）】

C面向对象程序设计-北京大学-郭炜【课程笔记&#xff08;十一&#xff09;】 1、string&#xff08;重要知识点&#xff09;1.2、string的赋值和链接1.3、比较string1.4、子串1.5、交换string1.6、寻找string中的字符1.7、删除string中的字符1.8、替换string中的字符1.9、在str…
阅读更多...
结构体；结构成员访问操作符

结构体；结构成员访问操作符

结构体&#xff1a; 虽然c语言已经提供了内置类型&#xff0c;比如&#xff1a;char、short、int、long等&#xff0c;但还是不够用&#xff0c;就好比我描述一个人&#xff0c;我需要描述他的身高&#xff0c;体重&#xff0c;年龄&#xff0c;名字等信息&#xff0c…
阅读更多...
微软密谋超级AI大模型！LangChain带你轻松玩转大模型开发

微软密谋超级AI大模型！LangChain带你轻松玩转大模型开发

此前&#xff0c;据相关媒体报道&#xff0c;微软正在研发一款名为MAI-1的最新AI大模型&#xff0c;其参数规模或将达5000亿以上&#xff0c;远超此前微软推出的相关开源模型&#xff0c;其性能或能与谷歌的Gemini 1.5、Anthropic的Claude 3和OpenAI的GPT-4等知名大模型相匹敌。…
阅读更多...
Linux文本处理三剑客（详解）

Linux文本处理三剑客（详解）

一、文本三剑客是什么&#xff1f; 1. 对于接触过Linux操作系统的人来说&#xff0c;应该都听过说Linux中的文本三剑客吧&#xff0c;即awk、grep、sed&#xff0c;也是必须要掌握的Linux命令之一&#xff0c;三者都是用来处理文本的&#xff0c;但侧重点各不相同&#xff0c;a…
阅读更多...
Sam Altman微软Build 2024最新演讲：AI可能是下一个移动互联网

Sam Altman微软Build 2024最新演讲：AI可能是下一个移动互联网

大家好&#xff0c;我是木易&#xff0c;一个持续关注AI领域的互联网技术产品经理&#xff0c;国内Top2本科&#xff0c;美国Top10 CS研究生&#xff0c;MBA。我坚信AI是普通人变强的“外挂”&#xff0c;所以创建了“AI信息Gap”这个公众号&#xff0c;专注于分享AI全维度知识…
阅读更多...
【C++11】lambda匿名函数和包装器

【C++11】lambda匿名函数和包装器

目录 一&#xff0c;lambda匿名函数 1-1&#xff0c;lambda的引入 1-2&#xff0c;lambda表达式书写格式 1-3&#xff0c;lambda函数的名称 1-4&#xff0c;lambda捕获列表的使用 1-5&#xff0c;函数对象与lambda表达式 二&#xff0c;包装器 2-1&#xff0c;function…
阅读更多...
如何使用maven运行SpringBoot程序？

如何使用maven运行SpringBoot程序？

目录 一、什么是maven 二、什么是SpringBoot 三、如何使用maven运行SpringBoot程序&#xff1f; 一、什么是maven Maven&#xff1a;简化Java项目构建的自动化工具 在软件开发的世界里&#xff0c;Maven以其强大的项目管理和构建自动化功能&#xff0c;为Java开发者提供了…
阅读更多...
容器化：ES和Kibana

容器化：ES和Kibana

1 缘起 最近在学习使用ES&#xff0c; 为了找一个功能强大的可视化工具&#xff0c;之前使用了ES-Head&#xff0c;可以满足学习需求。 闲暇时间又折腾了另一个工具Kibana&#xff0c; 分享如下。 Kibana优点&#xff1a; 用户友好性&#xff1a;Kibana提供直观易用的用户界面…
阅读更多...
Strategy设计模式

Strategy设计模式

Strategy设计模式举例。 看图&#xff1a; 代码实现&#xff1a; #include <iostream>using namespace std;class FlyBehavior { public:virtual void fly() 0; };class QuackBehavior { public:virtual void quack() 0; };class FlyWithWings :public FlyBehavior …
阅读更多...
数据库（vb.net+OleDB+Access）简易学生信息管理系统

数据库（vb.net+OleDB+Access）简易学生信息管理系统

在我们日常生活当中&#xff0c;数据库一词往往离不开我们的编程界&#xff0c;在学校、仓库等方面起着存储数据及数据关系作用的文件。相较于Excel&#xff0c;Access可以存储无限多的记录&#xff0c;内容也十分丰富&#xff0c;例如文本、数字、日期、T&F等。而且不需要…
阅读更多...
k8s命令式对象管理和配置

k8s命令式对象管理和配置

kubectl补全: # dnf install -y bash-completion # echo "source <(kubectl completion bash)" >> ~/.bashrc # kubectl completion bash > /etc/bash_completion.d/kubectl 命令式对象管理 kubectl命令 # 查看所有pod kubectl get pod # 查看某个po…
阅读更多...
LLM——探索大语言模型在心理学方面的应用研究

LLM——探索大语言模型在心理学方面的应用研究

1. 概述 心理学经历了多次理论变革&#xff0c;目前人工智能&#xff08;AI&#xff09;和机器学习&#xff0c;特别是大型语言模型&#xff08;LLMs&#xff09;的使用&#xff0c;预示着新研究方向的开启。本文详细探讨了像ChatGPT这样的LLMs如何转变心理学研究。它讨论了LL…
阅读更多...
docker- 镜像 导出导入

docker- 镜像 导出导入

文章目录 前言docker- 镜像 导出导入1. 导出2. 删除镜像3. 导入镜像 前言 如果您觉得有用的话&#xff0c;记得给博主点个赞&#xff0c;评论&#xff0c;收藏一键三连啊&#xff0c;写作不易啊^ _ ^。   而且听说点赞的人每天的运气都不会太差&#xff0c;实在白嫖的话&…
阅读更多...
忘记“也是一门学问：机器如何忘记自己学到的知识？

忘记“也是一门学问：机器如何忘记自己学到的知识？

在信息时代&#xff0c;我们常常希望人工智能能够学到更多的知识&#xff0c;变得更加智能。但你是否想过&#xff0c;有时候让机器"忘记"一些它学到的东西&#xff0c;也是一件很重要的事&#xff1f; 随着用户隐私保护意识的提高和相关法律法规的出台&#xff0c;…
阅读更多...
深入理解内联函数（C语言）

深入理解内联函数（C语言）

目录 1.什么是内联函数2.内联函数与宏3.编译器对内联函数的处理4.参考文献 1.什么是内联函数 很多人都会知道&#xff0c;可以将比较小的函数写成内联函数的形式&#xff0c;这样会节省函数调用的开销&#xff0c;具体是什么样的开销呢&#xff1f; 一个函数在执行过程中&…
阅读更多...
IDEA通过tomcat运行注意事项

IDEA通过tomcat运行注意事项

配置run--》edit configurations 以下的A B部分要保持一致 A和B的路径要保持一致
阅读更多...
前端vue项目遇到的问题01——那些初级问题

前端vue项目遇到的问题01——那些初级问题

前端vue项目遇到的问题01——那些初级问题 1. npm install 问题1.1 依赖冲突1.1.1 详细问题1.1.2 报错原因1.1.3 解决问题1.1.3.1 方式1——无视冲突1.1.3.1 方式2——更换依赖版本 1.2 nodejs版本问题1.3 node版本正确的情况&#xff08;audit问题&#xff09;&#xff08;这个…
阅读更多...
HTML5新特性、JS【初识JS 、JS核心语法】--学习JavaEE的day47

HTML5新特性、JS【初识JS 、JS核心语法】--学习JavaEE的day47

day47 HTML5新特性 定义文档类型 在文件的开头总是会有一个标签 语言文档类型声明方式html4<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">html5<!DOCTYPE html> 新增语义化标签 理解&…
阅读更多...
vite-plugin-vue-devtools插件

vite-plugin-vue-devtools插件

vite-plugin-vue-devtools插件旨在帮助开发者更快地理解并调试Vue应用。它通过提供全面的功能和直观的界面&#xff0c;以图形化的方式展示应用程序状态&#xff0c;使开发者能够更方便地查看和管理Vue应用的各个方面。此外&#xff0c;该插件还支持Vue3.0版本&#xff0c;并且…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023