Qt中的模型视图设计模式

最新推荐文章于 2025-10-10 08:54:48 发布
原创 最新推荐文章于 2025-10-10 08:54:48 发布 · 625 阅读 · 1 ·
CC 4.0 BY-SA版权
博客大多是学习笔记，仅供自己总结回顾并无其他用途，并且大多都注明了出处，如有侵权，请告知，立即删除!

文章目录

1 初探Qt中的模型视图设计模式

模型视图设计模式的核心思想：

  • 模型（数据）与视图（显示）相分离。
  • 模型对外提供标准接口存取数据（不关心数据如何显示）。
  • 视图自定义数据的显示方式（不关心数据如何组织存储）。

模型视图模式的直观理解：
在这里插入图片描述
模型视图模式的工作机制：

  • 当数据发生改变时：模型发出信号通知视图。
  • 当用户与视图进行交互时：视图发出信号提供交互信息。

Qt中的模型类层次结构：
在这里插入图片描述
Qt中视图类的层次结构：
在这里插入图片描述
关键技术问题：模型如何为数据提供统一的访问方式？

深入理解：在Qt中，不管模型以什么结构组织数据，都必须为每一个数据提供独一无二的索引；视图通过索引访问模型中的具体数据。

模型视图编程示例：
在这里插入图片描述
Widget.h：

#ifndef WIDGET_H
#define WIDGET_H

#include <QtGui/QWidget>
#include <QFileSystemModel>
#include <QTreeView>

class Widget : public QWidget
{
    Q_OBJECT
    
    QFileSystemModel m_fsModel;
    QTreeView m_treeView;
public:
    Widget(QWidget *parent = 0);
    ~Widget();
};

#endif // WIDGET_H

Widget.cpp：

#include "Widget.h"
#include <QDir>

Widget::Widget(QWidget *parent)
    : QWidget(parent)
{
    m_treeView.setParent(this);
    m_treeView.move(10, 10);
    m_treeView.resize(500, 300);

    m_fsModel.setRootPath(QDir::currentPath());

    m_treeView.setModel(&m_fsModel);

    m_treeView.setRootIndex(m_fsModel.index(QDir::currentPath()));
}

Widget::~Widget()
{
    
}

main.cpp：

#include <QtGui/QApplication>
#include "Widget.h"

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    Widget w;
    w.show();
    
    return a.exec();
}

对模型视图设计模式总结一下：

  • 模型定义标准接口（成员函数）对数据进行访问。
  • 视图通过标准接口获取数据并定义显示方式。
  • 模型使用信号与槽的机制通知视图数据变化。
  • 模型的数据都是以层次结构表示的。

2 模型视图中的索引

模型中的索引：

  • 模型索引是数据与视图分离的重要机制。
  • 模型中的数据使用唯一的索引来访问。
  • 索引是访问模型中具体数据的约定方式。
  • QModelIndex是Qt中的模型索引类：
    • 包含具体数据的访问途径。
    • 包含一个指向模型的指针。

索引的意义：
在这里插入图片描述
索引中的行和列：

  • 线性模型可以使用（row，column）作为数据索引。
    在这里插入图片描述
    问题：只用行和列描述数据索引是否足够通用？

思考：

  • 如何索引以属性结构组织的数据？
    在这里插入图片描述

模型中的通用树形结构：在这里插入图片描述
模型中数据索引的通用方式：

  • 三元组：（row、column、parent）。
  • 索引在需要时由模型实时创建。
  • 使用空索引作为父节点表示顶层数据元素。
  • 特殊的模型可以自定义特殊的索引获取方式。
    在这里插入图片描述
    在这里插入图片描述
    编程实验：数据索引深入理解

Widget.h：

#ifndef WIDGET_H
#define WIDGET_H

#include <QtGui/QWidget>
#include <QPlainTextEdit>
#include <QFileSystemModel>

class Widget : public QWidget
{
    Q_OBJECT
    
    QPlainTextEdit m_edit;
    QFileSystemModel m_fsm;
protected slots:
    void onDirectoryLoaded(const QString& path);
public:
    Widget(QWidget *parent = 0);
    ~Widget();
};

#endif // WIDGET_H

Widget.cpp：

#include "Widget.h"
#include <QDir>
#include <QModelIndex>
#include <QByteArray>
#include <QBuffer>
#include <QTextStream>

Widget::Widget(QWidget *parent)
    : QWidget(parent)
{
    m_edit.setParent(this);
    m_edit.move(10, 10);
    m_edit.resize(500, 300);

    connect(&m_fsm, SIGNAL(directoryLoaded(QString)), this, SLOT(onDirectoryLoaded(QString)));

    m_fsm.setRootPath(QDir::currentPath());
}

