第8章 Qt 5模型-视图结构

合集下载

Qt5MVC模式(一)

Qt5MVC模式(一)

Qt5MVC模式(⼀)Qt5MVC模式(⼀):概述上By Xchen 20160627MVC设计模式起源于smalltalk的⼀种与⽤户界⾯设计相关的设计模式。

作⽤:有效的分离数据和⽤户界⾯。

组成:模型model(表⽰数据)、视图view(表⽰⽤户界⾯)、控制controller(定义⽤户在界⾯上的操作)。

interView框架Qt的MVC区别:将视图与控制结合在⼀起,同时添加了代理delegate能够⾃定义数据条⽬item的显⽰与编辑⽅式。

组成:模型model(表⽰数据)、视图view(表⽰⽤户界⾯)、代理delegate(⾃定义数据条⽬item的显⽰与编辑⽅式)。

模型与视图结构:模型与数据通信,并提供接⼝视图从模型中获取数据条⽬索引代理绘制数据条⽬通信⽅式:信号&槽⼯作过程:数据改变时,模型发出信号通知视图;⽤户对界⾯操作时,视图发出信号;代理发出信号告知模型和视图编辑器⽬前的状态;模型model(表⽰数据)抽象基类QAbstractItemModel列表的抽象基类QAbstractListModel、表格的抽象基类QAbstractTableModelQDirModel类是⽂件与⽬录的存储模型QStandardItemModel类QStringListModel类视图view(表⽰⽤户界⾯)抽象基类QAbstractItemViewQListView—QListWidget\QUndoViewQTableView—QTableWidgetQTreeView—QTreeWidgetQColumnViewQHeaderView实际上:QListWidget、QTableWidget、QTreeWidget已经包含数据,是模型与视图集成的类代理delegate(⾃定义数据条⽬item的显⽰与编辑⽅式)抽象基类QAbstractItemDelegateQItemDelegate/QStyleItemDelegate类QItemDelegate 由类QSqlRelationDelegate继承实例⼀:⽂件⽬录浏览器截图:创建过程:1. 声明⼀个QDirModel对象model;2. 分别声明三个视图对象QTreeView、QTableView、QListView;3. 设置视图对象的模型为setModel(model);4. 设置视图的选择模式setSelectionMode(QAbstractItemView::MultiSelection);5. 信号槽的连接6. 分隔窗体的设置头⽂件:#include <QApplication>#include <QAbstractItemModel>#include <QAbstractItemView>#include <QItemSelectionModel>#include <QDirModel>#include <QTreeView>#include <QListView>#include <QTableView>#include <QSplitter>QItemSelectionModel类:⽤来设置模型的选择模式的。

第9章模式视图(ModelView)结构精品PPT课件

第9章模式视图(ModelView)结构精品PPT课件
<<tr("阿利伯克级")<<tr("AAAV")<<tr("M1A1")<<tr("F-22"); }
9.2 模型(Models)
columnCount()函数中,模型的列固定为3,所以直接返回“3”。 int ModelEx::columnCount(const QModelIndex &parent) const { return 3; } rowCount()函数返回模型的行数。 int ModelEx::rowCount(const QModelIndex &parent) const {
QApplication app(argc,argv);
QTextCodec::setCodecForTr(QTextCodec::codecForLocale()); ModelEx modelEx; QTableView view; view.setModel(&modelEx); view.setWindowTitle(QObject::tr("modelEx")); view.resize(400,400); view.show(); return app.exec(); }
}
9.2 模型(Models)
(3) 源文件main.cpp中,将模型和视图关联,具体代码如下:
#include <QApplication> #include "modelex.h"
#include <QTextCodec> #include <QTableView> int main(int argc,char *argv[]) {

Qt基础教程之ModelView(模型视图)结构

Qt基础教程之ModelView(模型视图)结构

Model/View(模型/视图)结构是Qt 中用界面组件显示与编辑数据的一种结构,视图(View)是显示和编辑数据的界面组件,模型(Model)是视图与原始数据之间的接口。

GUI 应用程序的一个很重要的功能是由用户在界面上编辑和修改数据,典型的如数据库应用程序。

数据库应用程序中,用户在界面上执行各种操作,实际上是修改了界面组件所关联的数据库内的数据。

将界面组件与所编辑的数据分离开来,又通过数据源的方式连接起来,是处理界面与数据的一种较好的方式。

Qt 使用 Model/View 结构来处理这种关系,Model/View 的基本结构如图 1 所示。

图 1 Model/View基本结构其中各部分的功能如下:•数据(Data)是实际的数据,如数据库的一个数据表或SQL查询结果,内存中的一个 StringList,或磁盘文件结构等。

