QT中的View Model模型系列一

本讲主要介绍一下QT中ViewModel的基本结构，以及简单的使用方法。对于View Model的概念这里就不累述了，简单的了解可以参考：

http://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller

下面进入正文：

Qt中的View主要有三种QListView，QTreeView, QTabelView

而对应的Model是：QStringListModel, QAbstractItemModel , QStandardItemModel。

 

基本的原理就是构造出View，和Model然后通过View的setModel方法，将两者结合起来。

下面介绍每种View-Model的使用：

 QListView与QStringListModel

代码Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/-->#include <QApplication>
#include <QStringList>
#include <QAbstractItemModel>
#include <QStringListModel>
#include <QListView>
 
int main(int argc, char *argv[]) {
QApplication app(argc, argv);
 
QStringList numbers;
numbers << "caterpillar" << "momor" << "bush" << "bee";
QAbstractItemModel *model = new QStringListModel(numbers);
 
QListView *view = new QListView;
view->setWindowTitle("QListView & Model");
view->setModel(model);
 
view->show();
 
return app.exec();
}

QTableView 与 QStandardItemModel

代码Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/-->#include <QApplication>
#include <QStandardItemModel>
#include <QStandardItem>
#include <QTableView>
 
int main(int argc, char *argv[]) {
QApplication app(argc, argv);
 
QStandardItemModel *model = new QStandardItemModel;
model->setItem(0, 0, new QStandardItem("January"));
model->setItem(1, 0, new QStandardItem("February"));
model->setItem(0, 1, new QStandardItem("10,000"));
model->setItem(1, 1, new QStandardItem("20,000"));
 
QTableView *view1 = new QTableView;
view1->setModel(model);
 
QTableView *view2 = new QTableView;
view2->setModel(model);
 
view1->show();
view2->show();
 
return app.exec();
}

对于QTreeView一般来说需要重载QAbstractItemModel来实现自己的Model，将在下一讲中介绍。

 

对于简单的应用，Qt还提供了QListWidget, QTreeWidget, QTabelWidget 三个widget，分别继承自上面的3个View。它们将View，Model整合了，可以方便的使用。

示例程序： 

 QListWidget

代码Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/-->#include <QApplication>
#include <QHBoxLayout>
#include <QLabel>
#include <QListWidget>
 
int main(int argc, char *argv[]) {
QApplication app(argc, argv);
 
QWidget *window = new QWidget;
window->setWindowTitle("QListWidget & Item");
 
QLabel *label = new QLabel;
label->setFixedWidth (100);
 
QListWidget *listWidget = new QListWidget;
listWidget->insertItem(0, new QListWidgetItem(
QIcon("caterpillar_head.jpg"), "caterpillar"));
listWidget->insertItem(1, new QListWidgetItem(
QIcon("momor_head.jpg"), "momor"));
listWidget->insertItem(2, new QListWidgetItem(
QIcon("bush_head.jpg"), "bush"));
listWidget->insertItem(3, new QListWidgetItem(
QIcon("bee_head.jpg"), "bee"));
listWidget->insertItem(4, new QListWidgetItem(
QIcon("cat_head.jpg"), "cat"));
 
QObject::connect(listWidget, SIGNAL(currentTextChanged (const QString &)),
label, SLOT(setText(const QString &)));
 
QHBoxLayout *layout = new QHBoxLayout;
layout->addWidget(label);
layout->addWidget(listWidget);
 
window->setLayout(layout); 
window->show();
 
return app.exec();
}

QTreeWidget

代码Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/-->#include <QApplication>
#include <QTreeWidget>
#include <QTreeWidgetItem>
#include <QStringList>
#include <QFile>
#include <QFileInfo>
#include <QDir>
 
void listFile(QTreeWidgetItem *, QFileInfo &);
 
int main(int argc, char *argv[]) {
QApplication app(argc, argv);
 
QTreeWidget *treeWidget = new QTreeWidget;
treeWidget->setWindowTitle("QTreeWidget & Item");
treeWidget->resize(400, 250);
 
// 設定欄位名稱 
QStringList columnTitle;
columnTitle.append("Name");
columnTitle.append("Size");
treeWidget->setHeaderLabels(columnTitle);
 
// 查詢的目錄    
QFileInfo fileInfo("D:\\Temp");
QStringList fileColumn;
fileColumn.append(fileInfo.fileName());
 
QTreeWidgetItem *dir = new QTreeWidgetItem(fileColumn);
dir->setIcon(0, QIcon("caterpillar_head.jpg"));
dir->setCheckState(0, Qt::Checked); // 設定可核取的方塊 
treeWidget->addTopLevelItem(dir);
 
// 查詢目錄 
listFile(dir, fileInfo);
 
treeWidget->show();
 
return app.exec();
}
 
void listFile(QTreeWidgetItem *parentWidgetItem, QFileInfo &parent) {
QDir dir;
dir.setPath(parent.filePath());
dir.setFilter(QDir::Files | QDir::Dirs | QDir::NoSymLinks);
dir.setSorting(QDir::DirsFirst | QDir::Name);    
 
const QFileInfoList fileList = dir.entryInfoList();
 
for (int i = 0; i < fileList.size(); i++) {
QFileInfo fileInfo = fileList.at(i);
QStringList fileColumn;
fileColumn.append(fileInfo.fileName());
if (fileInfo.fileName() == "." || fileInfo.fileName() == ".." ); // nothing
else if(fileInfo.isDir()) {
QTreeWidgetItem *child = new QTreeWidgetItem(fileColumn);
child->setIcon(0, QIcon("caterpillar_head.jpg"));
child->setCheckState(0, Qt::Checked);
parentWidgetItem->addChild(child);
// 查詢子目錄
listFile(child, fileInfo);
}
else {
fileColumn.append(QString::number(fileInfo.size()));
QTreeWidgetItem *child = new QTreeWidgetItem(fileColumn);
child->setIcon(0, QIcon("momor_head.jpg"));
child->setCheckState(0, Qt::Checked);            
parentWidgetItem->addChild(child);
}
}    
}

QTableWidget 

代码Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/-->#include <QApplication>
#include <QTableWidget>
#include <QHBoxLayout>
 
int main(int argc, char *argv[]) {
QApplication app(argc, argv);
 
QTableWidget *tableWidget = new QTableWidget;
tableWidget->setWindowTitle("QTableWidget & Item");
tableWidget->resize(350, 200);
tableWidget->setRowCount(10);
tableWidget->setColumnCount(5);
 
QStringList header;
header.append("Month");
header.append("Description");
tableWidget->setHorizontalHeaderLabels(header);
 
tableWidget->setItem(0, 0, new QTableWidgetItem("January"));
tableWidget->setItem(1, 0, new QTableWidgetItem("February"));
tableWidget->setItem(2, 0, new QTableWidgetItem("March"));
 
tableWidget->setItem(0, 1, 
new QTableWidgetItem(QIcon("caterpillar_head.jpg"), "caterpillar's month"));
tableWidget->setItem(1, 1, 
new QTableWidgetItem(QIcon("momor_head.jpg"), "momor's month"));      
tableWidget->setItem(2, 1, 
new QTableWidgetItem(QIcon("bush_head.jpg"), "bush's month"));        
 
tableWidget->show();
 
return app.exec();
}