void Widget::onDirectoryLoaded(const QString& path)
{
    QModelIndex root = m_fsm.index(path);
    QByteArray array;
    QBuffer buffer(&array);

    if( buffer.open(QIODevice::WriteOnly) )
    {
        QTextStream out(&buffer);

        out << m_fsm.isDir(root) << endl;
        out << m_fsm.data(root).toString() << endl;
        out << root.data().toString() << endl;
        out << &m_fsm << endl;
        out << root.model() << endl;
        out << m_fsm.filePath(root) << endl;
        out << m_fsm.fileName(root) << endl;
        out << endl;

        for(int i=0; i<m_fsm.rowCount(root); i++)
        {
            QModelIndex ci = m_fsm.index(i, 0, root);

            out << ci.data().toString() << endl;
        }

        out.flush();
        buffer.close();
    }

    if( buffer.open(QIODevice::ReadOnly) )
    {
        QTextStream in(&buffer);

        m_edit.insertPlainText(in.readAll());

        buffer.close();
    }
}

Widget::~Widget()
{
    
}

main.cpp：

#include <QtGui/QApplication>
#include "Widget.h"

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    Widget w;
    w.show();
    
    return a.exec();
}

后面需要解决一个问题：QFileSystemModel中是如何组织数据的？如何手动解析QFileSystemModel中的数据？

3 模型中的数据组织方式初探

问题：不同的视图如何显示同一个模型中的数据？

Qt中的标准模型定义：
在这里插入图片描述
MainWindow.h：

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QtGui/QMainWindow>
#include <QTableView>
#include <QStandardItemModel>
class MainWindow : public QMainWindow
{
    Q_OBJECT
private:
    QStandardItemModel m_standerdModel;
    QTableView m_tableView;
    void initStanderdModel();
    void initTableModel();
public:
    MainWindow(QWidget *parent = 0);
    ~MainWindow();
};

#endif // MAINWINDOW_H

MainWindow.cpp：

#include "MainWindow.h"
#include <QStandardItem>

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
{
    initStanderdModel();
    initTableModel();
    m_tableView.setModel(&m_standerdModel);
}
void MainWindow::initStanderdModel()
{
    QStandardItem* root = m_standerdModel.invisibleRootItem();
    QStandardItem* itemA = new QStandardItem();
    QStandardItem* itemB = new QStandardItem();
    QStandardItem* itemC = new QStandardItem();

    itemA->setData("A");//只是往数据项里面放了数据，并没有告诉如何显示
    itemA->setData("Tip A");
    itemA->setData("Help A");
    itemB->setData("B");
    itemB->setData("Tip B");
    itemC->setData("C");
    itemC->setData("Tip B");
    itemC->setData("Help C");

    root->setChild(0, 0, itemA);//itemA、itemB、itemC都是new出来的，这里将数据项
    root->setChild(0, 1, itemB);//加入模型的同时也相当于指定了父组件，不会造成内存泄漏
    root->setChild(1, 0, itemC);

}
void MainWindow::initTableModel()
{
    m_tableView.resize(300,100);
    m_tableView.move(10,10);
    m_tableView.setParent(this);
}
MainWindow::~MainWindow()
{
    
}

main.cpp：

#include <QtGui/QApplication>
#include "MainWindow.h"

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    MainWindow w;
    w.show();
    
    return a.exec();
}

运行结果如下：
在这里插入图片描述
我们会发现结果无法正常显示，为了使数据能够正常显示，我们需要引入数据角色的概念：

  • 模型中的数据在视图中的用途（显示方式）可能不同。
  • 模型必须为数据设置特定数据角色（数据属性）。
  • 数据角色用于提示视图数据的作用。
  • 数据角色是不同视图以统一风格显示数据的标准。

Qt中的数据角色定义：
在这里插入图片描述
数据角色的意义：

  • 定义了数据在特定系统下的标准用途。
  • 不同的视图可以通过相同标准显示数据。

注意：数据角色只是一个附加的属性，这个属性代表推荐的数据显示方式。不同的视图完全可以自由解析或者忽略数据的角色信息。

更改后的代码如下：
Widget.h：

#ifndef WIDGET_H
#define WIDGET_H

#include <QtGui/QWidget>
#include <QTableView>
#include <QListView>
#include <QTreeView>
#include <QStandardItemModel>

class Widget : public QWidget
{
    Q_OBJECT
    
    QStandardItemModel m_model;
    QTableView m_tableView;
    QListView m_listView;
    QTreeView m_treeView;

    void initModel();
    void initView();
public:
    Widget(QWidget *parent = 0);
    ~Widget();
};

#endif // WIDGET_H

Widget.cpp：

#include "Widget.h"
#include <QStandardItem>