•视图或视图组件(View)是屏幕上的界面组件,视图从数据模型获得每个数据项的模型索引(model index),通过模型索引获取数据,然后为界面组件提供显示数据。

Qt 提供一些现成的数据视图组件,如 QListView、QTreeView 和QTableView 等。

•模型或数据模型(Model)与实际数据通信,并为视图组件提供数据接口。

它从原始数据提取需要的内容,用于视图组件进行显示和编辑。

Qt 中有一些预定义的数据模型,如 QStringListModel 可作为 StringList 的数据模型,QSqlTableModel 可以作为数据库中一个数据表的数据模型。

由于数据源与显示界面通过 Model/View 结构分离开来,因此可以将一个数据模型在不同的视图中显示,也可以在不修改数据模型的情况下,设计特殊的视图组件。

在 Model/View 结构中,还提供了代理(Delegate)功能,代理功能可以让用户定制数据的界面显示和编辑方式。

在标准的视图组件中,代理功能显示一个数据,当数据被编辑时,代理通过模型索引与数据模型通信,并为编辑数据提供一个编辑器,一般是一个 QLineEdit 组件。

第8章 图形视图(GraphicsView)框架

第8章 图形视图(GraphicsView)框架

1.场景坐标 场景坐标是所有图元的基础坐标系统。场景坐标系统描述了顶层的图元, 每个图元都有场景坐标和相应的包容框。场景坐标的原点在场景中心,坐标原 点是X轴正方向向右,Y轴正方向向下。 QGraphicsScene类的坐标系是以中心为原点(0,0),如图8.2所示。
2.视图坐标 视图坐标是窗口部件的坐标。视图坐标的单位是像素。QGraphicsView视口 的左上角是(0,0),X轴正方向向右,Y轴正方向向下。所有的鼠标事件最开始 都是使用视图坐标。 QGraphicsView类继承自QWidget类,因此它和其他的QWidget类一样以窗口 的左上角作为自己坐标系的原点,如图8.3所示。
3.图元坐标 图元使用自己的本地坐标,这个坐标系统通常以图元中心为原点,这也是所 有变换的原点。图元坐标方向是X轴正方向向右,Y轴正方向向下。创建图元后, 只需要注意图元坐标就可以了,QGraphicsScene和QGraphicsView会完成所有的变 换。 QGraphicsItem类的坐标系,在调用QGraphicsItem类的paint()函数重画图元时 则以此坐标系为基准,如图8.4所示。
Graphics View框架结构主要包含了场景类(QGraphicsScene)、视图类 (QGraphicsView)和图元类(QGraphicsItem)。场景类提供了一个用于管理位 于其中的众多图元容器,视图类用于显示场景中的图元,一个场景可以通过多 个视图表现,一个场景包括多个几何图形。它们三者之间的关系可用图8.1表示。
场景类:QGraphicsScene类 它是一个用于放置图元的容器,本身是不可见的,必须通过与之相连的视图 类来显示及与外界进行互操作。通过QGraphicsScene::addItem()可以加入一个图 元到场景中。图元可以通过多个函数进行检索。QGraphicsScene::items()和一些重 载函数可以返回和点、矩形、多边形或向量路径相交的所有图元。 QGraphicsScene::itemAt()返回指定点的最顶层图元。 视图类:QGraphicsView类 它提供一个可视的窗口,用于显示场景中的图元。在同一个场景中可以有多 个视口,也可以为相同的数据集提供几种不同的视口。 QGraphicsView是可滚动的窗口部件,可以提供滚动条来浏览大的场景。如 果需要使用OpenGL,可以使用QGraphicsView::setViewport()将视口设置为 QGLWidget。

软件架构设计-五视图法

软件架构设计-五视图法

软件架构设计-五视图法 关于软件架构设计这⾥不再赘述,不清楚的去问度娘。

本篇⽂章主要讲解软件架构设计的五视图法及每种视图如何设计。

⼀、是什么1、逻辑架构 逻辑架构关注的是功能,包含⽤户直接可见的功能,还有系统中隐含的功能。

或者更加通俗来描述,逻辑架构更偏向我们⽇常所理解的“分层”,把⼀个项⽬分为“表⽰层、业务逻辑层、数据访问层”这样经典的“三层架构”。

2、开发架构 开发架构则更关注程序包,不仅仅是我们⾃⼰写的程序,还包括应⽤程序依赖的SDK、第三⽅类库、中间件等。

尤其是像⽬前主流的Java、.NET等依靠虚拟机的语⾔和平台,以及主流的基于数据库的应⽤,都会⽐较关注。

