Qt开发:项目视图(Item Views)的介绍和使用

news2025/5/11 4:14:23

文章目录

    • 一、清单视图(List View)
      • 1.1 基本概念
      • 1.2 使用示例(文字列表)
      • 1.3 图标+文字(图标模式)
      • 1.4 常用设置
      • 1.5 完整示例
    • 二、树视图(Tree View)
      • 2.1 基本概念
      • 2.2 常用类简介
      • 2.3 快速使用示例
      • 2.4 常用功能配置
    • 三、表视图(Table View)
      • 3.1 基本概念
      • 3.2 常用类
      • 3.3 快速使用示例
      • 3.4 常用功能设置
    • 四、列视图(Column View)
      • 4.1 基本概念
      • 4.2 常用类
      • 4.3 使用示例
      • 4.4 使用自定义树结构数据
      • 4.5 常用方法
      • 4.6 与 QTreeView 的区别
    • 五、撤销命令视图(Undo View)
      • 5.1 基本概念
      • 5.2 使用示例

一、清单视图(List View)

1.1 基本概念

  在 Qt 中,QListView 是用于显示垂直列表或图标网格的视图控件,它是基于 Qt 的模型/视图架构构建的,适合用于展示一组条目,如文件列表、联系人列表、图标等。

  • QListView 是视图(View)
  • 搭配模型(Model)使用,例如 QStringListModel、QStandardItemModel
  • 也可以设置委托(Delegate)来自定义每一项的显示方式

1.2 使用示例(文字列表)

#include <QListView>
#include <QStringListModel>

// 创建模型
QStringList list = {"苹果", "香蕉", "橘子"};
QStringListModel *model = new QStringListModel(list);

// 创建视图
QListView *listView = new QListView(this);
listView->setModel(model);

1.3 图标+文字(图标模式)

QStandardItemModel *model = new QStandardItemModel(this);

QStandardItem *item1 = new QStandardItem(QIcon(":/img/apple.png"), "苹果");
QStandardItem *item2 = new QStandardItem(QIcon(":/img/banana.png"), "香蕉");

model->appendRow(item1);
model->appendRow(item2);

QListView *listView = new QListView(this);
listView->setModel(model);

// 设置为图标模式
listView->setViewMode(QListView::IconMode);
listView->setIconSize(QSize(64, 64));
listView->setSpacing(10);

1.4 常用设置

在这里插入图片描述

1.5 完整示例

#include <QWidget>
#include <QListView>
#include <QStringListModel>
#include <QMessageBox>

class MainWindow : public QWidget
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr) : QWidget(parent) {
        this->resize(450, 250);
        this->setWindowTitle("QListView 示例");

        QListView *pListView = new QListView(this);
        pListView->setGeometry(20, 20, 300, 160);

        QStringList list;
        list.append("运动类:篮球、足球");
        list.append("娱乐类:看电影、写小说、听音乐");
        list.append("游戏类:五子棋、扑克牌、中国象棋");
        list.append("旅游类:国外旅游、国内旅游");

        QStringListModel *listMode = new QStringListModel(list);
        pListView->setModel(listMode);
        connect(pListView, &QListView::clicked, this, &MainWindow::onSlotClickedFunc);
    }

private slots:
    void onSlotClickedFunc(const QModelIndex &index) {
        QMessageBox::information(NULL, "兴趣爱好", "你选择的类型为:\n" + index.data().toString());
    }
};
#endif // MAINWINDOW_H

输出结果:
请添加图片描述

二、树视图(Tree View)

2.1 基本概念

  Qt 的树视图使用 QTreeView 类来实现,通常需要结合一个数据模型(如 QStandardItemModel 或自定义的 QAbstractItemModel)来提供数据源。

主要特点:

  • 支持多级嵌套(每一项都可以有子项)
  • 支持展开、折叠
  • 支持选择、编辑、右键菜单等交互

2.2 常用类简介

在这里插入图片描述

2.3 快速使用示例

以下是一个最基本的树视图示例,使用 QStandardItemModel:

