【Qt】Item Widgets 多元素控件

好想有猫猫

于 2024-08-08 17:09:39 发布

阅读量412

点赞数 11

分类专栏： Qt 文章标签： qt 开发语言 c++ 学习方法

本文链接：https://blog.csdn.net/m0_72563041/article/details/140911549

版权

Qt 专栏收录该内容

17 篇文章 0 订阅

订阅专栏

Qt中提供的多元素控件有：

QListWidget
QListView
QTableWidget
QTableView
QTreeWidget
QTreeView

上述控件分为Widget和View，其区别如下：

以QTableWidget和QTableView为例

QTableView是基于MVC(Model-View-Controller)设计的控件。QTableView自身不持有数据，只是实现界面效果。使用QTableView需要用户创建一个Model对象(比如QStandarModel)，并且把Model和QTableView关联起来，后续修改Model中的恶数据就会影响QTableView的显示；修改QTableView也会影响Model中的数据(双向绑定)
QTableWidget则是QTableView的子类，对Model进行了封装，不需要我们手动创建Model对象，直接往QTableWidget中添加数据即可

QListWidget

QListWidget类是用于显示条目列表的控件。每个条目可以包含文本和可选的图标

核心属性

属性	说明
currentRow	当前被选中的是第几行，下标从0开始
count	当前有多少行条目
sortingEnabled	是否允许排序
isWrapping	是否允许换行
itemAlignment	元素的对齐方式
selectRectVisible	被选中的元素矩形是否可见
spacing	元素之间的间隔

核心方法

方法	说明
addItem(const QString &label) addItem(QListWidgetItem *item)	在列表末尾添加元素
currentItem()	获取当前选中的条目，返回值是QListWidgetItem*
setCurrentItem(QListWidgetItem *item)	设置选中哪个元素
setCurrentRow(int row)	设置选中第几行的条目
insertItem(const QString& label, int row) insertItem(QListWidgetItem *item, int row)	指定行插入元素，插入的元素顶替原先的位置例如row = 0，那么新插入的元素下标将会为0
item(int row)	获取第row行的条目，返回值为QListWidgetItem *
takeItem(int row)	删除指定行的条目，返回值为QListWidgetItem *，被删除的条目

核心信号

信号	说明
currentItemChanged(QListWidgetItem current, QListWidgetItem old)	选中不同元素时会触发，参数是当前选中的元素和之前的元素注意：在QListWidget最开始展示时就会触发该信号，但此时没有old，所以编写相应的槽函数需要对指针判空
currentRowChanged(int)	选中不同元素时触发，参数是当前选中的行数
itemClicked(QListWidgetItem *item)	点击某个元素时触发
itemDoubleClicked(QListWidgetItem *item)	双击某个元素时触发
itemActivated(QListWidgetItem *item)	某个元素被激活，点击和双击都会触发该信号
itemEntered(QListWidgetItem *item)	鼠标进入元素时触发
itemChanged(QListWidgetItem *item)	条目的内容被改变时触发

QListWidgetItem

XXItem是用于显示界面中单个条目的类，包含了条目的数据和显示设置，比如文本、图标等

这些Item本身并不是Model，更类似于View或是对Model数据的一种显示

核心方法

方法	说明
setFont	设置字体
setIcon	设置图标
setHidden	设置隐藏
setSizeHint	设置尺寸
setSelected	设置是否选中
setText	设置文本
setTextAlignment	设置文本对齐方式

代码示例：使用QListWidget展示语言，QLineEdit输入新增语言，一个新增按钮和删除按钮

1. 使用Qt Designer添加所需控件

2. 编写widget.cpp，在构造函数中添加初始元素

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);

    //初始化添加几个元素
    ui->listWidget->addItem("C++");
    ui->listWidget->addItem("Java");
    ui->listWidget->addItem("Python");
    //设置提示词
    ui->lineEdit->setPlaceholderText("请输入要添加的元素");
}

3. 编写按钮的槽函数

//增加条目
void Widget::on_pushButton_add_clicked()
{
    //获取输入框的文本
    const QString &text = ui->lineEdit->text();
    if(text == nullptr) return;
    //获取当前选中的下标
    int row = ui->listWidget->currentRow();
    //将新条目插入到选中条目之后，若没选中，index = 0，为头插
    ui->listWidget->insertItem(row, text);
}
//删除条目
void Widget::on_pushButton_delete_clicked()
{
    //另一种获取选中元素的方法
    auto *item = ui->listWidget->currentItem();
    if(item == nullptr) return;
    int row = ui->listWidget->row(item);
    ui->listWidget->takeItem(row);
}

QTableWidget

QTableWidget类用于显示二维表格数据

核心方法

