QT Quick QML 实例之定制 TableView

QT Quick QML 实例之定制 TableView

  • 一、演示
  • 二、C++关键步骤
    • 1. beginInsertRows()(用户插入行)
    • 2. roleNames() (表格中列映射)
    • 3. data() (用户获取数据)
    • 4. headerData() (表头)
    • 5. flags (某个单元格的特性标志)
    • 6. setData (用户更新数据)
  • 三、QML UI 显示


所有的热爱都要不遗余力,真正喜欢它便给它更高的优先级,和更多的时间吧!

GIT工程源码在这里:     QmlLearningPro编译选择 TableView

QML其它文章请点击这里:     QT QUICK QML 学习笔记


一、演示

● 效果如下:
请添加图片描述

二、C++关键步骤

在Qt中,如使用 QML 的 TableView 并且想要将数据与C++类进行绑定,通常会继承 QAbstractTableModel 来实现自定义的数据模型

1. beginInsertRows()(用户插入行)

beginInsertRows 是 Qt 中的 QAbstractItemModel 类的一部分,用于通知视图 (view) 即将向模型 (model) 中插入行。这个方法通常与 endInsertRows 配对使用,以确保模型的内部数据和视图保持一致。

void MyModel::insertRows(int position, int rows, const QModelIndex &parent = QModelIndex()) {// 通知视图即将插入行beginInsertRows(parent, position, position + rows - 1);// 执行实际的数据插入操作// 例如:for (int row = 0; row < rows; ++row) {dataList.insert(position, newRowData);}// 通知视图插入行操作已经完成endInsertRows();
}

2. roleNames() (表格中列映射)

roleNames() 是 QAbstractItemModel 类中的一个虚函数,通常用于返回模型中的角色(roles)与角色名称(role names)之间的映射。角色在 Qt 的模型-视图框架中用于区分不同类型的数据(例如显示数据、编辑数据、工具提示等)。

//为每个角色提供一个名称,主要用于 QML 绑定。
QHash<int, QByteArray> TargetCoordinate::roleNames() const
{QHash<int, QByteArray> roles;roles.insert(lngRole,  "lng");roles.insert(latRole,  "lat");roles.insert(altRole,  "alt");return roles;
}

