按照顺序,今天讲View的组件。

QListView

根据它的名字列表视图我们可以大概猜测出它是做什么的,大约就是展示一些列表数据的,当我们不知道一个类是做什么的时候,我们可以从Qt手册中查看它的详细说明。

从给出的图例中也看得出从名字推测其用途是大差不差的,既然是展示一些列表数据,那么我们需要了解的就是如何添加列表数据。
它的函数里貌似没有,那么我们往上面找,从它的父类里找。

这是一个虚函数,需要给它传入的类型是QAbstractItemModel,从名字我们可以看出这也是一个"父类",一般Abstract开头的都是拿来当常用组件的父类用的。
因此我们再从这个类的子类中找。

发现继承它的大部分还都是"父类",我们挑一个嫌疑最大的QAbstractListModel继续追查,因为它的名字里同样含有List,因此嫌疑最大。

这时,我们的目标就剩一个了,看来我们要用的就是它了。

从VS中的代码提示得知,构造它还需要一个QStringList类型的参数,这里有两种办法,我们一个个来说。
第一种就是,既然它需要,那么我们就构造一个给它。
cpp
#include "Zhetu.h"
#include <qdebug.h>
#include <QListView>
#include <QStringListModel>
Zhetu::Zhetu(QWidget *parent): QMainWindow(parent){
this->setFixedSize(650, 400);
QListView* lv = new QListView(this);
QStringList sl=QStringList();
sl.append("one");
sl.append("two");
sl.append("three");
sl.append("four");
sl.append("five");
QStringListModel* sm = new QStringListModel(sl,this);
lv->setModel(sm);
lv->setFixedSize(200, 100);
}
Zhetu::~Zhetu()
{}

这样看来我们就成功地让QListView呈现出了列表数据了,并且我们还看到它还提供了一个滚轮可以上下拉。
第二种方法适用于展示的内容是固定的。既然它要这么一个类型的参数,那么我们当场给它构造一个,在构造的同时再把内容塞进去。
cpp
#include "Zhetu.h"
#include <qdebug.h>
#include <QListView>
#include <QStringListModel>
Zhetu::Zhetu(QWidget *parent): QMainWindow(parent){
this->setFixedSize(650, 400);
QListView* lv = new QListView(this);
QStringListModel* sm = new QStringListModel(QStringList()<<"111"<<"222"<<"333"<<"444"<<"555", this);
lv->setModel(sm);
lv->setFixedSize(200, 100);
}
Zhetu::~Zhetu()
{}

那么截止目前为止,我们实际上还没有介绍到QListView,因为上面添加列表内容的相关函数是它的父类的,因此我们讲一个它特有的函数。
cpp
void setViewMode(QListView::ViewMode mode)

需要传入的参数是枚举类型,一共只有两种,第一种是默认的,因此我们试一下第二种。


设置完之后它就变成了上面的这样,变成了这种浮动效果(会前端的小伙伴应该可以理解什么意思)。
QTreeView

根据它的名字可以猜测出是树形结构的视图,我们再到它的详细介绍中看看。

从它的示例图中看到主要是用来展示文件系统的,文件的层级结构也确实是属于树形结构,涉及到了文件,本来我是想着讲完这些常用组件之后再讲讲文件,多线程,网络之类的,结果这边就涉及了,那么我们就直接用示例代码,到时候会了QT的文件之后再回过头研究吧。
不过其实不懂也没关系,就像上面的QListView一样,用的都是父类的setViewModel的这个函数,只不过传入的参数是跟文件相关的而已,上面涉及的QStringList我们之前不也是没用过嘛,翻翻Qt助手不就明白了嘛。
cpp
#include "Zhetu.h"
#include <qdebug.h>
#include <QTreeView>
#include <QFileSystemModel>
Zhetu::Zhetu(QWidget *parent): QMainWindow(parent){
this->setFixedSize(650, 400);
QFileSystemModel* model = new QFileSystemModel;
model->setRootPath(QDir::currentPath());
QTreeView* tree = new QTreeView(this);
tree->setModel(model);
tree->setFixedSize(300,300);
}
Zhetu::~Zhetu()
{}