#include <QApplication>
#include <QTreeView>
#include <QStandardItemModel>

int main(int argc, char *argv[]) {
    QApplication app(argc, argv);

    QTreeView treeView;
    QStandardItemModel model;

    model.setHorizontalHeaderLabels({ "名称" });

    // 创建顶层节点
    QStandardItem *rootItem = new QStandardItem("动物");

    // 添加子节点
    QStandardItem *mammalItem = new QStandardItem("哺乳动物");
    QStandardItem *birdItem = new QStandardItem("鸟类");

    rootItem->appendRow(mammalItem);
    rootItem->appendRow(birdItem);

    // 添加孙子节点
    mammalItem->appendRow(new QStandardItem("老虎"));
    mammalItem->appendRow(new QStandardItem("大象"));
    birdItem->appendRow(new QStandardItem("麻雀"));
    birdItem->appendRow(new QStandardItem("乌鸦"));

    // 添加到模型
    model.appendRow(rootItem);

    treeView.setModel(&model);
    treeView.expandAll();  // 默认展开所有节点
    treeView.setWindowTitle("树视图示例");
    treeView.resize(400, 300);
    treeView.show();

    return app.exec();
}

输出结果:
在这里插入图片描述

2.4 常用功能配置

在这里插入图片描述

三、表视图(Table View)

3.1 基本概念

  在 Qt 中,表视图(QTableView)是用于显示二维表格数据的控件,广泛用于数据管理、数据库展示、信息表格等场景。它是 Qt 的 Model/View 架构中的一部分,需要配合数据模型(如 QStandardItemModel 或自定义的 QAbstractTableModel)一起使用。

3.2 常用类

在这里插入图片描述

3.3 快速使用示例

使用 QTableView + QStandardItemModel 创建一个简单表格:

#include <QApplication>
#include <QTableView>
#include <QStandardItemModel>
#include <QStandardItem>

int main(int argc, char *argv[]) {
    QApplication app(argc, argv);

    QTableView tableView;
    QStandardItemModel model;

    // 设置行列数和表头
    model.setRowCount(3);
    model.setColumnCount(3);
    model.setHorizontalHeaderLabels({ "姓名", "年龄", "城市" });

    // 设置数据
    model.setItem(0, 0, new QStandardItem("张三"));
    model.setItem(0, 1, new QStandardItem("25"));
    model.setItem(0, 2, new QStandardItem("北京"));

    model.setItem(1, 0, new QStandardItem("李四"));
    model.setItem(1, 1, new QStandardItem("30"));
    model.setItem(1, 2, new QStandardItem("上海"));

    model.setItem(2, 0, new QStandardItem("王五"));
    model.setItem(2, 1, new QStandardItem("28"));
    model.setItem(2, 2, new QStandardItem("广州"));

    tableView.setModel(&model);
    tableView.setWindowTitle("表格视图示例");
    tableView.resize(400, 250);
    tableView.show();

    return app.exec();
}

输出结果:
在这里插入图片描述

3.4 常用功能设置

在这里插入图片描述

四、列视图(Column View)

4.1 基本概念

  在 Qt 中,列视图(QColumnView)是一个专门用于浏览分层结构数据(如文件系统)的控件,它以多列级联展开的形式展示每一级子项。它是 Qt 的 Model/View 架构中的一部分,常见于例如 Mac OS Finder 样式的界面中,每一级目录(或层级)占据一个独立的列,用户点击某一项时,其子项会在右侧新列中显示。

基本特点:

  • 展示层级结构数据(必须是树形结构模型,如 QDirModel、QStandardItemModel 或 QFileSystemModel)。
  • 每一级展开为一列,水平滚动。
  • 和 QTreeView 一样,要求模型提供父子关系。

4.2 常用类

在这里插入图片描述

4.3 使用示例

使用 QFileSystemModel 显示文件夹结构:

#include <QApplication>
#include <QColumnView>
#include <QFileSystemModel>

