QML中ListView的幾種資料模型
阿新 • • 發佈:2019-01-27
在QML中,經常會用到ListView控制元件,我們主要用到MVC模式,下面介紹幾種常用資料模型,其中包括QML和C++模型
ListModel:
ListModel是一個簡單的ListElement容器,每個容器都包含資料角色。其中內容可以動態定義,也可以在QML中顯式定義。
ListModel {
id:m_model
ListElement {
name: "Bill Smith"
number: "555 3264"
color1:"red"
}
ListElement {
name: "John Brown"
number: "555 8426"
color1:"green"
}
ListElement {
name: "Sam Wise"
number: "555 0473"
color1:"blue"
}
}
ListView
{
width : 100
height: 100
model:m_model
delegate: Text{
color: color1
text:name+":"+number}
}
ObjectModel
當ObjectModel被用於檢視的時候,檢視不再需要委託,因為物件模型已經包含了視覺化的委託(項)
ObjectModel {
id: itemModel
Rectangle { height: 20; width: 80;
Text{
color : "red"
text:"Bill Smith"+":"+"555 3264"
}
}
Rectangle { height: 20; width: 80;
Text{
color: "green"
text: "John Brown"+":"+"555 8426"
}
}
Rectangle { height: 20; width: 80;
Text{
color: "blue"
text:"Sam Wise"+":"+"555 0473"
}
}
}
ListView{
width: 100
height: 100
model:itemModel
}
C++中的QStringList作為資料模型
QStringList a;
a<<"Bill Smith"<<"John Brown"<<"Sam Wise"; //QStringList model
然後在註冊為上下文屬性
QQmlApplicationEngine engine;
engine.rootContext()->setContextProperty("name1",QVariant::fromValue(a));
ListView{
width: 100
height: 100
model:name1
delegate: Text{
text:modelData}
}
C++中QList
dataobject.h標頭檔案
class DataObject : public QObject
{
Q_OBJECT
Q_PROPERTY(QString name READ name WRITE setName NOTIFY nameChanged)
Q_PROPERTY(QString color READ color WRITE setColor NOTIFY colorChanged)
Q_PROPERTY(QString number READ number WRITE setNumber NOTIFY numberChanged)
public:
DataObject(QObject *parent = nullptr);
DataObject(const QString &name,const QString &color,const QString &number,QObject *parent=nullptr);
QString name()const;
void setName(const QString &name);
QString color()const;
void setColor(const QString &color);
QString number()const;
void setNumber(const QString &number);
signals:
void nameChanged();
void colorChanged();
void numberChanged();
private:
QString m_name;
QString m_color;
QString m_number;
};
dataobject.cpp原始檔
#include "dataobject.h"
DataObject::DataObject(QObject *parent) : QObject(parent)
{
}
DataObject::DataObject(const QString &name, const QString &color, const QString &number, QObject *parent)
:QObject(parent),m_name(name),m_color(color),m_number(number)
{
}
QString DataObject::name() const
{
return m_name;
}
void DataObject::setName(const QString &name)
{
if(name!=m_name)
m_name=name;
emit nameChanged();
}
QString DataObject::color() const
{
return m_color;
}
void DataObject::setColor(const QString &color)
{
if(color!=m_color)
m_color=color;
emit colorChanged();
}
QString DataObject::number() const
{
return m_number;
}
void DataObject::setNumber(const QString &number)
{
if(number!=m_number)
m_number=number;
emit numberChanged();
}
在main.cpp中註冊類:
QList<QObject*>dataList; //QObject model
dataList << new DataObject("Bill Smith","red","555 3264")<<new DataObject("John Brown","green","555 8426")
<<new DataObject("Sam Wise","blue","555 0473");
engine.rootContext()->setContextProperty("myObjectModel",QVariant::fromValue(dataList));
在QML進行呼叫
ListView{
width: 100
height: 100
model:myObjectModel
delegate: Text{
color: model.modelData.color
text:name+":"+number}
}
C++中繼承於QAbstractListModel作為資料模型
自定義類AbstractListModel
abstractlistmodel.h
class AbstractList //抽象資料列表類
{
public:
AbstractList(const QString &name,const QString &color,const QString &number);
QString name() const;
QString color() const;
QString number() const;
private:
QString m_name;
QString m_color;
QString m_number;
};
class AbstractListModel : public QAbstractListModel
{
Q_OBJECT
public:
enum AbstractListRoles{
NameRole=Qt::UserRole+1,
ColorRole,
NumberRole
}; //定義抽象類成員角色
AbstractListModel(QObject *parent=nullptr);
void addList(const AbstractList &list);
int rowCount(const QModelIndex &parent=QModelIndex()) const; //返回給定父項行數
QVariant data(const QModelIndex &index, int role=Qt::DisplayRole) const;//返回索引所在項給定角色的儲存資料
protected:
QHash<int,QByteArray> roleNames() const; //返回模型的角色名
private:
QList<AbstractList> m_abstractList; //抽象列表類容器
};
abstractlistmodel.cpp
AbstractListModel::AbstractListModel(QObject *parent)
:QAbstractListModel(parent)
{
}
void AbstractListModel::addList(const AbstractList &list)
{
beginInsertRows(QModelIndex(),rowCount(),rowCount());
m_abstractList.append(list);
// m_abstractList<<list;
endInsertRows();
}
int AbstractListModel::rowCount(const QModelIndex &parent) const
{
Q_UNUSED(parent);
return m_abstractList.count();
}
QVariant AbstractListModel::data(const QModelIndex &index, int role) const
{
if(index.row()<0||index.row()>=m_abstractList.count())
return QVariant();
const AbstractList &abstractList=m_abstractList[index.row()];
if(role==AbstractListRoles::NameRole)
return abstractList.name();
else if(role==AbstractListRoles::ColorRole)
return abstractList.color();
else if(role==AbstractListRoles::NumberRole)
return abstractList.number();
return QVariant();
}
QHash<int, QByteArray> AbstractListModel::roleNames() const
{
QHash<int,QByteArray> roles;
//use operator[]
// roles[AbstractListRoles::NameRole]="name"; //定義對應角色值
// roles[AbstractListRoles::ColorRole]="color1";
// roles[AbstractListRoles::NumberRole]="number";
//use insert
roles.insert(AbstractListRoles::NameRole,"name");
roles.insert(AbstractListRoles::ColorRole,"color1");
roles.insert(AbstractListRoles::NumberRole,"number");
return roles;
}
AbstractList::AbstractList(const QString &name, const QString &color, const QString &number)
:m_name(name),m_color(color),m_number(number)
{
}
QString AbstractList::name() const
{
return m_name;
}
QString AbstractList::color() const
{
return m_color;
}
QString AbstractList::number() const
{
return m_number;
}
main.cpp
AbstractListModel listmodel;
listmodel.addList(AbstractList("Bill Smith","red","555 3264"));
listmodel.addList(AbstractList("John Brown","green","555 8426"));
listmodel.addList(AbstractList("Sam Wise","blue","555 0473"));
QQmlApplicationEngine engine;
engine.rootContext()->setContextProperty("myModel",&listmodel);
qml中呼叫:
ListView{
width: 100
height: 100
model:myModel
delegate: Text{
color: color1
text:name+":"+number}
}
以上5中方法中前兩種主要是qml中的資料模型,後三種主要是C++作為資料模型
程式效果圖