和逻辑架构有紧密的关联。

3、运⾏架构 顾名思义,更关注的是应⽤程序运⾏中可能出现的⼀些问题。

例如并发带来的问题,⽐较常见的“线程同步”问题、死锁问题、对象创建和销毁(⽣命周期管理)问题等等。

开发架构,更关注的是程序运⾏前的⼀些准备⼯作,在静⽌状态下就能规划好做好的,⽽运⾏架构,更多考虑的是程序运⾏后可能发⽣的⼀些问题。

4、物理架构 物理架构,更关注的系统、⽹络、服务器等基础设施。

例如:如何通过服务器部署和配置⽹络环境,来实现应⽤程序的“可伸缩性、⾼可⽤性”。

或者举⼀个实际的例⼦,如何通过设计基础设施的架构,来保障⽹站能⽀持同时10W⼈在线、7*24⼩时提供服务,当超过10W⼈或者低于10W⼈在线时,可以很⽅便的调整部署架构来⽀撑。

5、数据架构 数据架构,更关注的是数据持久化和存储层⾯的问题,也可能会包括数据的分布、复制、同步等问题。

更贴切来讲,如何选择需要的关系型数据库、流⾏的NOSQL,如何保障数据存储层⾯的性能、⾼可⽤性、灾备等等。

很多时候,和物理架构是有紧密联系的,但它更关注数据存储层⾯的,物理架构更关注整个基础设施部署层⾯。

⼆、怎么做(⽰例&⼯具)1、逻辑架构 绘图⼯具:visio、亿图2、开发架构 绘图⼯具:visio、亿图3、运⾏架构 不常⽤,此处不做整理4、物理架构 绘图⼯具:visio、亿图5、数据架构 绘图⼯具:PowerDesigner 三、概要设计模板参考资料:。

qt5 教程

qt5  教程

qt5 教程Qt5是一个流行的开源C++框架,用于构建跨平台的图形用户界面(GUI)应用程序。

本教程介绍了Qt5的基础知识和常见的使用技巧。

第一部分:引言和安装在本部分中,我们将介绍Qt5的背景和优势,并详细讲解如何在不同操作系统上安装Qt5。

第二部分:Qt5的基本概念本部分将介绍Qt5的核心概念,如QObject、QWidget和信号与槽等。

我们将讲解如何创建、显示和管理基本的UI界面元素。

第三部分:Qt5的布局管理在本部分中,我们将学习Qt5的布局管理器,包括水平布局、垂直布局和网格布局等。

我们还将讲解如何使用布局管理器来自动调整UI界面元素的大小和位置。

第四部分:Qt5的常用控件本部分将介绍Qt5的常见控件,如按钮、标签、文本框和列表框等。

我们将讲解如何创建和使用这些控件,并且介绍它们的常用属性和方法。

第五部分:Qt5的绘图和动画在本部分中,我们将学习Qt5的绘图和动画功能。

我们将介绍如何使用Qt绘制基本图形和进行颜色填充,以及如何创建简单的动画效果。

第六部分:Qt5的文件和数据处理本部分将介绍Qt5的文件和数据处理功能。

我们将讲解如何读写文件、解析和生成JSON、XML和CSV等格式的数据。

第七部分:Qt5的网络编程在本部分中,我们将学习Qt5的网络编程功能。

我们将介绍如何创建基于TCP和UDP的网络连接,并实现简单的客户端和服务器程序。

请注意,本教程是以简要的方式介绍Qt5的基础知识和常见的使用技巧,以供初学者参考。

如果您对Qt5需要更深入的理解或拥有更高级的使用需求,建议参考官方文档或更专业的教程。

qt 5 教程

qt 5 教程

qt 5 教程Qt 5 教程
1. 基础知识
- 安装Qt 5
- Qt 5 的主要特性
- Qt Creator 的使用
- Qt 5 的基本语法
2. 窗口应用程序开发
- 创建一个窗口应用程序
- 添加控件和布局
- 信号与槽的使用
- 窗口之间的通信
3. 图形界面设计
- 使用样式表美化界面
- 自定义控件的创建
- 绘图和渲染技巧
4. 数据库操作
- 连接数据库
- 执行SQL查询
- 数据库事务管理
5. 网络编程
- 创建网络客户端
- 创建网络服务器
- 进行网络通信
6. 多线程编程
- 创建线程
- 线程间通信
- 线程同步和互斥
7. 文件操作
- 文件读写
- 目录操作
- 文件压缩和解压缩
8. 插件开发
- 创建Qt插件
- 插件的动态加载与卸载
- 插件的扩展性和灵活性
9. 跨平台开发
- 开发可在不同平台上运行的应用程序 - 处理平台差异性
- 使用Qt的跨平台特性
10. 调试与测试
- 使用Qt Creator进行调试
- 单元测试和自动化测试
- 性能优化和内存泄漏检测
这个Qt 5教程旨在帮助你学习Qt 5的各种功能和用法。