QML 中使用:

	TableViewColumn {role: "lng"   //来源于C++中roleNamestitle: "Longitude"resizable: true}TableViewColumn {role: "lat"   title: "Latitude"resizable: true}TableViewColumn {role: "alt"  title: "Altitude"resizable: true}

3. data() (用户获取数据)

在 Qt 的 QAbstractItemModel 类中,data() 函数用于返回模型中某个特定项的数据信息。这个函数通常和 roleNames() 函数结合使用,以便为不同的角色返回相应的数据。

视图(如ListView)中请求模型的数据时,视图会调用 data() 函数,并传递相应的 QModelIndex 和 role, data() 函数会根据这些参数返回对应的数据。

QVariant TargetCoordinate::data(const QModelIndex &index, int role) const
{if (!index.isValid())return QVariant();if (index.row() < 0 || index.row() >= m_coordinates.count())return QVariant();const QGeoCoordinate &coordinate = m_coordinates.at(index.row());switch(role){case lngRole:return QString::number(coordinate.longitude(), 'f', 6);case latRole:return QString::number(coordinate.latitude(), 'f', 6);case altRole:return QString::number(coordinate.altitude(), 'f', 2);}return QVariant();
}

data() 和 roleNames()关系:

data():提供模型项在特定角色下的数据。
roleNames():为每个角色提供一个名称,主要用于 QML 绑定。

4. headerData() (表头)

headerData() 是 QAbstractItemModel 类中的另一个重要虚函数,用于提供模型的表头信息。在 Qt 的模型-视图框架中,表头用于显示列标题或行标题,通常用于 QTableView、QTreeView 或类似的视图中。

QVariant TargetCoordinate::headerData(int section, Qt::Orientation orientation, int role) const
{if (role != Qt::DisplayRole)return QVariant();/* 当请求的方向为 Qt::Horizontal 时,我们返回与请求的 section(列索引)相关的表头数据。*/if (orientation == Qt::Horizontal) {if (section == 0)return tr("lng");else if (section == 1)return tr("lat");else if (section == 2)return tr("alt");}return QVariant();
}

headerData() 通常与 data() 一起使用,前者用于表头的显示,后者用于表格中具体单元格的显示。

5. flags (某个单元格的特性标志)

flags 用于返回模型中某个项的特性标志(flags)。这些标志指示该项是否可选中、可编辑、可拖放等行为。通过重写 flags() 函数,可以控制模型中每个项的交互行为。

Qt::ItemFlags TargetCoordinate::flags(const QModelIndex &index) const
{qDebug() << "flags()" ;if (!index.isValid())return Qt::NoItemFlags;return Qt::ItemIsEditable | QAbstractTableModel::flags(index);
}

常见的 Qt::ItemFlag 枚举值:

Qt::NoItemFlags: 表示没有特性,项不可交互。
Qt::ItemIsSelectable: 该项是可选择的。
Qt::ItemIsEditable: 该项是可编辑的。
Qt::ItemIsDragEnabled: 该项支持拖动操作。
Qt::ItemIsDropEnabled: 该项支持放置操作。
Qt::ItemIsUserCheckable: 该项可以显示一个复选框,允许用户进行选择。
Qt::ItemIsEnabled: 该项是可用的(如果未设置,则该项将显示为禁用状态)。

6. setData (用户更新数据)

功能:

编辑数据: 当用户在视图中编辑数据(如在表格单元格中输入文本或选择复选框)时,视图会调用 setData() 函数,模型根据提供的新数据更新相应的项。

拖放操作: 如果支持拖放操作,当数据被放置到模型中的某个位置时,setData() 可能会被调用以插入新数据。

批量数据更新: 你可以在外部批量修改模型的数据,每次修改后调用 setData() 更新特定的项

bool TargetCoordinate::setData(const QModelIndex &index, const QVariant &value, int role)
{if (!index.isValid() || role != Qt::EditRole)return false;if (index.row() < 0 || index.row() >= m_coordinates.count())return false;QGeoCoordinate &coordinate = m_coordinates[index.row()];if (index.column() == 0)coordinate.setLongitude(value.toDouble());else if (index.column() == 1)coordinate.setLatitude(value.toDouble());else if (index.column() == 2)coordinate.setAltitude(value.toDouble());//表示仅有一个单元格的数据发生了更改emit dataChanged(index, index);return true;
}

组合使用
setData() 与 data():setData() 用于更新数据,而 data() 则用于获取数据。视图在显示数据时调用 data(),在用户修改数据时调用 setData()。

flags():在 flags() 函数中设置 Qt::ItemIsEditable 标志,以确保该项可编辑。只有当项是可编辑的,视图才会调用 setData()。

dataChanged 信号:在 setData() 中调用 emit dataChanged(index, index),通知视图相应项的数据已经改变。视图会自动重新绘制受影响的项。

三、QML UI 显示

TableView {id: tableViewanchors.margins:    10anchors.fill:       parentmodel:       coordinateModel//表格属性itemDelegate: {return editableDelegate;}rowDelegate: Rectangle {color : styleData.selected ? "#7db9f7" : (styleData.alternate ? "#f5f1f1":"#a89d9d")height: 30}TableViewColumn {role: "lng"   //来源于C++中roleNamestitle: "Longitude"resizable: true}TableViewColumn {role: "lat"   //ytitle: "Latitude"
//                width: 120resizable: true}TableViewColumn {role: "alt"   //title: "Altitude"resizable: true}headerDelegate: Rectangle {implicitWidth: heardText.widthimplicitHeight: heardText.height * 1.6gradient:       styleData.pressed ? pressG : (styleData.containsMouse ? hoverG: normalG)border.width: 1border.color: "gray"Text {id:     heardTextanchors.centerIn: parentfont.pixelSize: 22text:           styleData.valuecolor:          styleData.pressed ? "red" : "blue"font.bold: true}}Component {id: editableDelegateRectangle {border.color: "gray"border.width: 1Item{anchors.centerIn: parentheight:  showTXT.height * 1.2width:   showTXT.width * 1.2Text {id:showTXTanchors.centerIn: parentelide: styleData.elideModetext: styleData.value !== undefined ? styleData.value : ""color: styleData.selected ? "red" : "black"//styleData.textColorfont.pixelSize:  18horizontalAlignment: Text.AlignHCenter}}}}RowLayout {anchors.horizontalCenter:   rootRect.horizontalCenteranchors.top:                rootRect.bottomanchors.topMargin:          20Button {text:  "add"onClicked:      {coordinateModel.insertRowsCoor(tableView.currentRow+1, 1);tableView.currentRow = tableView.currentRow + 1tableView.refreshTableView}}Button {text:  "delete"onClicked:      {if(tableView.rowCount ===0)  returnif(tableView.currentRow === -1)    coordinateModel.removeRowsCoor(tableView.currentRow-1);else    coordinateModel.removeRowsCoor(tableView.currentRow);tableView.refreshTableView}}}

具体代码见工程源码


GIT 工程文件点击这里:     QmlLearningPro编译选择 TableView

QML 其它文章请点击这里:     QT QUICK QML 学习笔记

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

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

相关文章

依靠 VPN 生存——探索 VPN 后利用技术

执行摘要 在这篇博文中,Akamai 研究人员强调了被忽视的 VPN 后利用威胁;也就是说,我们讨论了威胁行为者在入侵 VPN 服务器后可以用来进一步升级入侵的技术。 我们的发现包括影响 Ivanti Connect Secure 和 FortiGate VPN 的几个漏洞。 除了漏洞之外,我们还详细介绍了一组…

ETAS工具链自动化实战指南<二>

----自动化不仅是一种技术&#xff0c;更是一种思维方式&#xff0c;它将帮助我们在快节奏的工作环境中保持领先&#xff01; 目录 往期推荐 RTA-A2L工具概览 RTA-A2L的输出文件 常用命令行参数 场景1&#xff1a;通过 MCSD 文件来生成 .a2l 文件并更新地址 命令用法 命…

比Maven快2~10倍的编译工具mvnd简介与实战

概述 maven-mvnd&#xff0c;可简称&#xff08;或缩写&#xff09;mvnd&#xff0c;the Maven Daemon。Apache Maven团队借鉴Gradle和Takari后开发的更快的构建工具。mvnd内嵌Maven&#xff0c;开发者可无缝从Maven迁移到mvnd。 参考资料&#xff1a;GitHub。 mvnd中会启动…

【数据结构篇】~二叉树(堆)

【数据结构篇】~二叉树&#xff08;堆&#xff09; 二叉树1.树2.树的组成3.二叉树4.堆1.向上调整算法2.向下调整算法3.堆排序 4.topk问题源码 二叉树 1.树 树的概念与结构​ 树是一种非线性的数据结构&#xff0c;它是由 n&#xff08;n>0&#xff09; 个有限结点组成一个…

BUG——GT911上电后中断一直触发

版型&#xff1a;正点原子 I.MX6UL MINI板 屏幕&#xff1a;7寸 1024*600 ATK-MD0700R V1.4 我的建议是买7寸屏幕就不要Mini板&#xff0c;因为Mini板太小装不下7寸屏幕&#xff0c;你需要一个更大的板子 简介&#xff1a; 算是作为一个后来者对这一现象的补充。解决方案就…

linux memory cgroup的memory.move_charge_at_immigrate含义

1.内核文档 上面的例子说明&#xff1a; 最开始某个进程是在cgroup A中&#xff0c;后面要迁移到cgroup B中&#xff0c;那么进程的内存计数是否要完全迁入B中&#xff0c;就是通过memory.move_charge_at_immigrate控制&#xff0c;如果目标cgroup也就是B设置了1到该字段中&am…

DBeaver安装使用

文章目录 简介支持的数据库支持的系统 下载安装DBeaver使用修改Maven下载jar地址窗口->首选项连接->驱动->Maven配置仓库地址 选择需要连接的数据库进行连接 简介 DBeaver 是一个通用的数据库管理工具和 SQL 客户端&#xff0c;支持 MySQL, PostgreSQL, Oracle, DB2,…

进存销系统

摘 要 伴随着我国全面推动信息化的趋势&#xff0c;我国的很多行业都在朝着互联网的方向进发。商品销售行业也有很多挑战。这次论文介绍的进存销系统就是为了能够解决当前传统商品进存销存在的问题&#xff0c;使得商品进存销能够更加有效率。电商智能化管理必不可少的帮手有进…

【VIsion Master】机器视觉软件二次开发(C#版本)学习笔记

0.前言 最近接手新项目&#xff0c;用海康威视旗下的HIK ROBOT Vision Master机器视觉软件做二次开发相关的项目&#xff0c;写一篇博客记录一下学习过程。 参考视频&#xff1a;https://www.bilibili.com/video/BV1tq4y1j7RP?p1 其他参考资料&#xff1a;软件自带的开发文档…

学习2d直线拟合-2

参考文章 直线拟合算法&#xff08;续&#xff1a;加权最小二乘&#xff09;_加权拟合直线法-CSDN博客 对比了参考文中和opencv中的直线拟合权重&#xff0c;不知道理解的对不对&#xff0c;前者是权重平方&#xff0c;后者没有平方 QtWidgetsApplication1::QtWidgetsApplic…

Excel中的“块”操作

在Excel中&#xff0c;有offset、index、indirect三个对“区域”操作的函数&#xff0c;是较高版本Excel中“块”操作的利器。 (笔记模板由python脚本于2024年08月20日 19:25:21创建&#xff0c;本篇笔记适合喜欢用Excel处理数据的coder翻阅) 【学习的细节是欢悦的历程】 Pytho…

幅频特性曲线分析及使用WPF绘制

文章目录 1、一阶惯性环节的幅频特性曲线分析及绘制2、二阶系统的幅频特性曲线分析及绘制3、一般的系统4、上位机代码实现4.1 一阶惯性系统4.2 二阶系统 5、稳定裕度5.1 幅值裕度5.2 相角裕度 参考 1、一阶惯性环节的幅频特性曲线分析及绘制 这里的a和b可以根据系统的不同修改,…

网络udp及ipc内存共享

大字符串找小字符串 调试 1. 信号处理函数注册&#xff1a;•一旦使用 signal 函数注册了信号处理函数&#xff0c;该函数就会一直有效&#xff0c;直到程序结束或者显式地取消注册。2. 注册多次的影响&#xff1a;•如果多次注册同一信号的处理函数&#xff0c;最后一次注册的…

【记录】基于Windows系统安装rust环境的过程

到官网下载安装包【入门 - Rust 程序设计语言 (rust-lang.org)】 ![[Pasted image 20240703142911.png]] 选择1&#xff0c;快速安装 选择编译配置&#xff0c;1为标准 安装完成 验证是否安装完毕 rustc --versioncargo --version验证成功&#xff01;

UneMeta创始人讲述自己在Web3+IP领域创业的心路历程

昨日&#xff0c;UneMeta创始人&#xff0c;Ann_tyrion在X分享了一篇推文&#xff0c;分享了自己在探索Web3与IP产业结合过程中的心路历程&#xff0c;她并没有像很多项目方那样一味的讲述宏大的叙事&#xff0c;而是字里行间透露出对这个行业的探索和不断给自己充实信念&#…

自动操作一键数据恢复/电子取证

对磁盘模拟扫描修复丢失数据的实验。 先挂载题目磁盘VHD。 Windows系统中打开磁盘管理&#xff0c;-操作&#xff0c;-附加VHD 可以看到已经加载出题目磁盘&#xff0c;接下来打开RStudio数据恢复软件&#xff0c;对其进行扫描。 操作找回丢失/被删除的数据 可以看到已经加载出…

DRF——pagination分页模块

文章目录 分页继承APIView类用法1.PageNumberPagination2.LimitOffsetPagination3.CursorPagination 继承GenericAPIView派生类用法1.PageNumberPagination2.LimitOffsetPagination3.CursorPagination 分页 在查看数据列表的API中&#xff0c;如果 数据量 比较大&#xff0c;肯…

【前端基础篇】JavaScript之DOM介绍

文章目录 WebAPI背景知识什么是WebAPI什么是APIAPI参考文档 DOM基本概念什么是DOMDOM树查找HTML元素方法概览1. document.getElementById(id)2.document.getElementsByTagName(name)3. document.getElementsByClassName(name)4. document.querySelector(CSS选择器)5. document.…

如何免费获取乡镇级边界数据geoJson数据

如何免费获取乡镇级边界数据geoJson数据 我们可以通过 阿里云数据可视化平台 &#xff0c;可以获取到中国各个省份/区级/县级的json数据&#xff0c;但是区级和县级&#xff0c;并没有包含街道和乡镇的数据 获取乡镇级边界数据 1.下载bigemap全能版 安装好后选择你要导出的…

Graphpad Prism for Mac 医学绘图软件教程

Mac分享吧 文章目录 效果一、下载软件二、开始安装1、双击运行软件&#xff0c;将其从左侧拖入右侧文件夹中&#xff0c;等待安装完毕2、应用程序显示软件图标&#xff0c;表示安装成功 三、运行测试安装完成&#xff01;&#xff01;&#xff01; 效果 一、下载软件 下载软件…