从上面来看,一般我们使用QTreeView这个组件就是需要选择文件了,那么我们就需要用到信号和槽函数了,可以从它的父类中找到相关的信号。

我下面就举个例子,连接单击的信号,然后连接的槽函数打印出点中的文件名字了。
cpp
#include "Zhetu.h"
#include <qdebug.h>
#include <QTreeView>
#include <QFileSystemModel>
Zhetu::Zhetu(QWidget *parent): QMainWindow(parent){
this->setFixedSize(650, 400);
QFileSystemModel* model = new QFileSystemModel;
model->setRootPath(QDir::currentPath());
QTreeView* tree = new QTreeView(this);
tree->setModel(model);
tree->setFixedSize(300,300);
connect(tree, &QTreeView::clicked, [](const QModelIndex& index) {
qDebug() << index.data().toString();
});
}
Zhetu::~Zhetu()
{}

QTableView

从名字我们可以看得出,这是个表格视图组件。那表格不就是行和列嘛,因此我们主要用到的函数就是设置行和列的。

相关的函数也比较简单,大家对照着QT助手就可以玩明白,我们还是来看看QTableView这个组件的setModel吧。
有了之前的经验我们就比较知道应该从谁下手了。

因为它们的名字都有Table嘛。
它这个比较不一样的是它没有子类。

而且这个类还是个抽象类,我们没法直接用,只能自己构造一个类去继承它(麻烦),因此我们再换个方向追查。
最终我们使用下面这个类。

选中它的原因是它的类方法中也都是操作行和列的。

接下来我就简单示范一下。
cpp
#include "Zhetu.h"
#include <qdebug.h>
#include <QTableView>
#include <QStandardItemModel>
Zhetu::Zhetu(QWidget *parent): QMainWindow(parent){
this->setFixedSize(650, 400);
QTableView* tv = new QTableView(this);
QStandardItemModel* im = new QStandardItemModel(this);
im->setHorizontalHeaderLabels(QStringList() << "one" << "two" << "three");
im->setItem(0, 0,new QStandardItem("111"));
im->setItem(0, 1,new QStandardItem("222"));
im->setItem(0, 2,new QStandardItem("333"));
tv->setModel(im);
tv->setFixedSize(300,300);
tv->setColumnWidth(0,100);
tv->setColumnWidth(1,100);
tv->setColumnWidth(2,100);
}
Zhetu::~Zhetu()
{}

QColumnView

这是一个列视图。

从它的详细说明中我们发现它可以塞下多个QListView,也就是展示别的展示容器的容器。
它的函数就相对较少,并且也比较好懂,我们需要搞清楚的就是setModel这个函数了。

给setModel传入的参数类型是QAbstractItemModel*,我们怎么通过这个类型的变量传入多个QListView呢。
我们没法直接传入QListView,但是我们可以通过传入表格来实现类似的效果。
cpp
#include "Zhetu.h"
#include <qdebug.h>
#include <QColumnView>
#include <QStandardItemModel>
Zhetu::Zhetu(QWidget *parent): QMainWindow(parent){
this->setFixedSize(650, 400);
QColumnView* cv = new QColumnView(this);
QStandardItemModel* im = new QStandardItemModel(this);
QStandardItem* one = new QStandardItem("one");
one->appendRow(new QStandardItem("two"));
one->appendRow(new QStandardItem("three"));
im->appendRow(one);
cv->setModel(im);
cv->setFixedSize(500, 300);
}
Zhetu::~Zhetu()
{}

QUndoView

看的出来它继承于QListView,它的详细说明里也说了。

它实际上是用来展示一个栈的信息的。
从它的构造函数可以看出它需要配合使用的。

还是比较麻烦的,一般情况下也用不着,这里就不介绍了,感兴趣的小伙伴可以自行去查资料。