希望能对你的Qt开发之路有所帮助!。

Qt5学习资料

Qt5学习资料

Qt 学习之路2目 录1 序 (1)2 Qt 简介 (2)3 Hello, world! (3)4 信号槽 (9)5 自定义信号槽 (13)6 Qt 模块简介 (18)7 MainWindow 简介 (22)8 添加动作 (25)9 资源文件 (30)10 对象模型 (35)11 布局管理器 (37)12 菜单栏、工具栏和状态栏 (41)13 对话框简介 (44)14 对话框数据传递 (47)15 标准对话框 QMessageBox (49)16 深入 Qt5 信号槽新语法 (53)17 文件对话框 (58)18 事件 (62)19 事件的接受与忽略 (65)20 event() (69)21 事件过滤器 (71)22 事件总结 (74)23 自定义事件 (78)24 Qt 绘制系统简介 (81)25 画刷和画笔 (84)26 反走样 (89)27 渐变 (91)28 坐标系统 (97)29 绘制设备 (104)30 Graphics View Framework (107)31 贪吃蛇游戏(1) (110)32 贪吃蛇游戏(2) (114)33 贪吃蛇游戏(3) (120)34 贪吃蛇游戏(4) (124)35 文件 (127)36 二进制文件读写 (131)37 文本文件读写 (135)38 存储容器 (139)39 遍历容器 (144)40 隐式数据共享 (151)41 model/view 架构 (153)1 序51CTO上面曾经有过这么一个系列,具体是 Qt 的入门教程。

当时强调过,那些文章大致是根据《C++ GUI Programming with Qt 4, 2nd Editon》编写的。

时过境迁,现在回头看看,已经过去了整整三年。

如果你仔细看下那篇系列文章就会发现,发表时间竟然是 2009 年 8 月 20 日;而今天是 2012 年 8 月 20 日。

或者是冥冥之中的感觉,竟然选择了同一个时间。

  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。