int main(int argc, char *argv[]) {
    QApplication app(argc, argv);

    QColumnView *columnView = new QColumnView;

    QFileSystemModel *model = new QFileSystemModel;
    model->setRootPath(QDir::rootPath()); // 设置根路径

    columnView->setModel(model);
    columnView->setRootIndex(model->index(QDir::homePath())); // 设置初始显示目录

    columnView->setWindowTitle("QColumnView 示例 - 文件浏览器");
    columnView->resize(800, 400);
    columnView->show();

    return app.exec();
}

输出结果:
在这里插入图片描述

4.4 使用自定义树结构数据

#include <QApplication>
#include <QColumnView>
#include <QStandardItemModel>

int main(int argc, char *argv[]) {
    QApplication app(argc, argv);

    QColumnView *columnView = new QColumnView;

    QStandardItemModel *model = new QStandardItemModel;

    QStandardItem *root = new QStandardItem("动物");

    QStandardItem *mammal = new QStandardItem("哺乳动物");
    mammal->appendRow(new QStandardItem("老虎"));
    mammal->appendRow(new QStandardItem("狮子"));

    QStandardItem *bird = new QStandardItem("鸟类");
    bird->appendRow(new QStandardItem("麻雀"));
    bird->appendRow(new QStandardItem("乌鸦"));

    root->appendRow(mammal);
    root->appendRow(bird);

    model->appendRow(root);

    columnView->setModel(model);
    columnView->setRootIndex(model->index(0, 0)); // 设定根节点

    columnView->setWindowTitle("QColumnView 示例 - 文件浏览器");
    columnView->resize(800, 400);
    columnView->show();

    return app.exec();
}

输出结果:
在这里插入图片描述

4.5 常用方法

在这里插入图片描述

4.6 与 QTreeView 的区别

在这里插入图片描述

五、撤销命令视图(Undo View)

5.1 基本概念

  在 Qt 中,撤销命令视图(QUndoView)是用于展示和管理命令模式撤销/重做操作历史记录的一个视图类。它配合 QUndoStack 或 QUndoGroup 使用,能够图形化地显示用户执行过的操作,并允许用户点击某个历史命令进行撤销或重做。

Qt 中的撤销框架基于命令模式,主要类如下:
- List item

5.2 使用示例

基本撤销命令视图:

自定义命令类

#include <QUndoCommand>
#include <QString>
#include <QDebug>

class PrintCommand : public QUndoCommand {
public:
    PrintCommand(const QString &text) : m_text(text) {
        setText("Print: " + text); // 设置在 UndoView 中显示的文本
    }

    void undo() override {
        qDebug() << "Undo:" << m_text;
    }

    void redo() override {
        qDebug() << "Redo:" << m_text;
    }

private:
    QString m_text;
};

创建主窗口并绑定 QUndoView

#include <QApplication>
#include <QUndoView>
#include <QUndoStack>
#include <QVBoxLayout>
#include <QPushButton>
#include <QWidget>

int main(int argc, char *argv[]) {
    QApplication app(argc, argv);

    QWidget window;
    QVBoxLayout layout(&window);

    QUndoStack *undoStack = new QUndoStack(&window);
    QUndoView *undoView = new QUndoView(undoStack); // 绑定命令栈

    QPushButton *addButton = new QPushButton("添加命令");
    layout.addWidget(addButton);
    layout.addWidget(undoView);

    QObject::connect(addButton, &QPushButton::clicked, [&]() {
        static int count = 1;
        undoStack->push(new PrintCommand(QString("命令%1").arg(count++)));
    });

    window.setWindowTitle("QUndoView 示例");
    window.resize(300, 300);
    window.show();

    return app.exec();
}

输出结果:
请添加图片描述

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

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

相关文章

keepalived详细笔记

keepalived 是一种基于VRRP&#xff08;虚拟路由器冗余协议&#xff09;的高可用解决方案&#xff0c;主要是用于服务器的负载均衡和高可用性的保障&#xff0c;自动将服务切换到备份服务器上&#xff0c;确保业务的连续性。 工作原理&#xff1a; VRRP协议&#xff1a;一组路…

xLua笔记

