【qt】初识模型和视图

发布于：2024-05-24 ⋅ 阅读:(35) ⋅ 点赞:(0)

模型和视图

一.模型和视图的概念

1.关系

模型管理着数据，数据支撑着模型，视图展示着模型。

在这里插入图片描述

2.模型

模型是一个类，已经为对应数据写好操作的类，不同的数据对应着不同的模型，模型以行来管理着数据。

在这里插入图片描述

3.数据

数据可以分为：数据库数据，内存数据，磁盘数据。

4.视图

View相当于模型的界面，用来展示模型。
Widget相当于模型与视图结合在一起了。

5.特点

通过模型与视图的框架，使数据分类，大大的提高了灵活性，响应性，可以更好的处理复杂的数据。

二.文件系统模型

目标效果：
在这里插入图片描述

1.那种数据？

文件系统模型管理着磁盘数据

2.界面拖放

在这里插入图片描述
界面的拖放，我就不讲了，不会的可以问我。

3.创建模型

在mainwindow.h中

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QFileSystemModel>//文件系统模型头文件

QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private:
    Ui::MainWindow *ui;
    QFileSystemModel*model;//定义文件系统模型数据成员
};
#endif // MAINWINDOW_H

在mainwindow.cpp中

#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    model=new QFileSystemModel;//创建模型
}

MainWindow::~MainWindow()
{
    delete ui;
}

4.模型设置数据

model->setRootPath(QDir::currentPath());

在这里插入图片描述
通过F1在线文档查看，就是相当于是文件目录中设置一个监视器，目录文件数据的一举一动都能被检测到。

5.视图设置模型

一个模型可以对应多个视图

    ui->treeView->setModel(model);
    ui->listView->setModel(model);
    ui->tableView->setModel(model);

设置好视图，我们就可以看到界面了
在这里插入图片描述

6.模型索引

在这里插入图片描述
这个信号的参数就是一个模型索引，在视图中，我们可以通过模型索引来对模型进行操作。
比如说我们希望ListView和TableView跟随TreeView的变化而变化。

void MainWindow::on_treeView_clicked(const QModelIndex &index)
{
    ui->listView->setRootIndex(index);
    ui->tableView->setRootIndex(index);
}

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

7.模型操作数据

①文件名

ui->labelFileName->setText(model->fileName(index));

②文件大小

内存单位换算：
1 byte（字节）= 8 bits（位）
1 kilobyte（KB）= 1024 bytes（字节）
1 megabyte（MB）= 1024 kilobytes（KB）
1 gigabyte（GB）= 1024 megabytes（MB）
1 terabyte（TB）= 1024 gigabytes（GB）

int size=model->size(index)/1024;//原本得到是字节，除以1024后得到是kb
    if(size>1024)//如果kb还大于1024，那就再除1024转换成mb
    {
        ui->labelFileSize->setText(QString::asprintf("%.1f MB",size/1024.0));
    }
    else
    {
        ui->labelFileSize->setText(QString::asprintf("%d MB",size));
    }

③文件类型

ui->labelType->setText(model->type(index));

④是否是目录

ui->checkBox->setChecked(model->isDir(index));

⑤文件路径

ui->labelPath->setText(model->filePath(index));

完整代码：

void MainWindow::on_treeView_clicked(const QModelIndex &index)
{
    ui->listView->setRootIndex(index);
    ui->tableView->setRootIndex(index);
    
    ui->labelFileName->setText(model->fileName(index));
    int size=model->size(index)/1024;//原本得到是字节，除以1024后得到是kb
    if(size>1024)//如果kb还大于1024，那就再除1024转换成mb
    {
        ui->labelFileSize->setText(QString::asprintf("%.1f MB",size/1024.0));
    }
    else
    {
        ui->labelFileSize->setText(QString::asprintf("%d MB",size));
    }
    ui->labelType->setText(model->type(index));
    
    ui->checkBox->setChecked(model->isDir(index));
    
    ui->labelPath->setText(model->filePath(index));
}

运行结果：
在这里插入图片描述
perfect，哈哈，你们找不到我的小电影吧，你们玩的时候，可别把你的小电影展示出来了。

三.字符串链表模型

目标效果：
在这里插入图片描述

1.那种数据？

字符串链表模型管理着内存数据QStringList

2.界面拖放

在这里插入图片描述

3.创建模型

在mainwindow.h中

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QStringListModel>//字符串链表模型

QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

private:
    Ui::MainWindow *ui;
    QStringListModel*model;
};
#endif // MAINWINDOW_H

在mainwindow.cpp中

model=new QStringListModel;//创建模型

4.模型设置数据

QStringList list={"上海","北京","南京","成都","达州","江苏","广东"}; 
model->setStringList(list);

5.视图设置模型

 ui->listView->setModel(model);
 ui->tableView->setModel(model);

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

6.模型插入数据

①尾部添加数据

模型是以行来管理数据，所以不管我们要实现什么功能，我们都要找到行，通过视图我们可以拿到模型索引。
模型索引其实就是类似于二维数值，我们通过其拿到行和列。

void MainWindow::on_pushButtonAdd_clicked()
{
    model->insertRow(model->rowCount());//尾插法
    //但是现在添加的是一个空行
    QModelIndex index=model->index(model->rowCount()-1,0);//通过行列拿到模型索引
    model->setData(index,"新的城市");//设置模型数据
    ui->ListView->setCurrentIndex(index);//选择当前索引
}

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

③选中位置插入

void MainWindow::on_pushButtonInsert_clicked()
{
    QModelIndex index=ui->listView->currentIndex();//通过视图获取当前索引位置
    //模型以行管理数据，所以插入的是行，所以通过模型索引拿到行
    model->insertRow(index.row());//通过模型索引拿到行
    model->setData(index,"新的城市");//设置数据
    ui->listView->setCurrentIndex(index);//选中当前行

}

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

7.模型删除数据

①选中位置删除

void MainWindow::on_pushButtonDel_clicked()
{
    QModelIndex index=ui->listView->currentIndex();//获取当前索引
    model->removeRow(index.row());//通过模型索引获取行，然后移除模型数据
}

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

②清空

void MainWindow::on_pushButtonClearList_clicked()
{
    model->removeRows(0,model->rowCount());//通过移除多行来清空列表
}

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

③初始化模式数据

清空后可以初始化

void MainWindow::on_pushButtonInit_clicked()
{
    QStringList list={"上海","北京","南京","成都","达州","江苏","广东"};
    model->setStringList(list);    
}

8.模型拿到数据

void MainWindow::on_pushButtonDisplay_clicked()
{
    ui->plainTextEdit->clear();//每次获取前，先把上次的清空。
    QStringList list=model->stringList();//拿到字符串链表数据
    for(int i=0;i<list.count();i++)
    {
        ui->plainTextEdit->appendPlainText(list[i]);
    }
}

运行结果：
在这里插入图片描述
OK，就大功告成了。文本清空按钮，那么简单，自己做。

四.总结

模型有很多种，我这里只先简单了讲了文件系统模型和字符串链表模型.通过学习，我们要重点的掌握数据,模型,视图之间的关系。

慌了，你就慢下来，还慌，你就停下来！

网站公告

今日签到

点亮在社区的每一天
去签到

热门文章

最新发布