方法	说明
item(int row, int column)	通过指定行列获取元素，返回值为QTableWidgetItem *
setItem(int row, int column, QTableWidget *item)	通过指定行列，设置表格中的元素
currentItem()	返回被选中的元素，返回值为QTableWidgetItem *
currentRow()	返回被选中元素的行号，从0开始
currentColumn()	返回被选中元素的列号，从0开始
row(QTableWidgetItem *item)	获取指定 item 的行号
column(QTableWidgetItem *item)	获取指定 item 的列号
rowCount()	获取当前列表有几行
columnCount()	获取当前列表有几列
insertRow(int row)	在第 row 行插入新行若 insertRow(0)，则新插入的行为第0行
insertColumn(int column)	在第 column 列插入新列
removeRow(int row)	删除第 row 行
removeColumn(int column)	删除第 column 列
setHorizontalHeaderItem(int column, QTableWidgetItem *item)	设置指定列的表头，即列属性
setVerticalHeader(int row, QTableWidgetItem *item)	设置指定行的表头，即行属性
setHorizontalHeaderLabels(QStringList &labels)	通过QStringList快速设置列属性
setVerticalHeaderLabels(QStringList &labels)	通过QStringList快速设置行属性

核心信号

信号	说明
cellClicked(int row, int column)	点击单元格时触发，参数是行号和列号
cellDoubleClicked(int row, int column)	双击单元格时触发，参数是行号和列号
cellEntered(int row, int column)	鼠标进入单元格时触发，参数是行号和列号
currentCellChanged(int row, int column, int previousRow, int previousColumn)	选中的单元格切换时触发，前两个参数是现在选中单元格的行列号，后两个参数是先前选中的单元格的行列号

QTableWidgetItem

QTableWidgetItem是二维单元格中表示和管理单元格数据的类，允许开发者在表格中操作和显示文本、图标和其他数据

核心方法

方法大致与QListWidgetItem相同，多了行列相关的方法

方法	说明
row()	获取该元素的行号
column()	获取该元素的列号
setText(const QString &)	设置文本
setTextAlignment(int)	设置文本对齐方式
setIcon(const QIcon &)	设置图标
setSelected(bool)	设置被选中
setSizeHints(cinst QSize &)	设置尺寸
setFont(const QFont &)	设置字体

代码示例：简易学生成绩表

1. 使用Qt Designer添加所需控件

2. 编写widget.cpp，在构造函数中初始化相关元素

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    //设置提示词
    ui->lineEdit->setPlaceholderText("请输入新增列名");
    //插入4行3列
    for(int i = 0; i < 4; ++i)//4行
        ui->tableWidget->insertRow(i);
    for(int i = 0; i < 3; ++i)//3列
        ui->tableWidget->insertColumn(i);
    //设置列名
    QStringList colName = {"学号", "姓名", "成绩"};
    ui->tableWidget->setHorizontalHeaderLabels(colName);
    //初始数据
    ui->tableWidget->setItem(0, 0, new QTableWidgetItem("1001"));
    ui->tableWidget->setItem(0, 1, new QTableWidgetItem("张三"));
    ui->tableWidget->setItem(0, 2, new QTableWidgetItem("83"));

    ui->tableWidget->setItem(1, 0, new QTableWidgetItem("1002"));
    ui->tableWidget->setItem(1, 1, new QTableWidgetItem("小明"));
    ui->tableWidget->setItem(1, 2, new QTableWidgetItem("95"));

    ui->tableWidget->setItem(2, 0, new QTableWidgetItem("1003"));
    ui->tableWidget->setItem(2, 1, new QTableWidgetItem("小华"));
    ui->tableWidget->setItem(2, 2, new QTableWidgetItem("79"));
}

3. 编写按钮的槽函数

//新增一行
void Widget::on_pushButton_clicked()
{
    //尾插
    int row = ui->tableWidget->rowCount();
    ui->tableWidget->insertRow(row);
}
//新增一列，同时设置列名
void Widget::on_pushButton_2_clicked()
{
    const QString &text = ui->lineEdit->text();
    if(text == nullptr) return;
    //尾插一列并设置列名
    int col = ui->tableWidget->columnCount();
    ui->tableWidget->insertColumn(col);
    ui->tableWidget->setHorizontalHeaderItem(col, new QTableWidgetItem(text));
}
//删除一行
void Widget::on_pushButton_3_clicked()
{
    int row = ui->tableWidget->currentRow();
    ui->tableWidget->removeRow(row);
}
//删除一列
void Widget::on_pushButton_4_clicked()
{
    int col = ui->tableWidget->currentColumn();
    ui->tableWidget->removeColumn(col);
}

程序效果如下：

默认情况下，单元格的内容可以直接编辑。如果不想让用户编辑，可以设置

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

QTreeWidget

QTreeWidget类用于显示树形结构，集成了数据模型和视图的功能

QTreeWidget不同于往常的多叉树，Qt隐藏了该多叉树的根节点，我们只能访问从根节点以下的节点。

根节点以下第一层是 topLevelItem ，通过QTreeWidget添加；再往下的节点t通过 QTreeWidgetItem 的child指针连接

核心方法

