1. 程式人生 > >QML中ListView的幾種資料模型

QML中ListView的幾種資料模型

在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++作為資料模型
程式效果圖這裡寫圖片描述