Widget::Widget(QWidget *parent)
    : QWidget(parent, Qt::WindowContextHelpButtonHint)
{
    initModel();
    initView();

    m_tableView.setModel(&m_model);
    m_listView.setModel(&m_model);
    m_treeView.setModel(&m_model);
}

void Widget::initModel()
{
    QStandardItem* root = m_model.invisibleRootItem();
    QStandardItem* itemA = new QStandardItem();
    QStandardItem* itemB = new QStandardItem();
    QStandardItem* itemC = new QStandardItem();
    QStandardItem* itemChild = new QStandardItem();

    itemA->setData("A", Qt::DisplayRole);
    itemA->setData("Tip A", Qt::ToolTipRole);
    itemA->setData("Help A", Qt::WhatsThisRole);

    itemB->setData("B", Qt::DisplayRole);
    itemB->setData("Tip B", Qt::ToolTipRole);

    itemC->setData("C", Qt::DisplayRole);
    itemC->setData("Tip C", Qt::ToolTipRole);
    itemC->setData("Help C", Qt::WhatsThisRole);

    itemChild->setData("Child", Qt::DisplayRole);
    itemChild->setData("Tip Child", Qt::ToolTipRole);
    itemChild->setData("Help Child", Qt::WhatsThisRole);

    itemC->setChild(0, 0, itemChild);

    root->setChild(0, 0, itemA);
    root->setChild(0, 1, itemB);
    root->setChild(1, 0, itemC);
}

void Widget::initView()
{
    m_tableView.setParent(this);
    m_tableView.move(10, 10);
    m_tableView.resize(300, 100);

    m_listView.setParent(this);
    m_listView.move(10, 120);
    m_listView.resize(300, 100);

    m_treeView.setParent(this);
    m_treeView.move(10, 230);
    m_treeView.resize(300, 100);
}

Widget::~Widget()
{
    
}

main.cpp：

#include <QtGui/QApplication>
#include "Widget.h"

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    Widget w;
    w.show();
    
    return a.exec();
}

运行结果如下：
在这里插入图片描述

参考资料：

  1. QT实验分析教程