方法	说明
clear()	清空所有子节点
addTopLevelItem(QTreeWidgetItem *item)	新增顶层节点
topLevelItem(int index)	获取指定下标的顶层节点，返回值是 QTreeWidgetItem *
topLevelItemCount()	获取顶层节点的个数
indexOfTopLevelItem(QTreeWidgetItem *item)	查询指定节点在顶层节点中的下标
takeTopLevelItem(int index)	通过下标删除顶层节点，返回值是 QTreeWidgetItem * 表示被删除的节点
currentItem()	获取当前选中的节点，返回值是 QTreeWidgetItem *
setCurrentItem(QTreeWidgetItem *item)	设置选中的节点
setExpanded(bool)	展开/关闭节点 true为展开，false为关闭
setHeaderLabel(const QString &text)	设置QTreeWidget的header名称，如上述样例的"动物"

核心信号

信号	说明
currentItemChanged(QTreeWidgetItem current, QTreeWidgetItem old)	切换选中元素时触发
itemClicked(QTreeWidgetItem *item, int col)	点击元素时触发
itemDoubleClicked(QTreeWidgetItem *item, int col)	双击元素时触发
itemEntered(QTreeWidgetItem *item, int col)	鼠标进入时触发
itemExpanded(QTreeWidgetItem *item)	元素被展开时触发
itemCollapsend(QTreeWidgetItem *item)	元素被折叠时触发

QTreeWidgetItem

QTreeWidgetItem类用于表示树状结构中的每个节点，可显示文本和图标等元素

在QTreeWidget中顶层元素和子元素其实都是QTreeWidgetItem，只是调用的接口不同，顶层元素通过QTreeWidget添加、删除、管理，子元素由顶层元素管理。

核心属性

属性	说明
text	持有的文本
textAlignment	文本对齐方式
icon	持有的图标
font	文本字体
hidden	是否隐藏
disabled	是否禁用
expand	是否展开
sizeHint	尺寸大小
selected	是否选中
parent	父亲节点

核心方法

方法	说明
addChild(QTreeWidgetItem *child)	新增子节点
childCount()	子节点的个数
child(int index)	获取指定下标的子节点，返回值是QTreeWidgetItem *
takeChild(int index)	通过下标删除对应子节点
removeChild(QTreeWidgetItem *child)	通过指针删除对应子节点
parent()	获取父节点，返回值是QTreeWidgetItem *

代码示例：使用QTreeWidget 展示动物种类

1. 通过Qt Designer添加所需控件

2. 编写widget.cpp，通过构造函数初始化相关控件

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    ui->lineEdit->setPlaceholderText("请输入要添加的元素");
    //设置根节点名称
    ui->treeWidget->setHeaderLabel("动物");
    //添加顶层元素
    QTreeWidgetItem *item_cat = new QTreeWidgetItem(ui->treeWidget);
    item_cat->setText(0, "猫");
    ui->treeWidget->addTopLevelItem(item_cat);

    QTreeWidgetItem *item_dog = new QTreeWidgetItem(ui->treeWidget);
    item_dog->setText(0, "狗");
    ui->treeWidget->addTopLevelItem(item_dog);

    QTreeWidgetItem *item_bird = new QTreeWidgetItem(ui->treeWidget);
    item_bird->setText(0, "鸟");
    ui->treeWidget->addTopLevelItem(item_bird);
}

3. 编写按钮的槽函数

//添加顶层节点
void Widget::on_pushButton_clicked()
{
    const QString &text = ui->lineEdit->text();
    if(text.isEmpty()) return;
    //构造新节点并链入QTreeWidget
    QTreeWidgetItem *newColumn = new QTreeWidgetItem(ui->treeWidget);
    newColumn->setText(0, text);
    ui->treeWidget->addTopLevelItem(newColumn);
}
//添加非顶层节点
void Widget::on_pushButton_2_clicked()
{
    const QString &text = ui->lineEdit->text();
    if(text.isEmpty())  return;
    //获取父亲节点
    QTreeWidgetItem *parent = ui->treeWidget->currentItem();
    if(parent == nullptr)   return;
    //构造新节点并链入parent
    QTreeWidgetItem *newColumn = new QTreeWidgetItem(parent);
    newColumn->setText(0, text);
    parent->addChild(newColumn);
    //添加完后直接展开
    parent->setExpanded(true);
}
//删除子项
void Widget::on_pushButton_3_clicked()
{
    QTreeWidgetItem *curItem = ui->treeWidget->currentItem();
    QTreeWidgetItem *parent = curItem->parent();
    if(parent == nullptr)
    {
        //顶层元素
        int index = ui->treeWidget->indexOfTopLevelItem(curItem);
        ui->treeWidget->takeTopLevelItem(index);
    }
    else
        parent->removeChild(curItem);//非顶层元素
}

结束语

感谢你的阅读，如果觉得本篇文章对你有所帮助的话，不妨点个赞支持一下博主，拜托啦，这对我真的很重要