Is it possible to use QAbstractTableModel with TableView from QtQuick.Controls?

Question

I’m trying to implement following thing:

There is 2d table with values. I need to implement UI for viewing data and editing it. To simplify synchronisation between e

Answer 1

This is an example maybe it'll help you hopefully

Suppose we have sqlite database containing a table "mytable" with three columns "nom" (text),"prenom"(text) and "image"(url as text)

--------------------------- PRESENCEMODEL.h

#include <QSqlTableModel>
typedef  QHash<int,QByteArray> qMyHash  ;

class PresenceModel : public QSqlTableModel {

    Q_OBJECT
    Q_PROPERTY(QStringList dictionary READ dictionary NOTIFY dictionaryChanged)
    Q_PROPERTY(QString filterString READ filterString WRITE setFilterString NOTIFY filterStringChanged)
    Q_PROPERTY(qMyHash roles READ roles NOTIFY rolesChanged)

public:

    PresenceModel(QSqlDatabase, QObject* parent = 0);
    void generateRoleNames();

    QString filterString() const { return p_filterString; }
    void setFilterString(const QString&);

    Q_INVOKABLE QStringList getData(int currentRow);

    QVariant data(const QModelIndex&, int role) const;

    Q_INVOKABLE void insert(const QString& url, const QString& title);
    void populate();

    QHash<int, QByteArray> roleNames() const;
    Q_INVOKABLE void p_setTable(const QString &tableName);
    QStringList dictionary() const;
    void setDictionary(const QStringList &value);
    QHash<int, QByteArray> roles() const;



Q_SIGNALS:

    void dataChanged();
    void gotData();

    void rolesChanged();

private:


    enum ColumnRH {
        nom= Qt::UserRole + 1,
        prenom= Qt::UserRole + 2,
        image= Qt::UserRole + 3
    };

    QHash<int, QByteArray> p_roles;
    QString p_filterString;
    QStringList p_dictionary;
};

--------------------------- PRESENCEMODEL.cpp

#include "presencemodel.h"
#include <QtCore/QDateTime>
#include <QtSql/QSqlError>
#include <QtSql/QSqlQuery>
#include <QtSql/QSqlRecord>
#include <QDebug>

PresenceModel::PresenceModel(QSqlDatabase database, QObject *parent)
    : QSqlTableModel(parent,  database)
{
}

void PresenceModel::generateRoleNames()
{

    p_roles[nom] = "nom";
    p_roles[prenom] = "prenom";
    p_roles[image] = "image";
}



void PresenceModel::populate()
{

    select();

}

void PresenceModel::insert(const QString& url, const QString& title)
{

}



QVariant PresenceModel::data(const QModelIndex& index, int role) const
{
    if (role < Qt::UserRole)
        return QSqlQueryModel::data(index, role);

    const int columnId = role - Qt::UserRole;
    const QModelIndex modelIndex = createIndex(index.row(), columnId-1);
    return QSqlTableModel::data(modelIndex, Qt::DisplayRole);

}



QStringList PresenceModel::getData(int currentRow)
{
    QStringList rowDataList;

    for (int i=0;i<columnCount();i++)

        rowDataList.append(data(this->index(currentRow,i),Qt::DisplayRole).toString());

    emit gotData();

    return rowDataList;
}


QHash<int, QByteArray> PresenceModel::roleNames() const
{
    return p_roles;
}


QHash<int, QByteArray> PresenceModel::roles() const
{
    return roleNames();
}

--------------------------- main.cpp

 int main(int argc, char *argv[])
 {
 QGuiApplication app(argc, argv);

 QQmlApplicationEngine engine;

 QSqlDatabase m_database = QSqlDatabase::addDatabase("QSQLITE");

 m_database.setDatabaseName("/.../mydatabase.sqlite");


 PresenceModel  *p_pModel= new PresenceModel(m_database);

 p_pModel->setTable("mytable");

 m_database.open(); 

 QQmlContext *ctxt = engine.rootContext();

 ctxt->setContextProperty("ppModel", (PresenceModel*) p_pModel);

 engine.load(QUrl("qrc:/main.qml"));

 return app.exec();

  }

QML

--------------------------- main.qml

Rectangle {

    Component.OnCompleted : ppModel.populate()
    TableView{
        id:tableview_actes
        TableViewColumn{ role: "nom"  ; title: "nom" ; width: 330 }
        TableViewColumn{ role: "prenom" ; title: "prénom" ; width: 65}
        TableViewColumn{ role: "image" ; title: "Photo" ; width:65}

        model:ppModel
        onCurrentRowChanged:  {
            var list=   myModel.getData(currentRow)   // invoke c++ function                                    

            console.log(list[0])



        }
        Listview{
            model:ppModel
            delegate:
                Item {
                Text{

                    text: nom + " " +prenom // our roles 
                }

                Image{
                    source : image // image : url in our table 
                }
            }


        }

    }
}