Qt中的设计模式
冯Jungle的个人博客
10-24 6729
Qt中有很多设计模式的身影。本文简单介绍3种，分别是单例模式、观察者模式和适配器模式。 单例模式 如下代码，通过宏aApp返回instance。可以看到，类QCoreApplication的构造函数是private。 #define qApp QCoreApplication::instance() class Q_CORE_EXPORT QCoreApplication #ifndef QT_NO_QOBJECT : public QObject #endif { #ifndef Q..
Qt设计模式-单例模式
热门推荐
凌风畅霄的博客
05-06 1万+
qt中单例模式全生命周期知识点整理。
Qt设计模式
10-29
QtCreator书籍，讲解清晰，入门容易。如果有需要的可以下载下去使用。
Qt中的模型-视图
echo_bright_的博客
09-21 2810
做GUI应用程序开发的同学想必都知道MVC设计模式，MVC即Model-View-Controller，模型-视图-控制器。现我试图将Qt中的“MVC”讲清楚，先从简单的模型-视图说起。1. 模型-视图基本概念  模型-视图中，模型用于数据的存放/管理，视图用于数据的显示。模型-视图的核心思想是将模型和视图解耦，即将二者分离：模型对外提供标准接口，通过接口外界可以存取数据，模型不需要关心数据的显示；
QT模型/视图架构入门
最新发布
深之JohnChen的专栏
10-10 1213
text属性类型描述objectNameQString对象名称模型类主要通过方法提供功能方法参数返回值描述rowCount()int返回行数（对于列表，列数固定为1）int返回1index()创建索引parent()返回无效索引方法参数返回值描述rowCount()int返回行数int返回列数index()创建索引parent()返回无效索引cppQ_OBJECTpublic:int age;// 初始化数据。
QT--模型/视图
如履薄冰
12-26 1408
如果内置模型无法满足需求，可以继承。
qt模型视图结构
weixin_30838921的博客
02-23 219
View 类 概念 在model/view架构中，view从model中获得数据项然后显示给用户。数据显示的方式不必与model提供的表示方式相同，可以与底层存储数据项的数据结构完全不同。 内容与显式的分离是通过由QAbstractItemModel提供的标准模型接口，由QAsbstractItemview提供的标准视图接口共同实现的。普遍使用model index来表示数据项。view...
Activity的四种启动模式
FlippedY的博客
09-25 893
Activity的四种启动模式 附加：返回栈是一组存放Activity集合的栈，用来管理Activity。当Activity位于栈顶时，Activity则会显示给用户（系统总是显示栈顶的Activity给用户），Activity可叠加，每次创建一个新的Activity，新的Activity则会入栈；若调用finish()方法或按下返回键（bankspace）,此时Activity会出栈（Activity会销毁）。 standard模式 默认情况下，Activity的启动方式为standard模式，在此模
qt模型/视图结构
pxxzhk的博客
10-21 1623
模型/视图结构是一种将数据存储和界面展示分离的编程方法。模型存储数据，视图组件显示模型中的数据，在视图组件里修改的数据会被自动保存到模型里。模型的数据来源可以是内存中的字符串列表或二维表格型数据，也可以是数据库中的数据表，一种模型可以用不同的视图组件来显示数据，所以模型/视图结构是一种高效、灵活的编程结构。QAbstractItemModel 是所有模型类的直接或间接父类, 它定义了模型的通用接口函数，例如用于插入行、删除行、设置数据的函数。
Qt框架中MVC模型视图设计模式入门指南
在现代软件开发中，模型-视图-控制器（Model-View-Controller，MVC）是一种被广泛采用的设计模式，用于将数据表示、用户交互与业务逻辑分离，从而提高应用的可维护性和扩展性。Qt是一个跨平台的C++应用程序框架，...
Qt之模型/视图（实时更新数据）
01-09
在Qt框架中，模型/视图（Model/View）架构是一种设计模式，它将数据处理与用户界面分离开来，使得两者可以独立地发展和维护。这种架构在处理大量数据和复杂的用户交互时尤其有效。在"Qt之模型/视图（实时更新数据）...
精选资源
Qt MVC模型视图代码标准模板
11-24
在Qt框架中，MVC（Model-View-Controller）模式是一种设计模式，它将应用程序的数据、用户界面和逻辑控制分离开来，提高了代码的可维护性和可扩展性。本篇文章将详细探讨Qt MVC模型视图代码的标准模板，并结合SQLite...
QT 模型视图设计模式（一）
qq_36147009的博客
04-29 512
模型视图设计模式的核心思想 -- 模型（数据）与视图（显示）相分离 -- 模型对外提供标准接口存取数据（不关心数据如何显示） -- 视图自定义数据的显示方式（不关心数据如何组织存储） 模型视图模式的工作机制 -- 当数据发生改变时 模型发出信号通知视图 -- 当用户与视图进行交互时 视图发出信号提供交互信息 关键技术问题：...
【QT】QT模型/视图
半生瓜のblog
02-06 4921
模型/视图编程 Qt中的模型/视图架构用来实现大量的数据存储、处理及显示。 MVC(Model-View-Controller)包括了3个组件：模型(model)是应用对象，用来表示数据；视图(View)是模型的用户界面，用来显示数据；控制(Controller)定义了用户界面对用户输入的反应方式。 委托(Delegate)用于定制数据的渲染和编辑方式。 模型 所有的模型都基于QAbstractItemModel类，该类提供了十分灵活的接口来处理各种视图，这些视图的数据表现形式为表格(table)、列表(
QT中的模型/视图综合讲解
1
03-21 2003
关于Qt中MVC的介绍与使用，助手中有一节模型/视图编程（Model/View Programming）讲解的很清晰。     Qt包含一组使用模型/视图结构的类，可以用来管理数据并呈现给用户。这种体系结构引入的分离使开发人员更灵活地定制项目，并且提供了一个标准模型的接口，以允许广泛范围的数据源被使用到到现有的视图中。     模型 - 视图 - 控制器（MVC）是一种设计模式，由三类对象组成
设计模式在Qt中的应用
2301_82023822的博客
02-17 1851
通过结合 Qt 的框架特性（如信号槽、Model/View、QObject 树等），开发者可以更高效地应用设计模式，提升代码的可维护性和扩展性。：对象间定义一对多的依赖关系，当一个对象状态改变时，所有依赖它的对象自动得到通知。：将请求的发送者和接收者解耦，使多个对象都有机会处理请求。：事件在对象树中传递，直到被处理（如鼠标点击事件）。：通过工厂类创建对象，隐藏具体类的实例化逻辑。：将请求封装为对象，支持撤销、重做和日志功能。：将一个类的接口转换为客户端期望的另一个接口。：管理全局应用程序状态，保证单实例。
QT界面设计模式与应用
QT性能优化QT原理源码QT界面美化
11-16 1630
设计模式简介设计模式简介在软件开发中，设计模式是解决特定问题的可重用解决方案。设计模式可以帮助我们提高代码的可维护性、可读性和复用性。设计模式通常分为三类,创建型、结构型和行为型。创建型模式创建型模式主要关注对象的创建过程，旨在创建对象的时候提供灵活性和可扩展性。主要有以下五种创建型模式,单例模式（Singleton）,确保一个类只有一个实例，并提供一个全局访问点。工厂方法模式（Factory Method）,定义一个接口用于创建对象，但让子类决定实例化哪一个类。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值