Generate Code干了什么 肉眼可见的&#xff0c;在Asset文件夹生成了XLua/Gen文件夹&#xff0c;里面有一些脚本。然后对加了[CSharpCallLua]的变量寻找引用&#xff0c;发现它被XLua/Gen/DelegatesGensBridge引用了。也可以在这里查哪些类型加了[CSharpCallLua]。 public over…

一周学会Pandas2 Python数据处理与分析-Pandas2数据排序操作

锋哥原创的Pandas2 Python数据处理与分析 视频教程&#xff1a; 2025版 Pandas2 Python数据处理与分析 视频教程(无废话版) 玩命更新中~_哔哩哔哩_bilibili Pandas 2提供了多种灵活的数据排序方法&#xff0c;主要针对 DataFrame 和 Series 对象。 1. 按值排序&#xff1a;s…

lvm详细笔记

LVM简介 逻辑卷管理器&#xff0c;是Linux 系统中用于管理磁盘储存的关键技术。 LVM 则打破了磁盘分区一旦确定&#xff0c;其大小调整往往较为复杂&#xff0c;且难以灵活应对业务变化这种限制&#xff0c;它允许用户将多个物理分区组合卷组。例如&#xff0c;系统中的多个物…

250505_HTML

HTML 1. HTML5语法与基础标签1.1 HTML5特性1.1.1 空白折叠现象1.1.2 转义字符 1.2 HTML注释1.3 基础标签1.3.1 div标签1.3.2 标题标签1.3.3 段落标签1.3.4 title1.3.5 meta 1.4 html骨架1.4.1 DTD1.4.2 html标签1.4.3 head与body标签 1.5 div标签详解1.5.1 常见class类名 2. 列…

【HarmonyOS NEXT+AI】问答05:ArkTS和仓颉编程语言怎么选?

在“HarmonyOS NEXTAI大模型打造智能助手APP(仓颉版)”课程里面&#xff0c;有学员提到了这样一个问题&#xff1a; 鸿蒙的主推开发语言不是ArkTS吗&#xff0c;本课程为什么使用的是仓颉编程语言&#xff1f; 这里就这位同学的问题&#xff0c;统一做下回复&#xff0c;以方便…

【专家库】Kuntal Chowdhury

昆塔尔乔杜里 Kuntal Chowdhury 是 NVIDIA 的 6G 开发者关系经理和技术布道师。他致力于推动与 NVIDIA 平台和工具的开发者和早期采用者生态系统的联系&#xff0c;以促进 6G 研究社区的蓬勃发展。在此之前&#xff0c;他是 BlueFusion, Inc. 的创始人&#xff0c;这是一家创新…

【代码优化篇】强缓存和协商缓存

强缓存和协商缓存 一、强缓存与协商缓存的区别二、Vue2 前端实现强缓存&#xff08;静态资源&#xff09;三、Spring Boot 后端实现协商缓存&#xff08;动态接口&#xff09;四、测试缓存效果五、注意事项 一、强缓存与协商缓存的区别 强缓存&#xff1a;浏览器直接读取本地缓…

电路中的DGND、GROUND、GROUND_REF的区别,VREF、VCC、VDD、VEE和VSS的区别?

目录 1 DGND、GROUND、GROUND_REF的区别 1.1 DGND&#xff08;Digital Ground&#xff09; 1.2 GROUND&#xff08;Ground&#xff09; 1.3 GROUND_REF&#xff08;Ground Reference&#xff09; 1.4 区别 2 VREF、VCC、VDD、VEE和VSS的区别 2.1 VREF&#xff08;Refere…

开始使用WebStorm

目录 开始使用WebStorm打开、检出或创建项目打开项目从版本控制系统检出项目的步骤创建一个空的WebStorm项目在项目中创建新文件的步骤 熟悉WebStorm用户界面找到你要找的代码查找项目符号的调用按名称查找项目符号搜索文本片段转到符号声明历史记录 补全代码实时检查并修复代码…

【计算机视觉】Car-Plate-Detection-OpenCV-TesseractOCR:车牌检测与识别