8.3 视图(View)
以上完成了表格数据的加载,下面介绍柱状统计图的绘制。 具体实现步骤如下。 (1)自定义HistogramView类继承自QAbstractItemView类,用于对表格数 据进行柱状图显示。下面是头文件“histogramview.h”的具体代码。 (2)源文件“histogramview.cpp”的具体代码。 dataChanged()函数实现当Model中的数据更改时,调用绘图设备的update() 函数进行更新,反映数据的变化。具体实现代码。 void HistogramView::dataChanged(const QModelIndex &topLeft, const QModelIndex &bottomRight) { QAbstractItemView::dataChanged(topLeft,bottomRight); viewport()->update(); } setSelectionModel()函数为selections赋初值,具体代码如下:
openFile()函数完成打开所选的文件内容,其具体实现代码。
8.3 视图(View)
新建一个文本文件,命名为“histogram.txt”,保存在项目 D:\Qt\CH8\CH803\ build-ViewEx-Desktop_Qt_5_4_0_MinGW_32bit-Debug目录下, 文件内容及打开后的效果如图8.6所示。
8.3 视图(View)
setupView()函数的具体实现代码如下:
void MainWindow::setupView() { table = new QTableView; //新建一个QTableView对象 table->setModel(model); //为QTableView对象设置相 同的Model QItemSelectionModel *selectionModel=new QItemSelectionModel(model); //(a) table->setSelectionModel(selectionModel); connect(selectionModel,SIGNAL(selectionChanged(QItemSelection, ItemSelection)),table,SLOT(selectionChanged(QItemSelection,QItemSelec-tion))); //(b) splitter = new QSplitter; splitter->setOrientation(Qt::Vertical); splitter->addWidget(table); setCentralWidget(splitter); }
data()函数返回指定索引的数据,即将数值映射为文字。
8.2 模型(Model)
表8.1列出了Item主要的角色及其描述。
常 量 Qt::DisplayRole Qt::DecorationRole Qt::EditRole Qt::ToolTipRole Qt::StatusTipRole Qt::WhatsThisRole 显示文字 绘制装饰数据(通常是图标) 在编辑器中编辑的数据 工具提示 状态栏提示 What’s This文字 描 述
起的类。
3.代理(Delegate) InterView框架中的所有代理都基于抽象基类QAbstractItemDelegate类,此类 由QItemDelegate 和 QStyledItemDelegate类继承。其中,QItemDelegate类由表示 数据库中关系代理的QSqlRelationalDelegate类继承。
8.1 概述
8.1.1 基本概念
1.模型(Model) InterView框架中的所有模型都基于抽象基类QAbstractItemModel类,此类由
QProxyModel、QAbstractListModel、QAbstractTableModel、
QAbstractProxyModel、QDirModel、QFileSystemModel、 QHelpContentModel 和 QStandardItemModel类继承。其中,QAbstractListModel 类和QAbstractTableModel类是列表和表格模型的抽象基类,如果需要实现列表或 表格模型,则应从这两个类继承。
第8章 Qt 5模型/视图结构
8.1 8.2 8.3 8.4 概述 模型(Model) 视图(View) 代理(Delegate)
Qt的模型/视图结构分为三部分:模型(Model)、视图(View)和代理 (Delegate)。其中,模型与数据源通信,并为其他部件提供接口;而视图从模 型中获得用来引用数据条目的模型索引(Model Index)。在视图中,代理负责 绘制数据条目,当编辑条目时,代理和模型直接进行通信。模型/视图/代理之间 通过信号和槽进行通信,如图8.1所示。
8.1.2 【实例】:模型/视图类使用
【例】(简单) 实现一个简单的文件目录浏览器,完成效果如图8.2所示。实 例文件见光盘CH801。
创建工程“DirModeEx.pro”,其源文件“main.cpp”中的具体代码。 最后运行结果如图8.2所示。
8.2 模型(Model)
【例】(难度一般) 通过实现将数值代码转换为文字的模型来介绍如何使用 自定义模型。此模型中保存了不同军种的各种武器,实现效果如图8.3所示。实例 文件见光盘CH802。
8.2 模型(Model)
headerData()函数返回固定的表头数据,设置水平表头的标题,具体代码如 下: QVariant ModelEx::headerData(int section, Qt::Orientation orientation, int role) const { if(role==Qt::DisplayRole&&orientation==Qt::Horizontal) return header[section]; return QAbstractTableModel::headerData(section,orientation,role); }
Qt::SizeHintRole
Qt::FontRole Qt::TextAlignmentRole Qt::BackgroundRole Qt::ForegroundRole Qt::CheckStateRole Qt::UserRole
尺寸提示
默认代理的绘制使用的字体 默认代理的对齐方式 默认代理的背景画刷 默认代理的前景画刷 默认代理的检查框状态 用户自定义的数据的起始位置
(4)运行结果如图8.3所示。
8.3 视图(View)
【例】(难度中等) 通过利用自定义的View,实现一个对TableModel的表格 数据进行显示的柱状统计图例子,以此介绍如何应用自定义的View。实现效果如 图8.4所示。实例文件见光盘CH803。
8.3 视图(View)
具体实现步骤如下。 (1)完成主窗体,以便显示View的内容。MainWindow 类继承自 QMainWindow类,作为主窗体。以下是头文件“mainwindow.h”的具体代码。 (2)下面是源文件“mainwindow.cpp”中的具体代码。 setupModel()函数新建一个Model,并设置表头数据,其具体实现代码如下: void MainWindow::setupModel() { model = new QStandardItemModel(4,4,this); model->setHeaderData(0,Qt::Horizontal,tr("部门")); model->setHeaderData(1,Qt::Horizontal,tr("男")); model->setHeaderData(2,Qt::Horizontal,tr("女")); model->setHeaderData(3,Qt::Horizontal,tr("退休")); }
8.3 视图(View)
槽函数slotOpen()完成打开标准文件对话框,具体代码如下:
void MainWindow::slotOpen() { QString name; name = QFileDialog::getOpenFileName(this,"打开",".","histogram files (*.txt)"); if (!name.isEmpty()) openFile(name); }
8.2 模型(Model)
(3)在源文件“main.cpp”中,将模型和视图关联,具体代码如下:
#include <QApplication> #include "modelex.h" #include <QTableView> int main(int argc,char *argv[]) { QApplication a(argc,argv); ModelEx modelEx; QTableView view; view.setModel(&modelEx); view.setWindowTitle(QObject::tr("modelEx")); view.resize(400,400); view.show(); return a.exec(); }
8.2 模型(Model)
columnCount()函数中,模型的列固定为“3”,所以直接返回“3”。 int ModelEx::columnCount(const QModelIndex &parent) const { return 3; } rowCount()函数返回模型的行数。 int ModelEx::rowCount(const QModelIndex &parent) const { return army.size(); }
相关文档
最新文档