Car-Plate-Detection-OpenCV-TesseractOCR&#xff1a;车牌检测与识别技术深度解析 在计算机视觉领域&#xff0c;车牌检测与识别&#xff08;License Plate Detection and Recognition, LPDR&#xff09;是一个极具实用价值的研究方向&#xff0c;广泛应用于智能交通系统、安…

【MongoDB篇】MongoDB的聚合框架!

目录 引言第一节&#xff1a;什么是聚合框架&#xff1f; &#x1f914;第二节&#xff1a;管道的“发动机”们——常用聚合阶段详解&#xff01;⚙️第三节&#xff1a;聚合表达式——管道中的“计算器”和“转换器” &#x1f9ee;✏️第四节&#xff1a;性能优化与考量——让…

面试常问系列(一)-神经网络参数初始化-之自注意力机制为什么除以根号d而不是2*根号d或者3*根号d

首先先罗列几个参考文章&#xff0c;大家之后可以去看看&#xff0c;加深理解&#xff1a; 面试常问系列(一)-神经网络参数初始化面试常问系列(一)-神经网络参数初始化之自注意力机制_注意力机制的参数初始化怎么做-CSDN博客面试常问系列(一)-神经网络参数初始化-之-softmax-C…

C++使用PoDoFo库处理PDF文件

&#x1f4da; PoDoFo 简介 PoDoFo 是一个用 C 编写的自由开源库&#xff0c;专用于 读取、写入和操作 PDF 文件。它适用于需要程序化处理 PDF 文件的应用程序&#xff0c;比如批量生成、修改、合并、提取元数据、绘图等。 &#x1f31f; 核心特点 特性说明&#x1f4c4; P…

【Unity】Unity中修改网格的大小和倾斜网格

一、问题 unity中的网格&#xff08;Grid&#xff09;或者地面Plane组件&#xff0c;在使用时&#xff0c;都是正方形的网格&#xff0c;而且建立该网格后&#xff0c;在不改变Scale情况下&#xff0c;没发使其整体变大&#xff0c;而且也没法改变每个网格的大小&#xff0c;而…

Transformer-LSTM混合模型在时序回归中的完整流程研究

Transformer-LSTM混合模型在时序回归中的完整流程研究 引言与背景 深度学习中的长期依赖建模一直是时序预测的核心问题。长短期记忆网络&#xff08;LSTM&#xff09;作为一种循环神经网络&#xff0c;因其特殊的门控结构能够有效捕捉序列的历史信息&#xff0c;并在时序预测…

UE5 渲染思路笔记(角色)

参考示例 首先是怎么做到辉光只有部分有而整体没有的 使用的是Bloom内的阈值,控制光的溢光量 Threshold&#xff08;阈值&#xff09;&#xff1a;这个参数决定了图像中哪些像素会参与泛光计算。只有那些亮度超过阈值的像素才会触发泛光效果。阈值越低&#xff0c;更多的像素会…

运维打铁:服务器分类及PHP入门

文章目录 C/S架构和B/S架构C/S架构B/S架构 服务器分类服务器类型服务器软件 使用 WampServer 搭建 HTTP服务集成环境的分类WampServer 的安装测试访问配置网站根目录 静态网站和动态网站PHP的常见语法第一段 php 代码注释变量数据类型运算符函数的定义类和对象内容输出循环语句…

Python - 爬虫;Scrapy框架(一)

框架&#xff0c;就相当于一个封装了很多功能的结构体&#xff0c;它帮我们把主要的结构给搭建好了&#xff0c;我们只需往骨架里添加内容就行。 Scrapy是适用于Python的一个快速、高层次的屏幕抓取和web抓取框架&#xff0c;用于抓取web站点并从页面中提取结构化的数据。Scra…

The 2024 ICPC Kunming Invitational Contest G. Be Positive

https://codeforces.com/gym/105386/problem/G 题目&#xff1a; 结论&#xff1a; 从0开始每四个相邻数的异或值为0 代码&#xff1a; #include<bits/stdc.h> using namespace std; #define int long long void solve() {int n;cin >> n;if(n1||n%40){cout &…