Display several roles in one column of TableView - qt

Question

I have a SQLite 3 database with 4 columns and QML code with TableView that displays it:
TableView {
id: table
...
TableViewColumn {
role: "name"
width: 275
}
TableViewColumn {
role: "surname"
width: 300
}
TableViewColumn {
role: "phone"
width: 575
}
TableViewColumn {
role: "ip_address"
width: 525
}
model: abonents
}
It works fine, but I need to display the first two roles, name and surname, as a unique column in TableView.
Here is the code for my model and the main.
abonentstable.h:
#ifndef ABONENTSTABLE
#define ABONENTSTABLE
#include <QObject>
#include <QSqlQueryModel>
class AbonentsSqlModel : public QSqlQueryModel
{
Q_OBJECT
public:
explicit AbonentsSqlModel(QObject *parent = 0);
void setQuery(const QString &query, const QSqlDatabase &db = QSqlDatabase());
void setQuery(const QSqlQuery &query);
QVariant data(const QModelIndex &index, int role) const;
QHash<int, QByteArray> roleNames() const { return m_roleNames; }
signals:
public slots:
private:
void generateRoleNames();
QHash<int, QByteArray> m_roleNames;
};
#endif // ABONENTSTABLE
dbconnection.cpp:
#include "abonentstable.h"
#include <QSqlRecord>
#include <QSqlField>
AbonentsSqlModel::AbonentsSqlModel(QObject *parent) :
QSqlQueryModel(parent)
{
QSqlDatabase db = QSqlDatabase::addDatabase("QSQLITE");
db.setDatabaseName("data_base.sqlite");
db.open();
}
void AbonentsSqlModel::setQuery(const QString &query, const QSqlDatabase &db)
{
QSqlQueryModel::setQuery(query, db);
generateRoleNames();
}
void AbonentsSqlModel::setQuery(const QSqlQuery & query)
{
QSqlQueryModel::setQuery(query);
generateRoleNames();
}
void AbonentsSqlModel::generateRoleNames()
{
m_roleNames.clear();
for( int i = 0; i < record().count(); i ++) {
m_roleNames.insert(Qt::UserRole + i + 1, record().fieldName(i).toUtf8());
}
}
QVariant AbonentsSqlModel::data(const QModelIndex &index, int role) const
{
QVariant value;
if(role < Qt::UserRole) {
value = QSqlQueryModel::data(index, role);
}
else {
int columnIdx = role - Qt::UserRole - 1;
QModelIndex modelIndex = this->index(index.row(), columnIdx);
value = QSqlQueryModel::data(modelIndex, Qt::DisplayRole);
}
return value;
}
main.cpp:
#include <QGuiApplication>
#include <QQmlApplicationEngine>
#include <QQmlContext>
#include <QVariant>
#include <QSql>
#include <QSqlQueryModel>
#include <QObject>
#include "abonentstable.h"
int main(int argc, char *argv[])
{
QGuiApplication app(argc, argv);
QQmlApplicationEngine engine;
AbonentsSqlModel *abonentsSqlModel = new AbonentsSqlModel(0);
abonentsSqlModel->setQuery("SELECT * FROM abonents");
QQmlContext *context = engine.rootContext();
context->setContextProperty("abonents", abonentsSqlModel);
engine.load(QUrl(QStringLiteral("qrc:/main.qml")));
return app.exec();
}

Answer 1

I think you could join both values using the delegate component.
In your case:
TableView {
id: table
...
TableViewColumn {
width: 575
delegate: Text { text: model.name + " " + model.surname }
}
TableViewColumn {
role: "phone"
width: 575
}
TableViewColumn {
role: "ip_address"
width: 525
}
model: abonents
}
Here you have another example, just for testing if you want to work with it. The example is based on this Qt example.
main.cpp
#include <QGuiApplication>
#include <QQmlApplicationEngine>
int main(int argc, char *argv[])
{
QGuiApplication app(argc, argv);
QQmlApplicationEngine engine;
engine.load(QUrl(QStringLiteral("qrc:/main.qml")));
return app.exec();
}
main.qml
import QtQuick 2.2
import QtQuick.Window 2.2
import QtQuick.Controls 1.4
ApplicationWindow {
id: window
visible: true
title: "Table View Example"
TableView {
TableViewColumn {
role: "title"
title: "Title"
width: 100
}
TableViewColumn {
role: "author"
title: "Author"
width: 100
}
TableViewColumn{
width: 300
delegate: Text { text: model.title + " " + model.author }
}
TableViewColumn{
width: 300
delegate: Text {
text: model.title + " " + model.author
font.family: "Courier New"
font.pixelSize: 18
color: "red"
}
}
model: libraryModel
ListModel {
id: libraryModel
ListElement {
title: "A Masterpiece"
author: "Gabriel"
}
ListElement {
title: "Brilliance"
author: "Jens"
}
ListElement {
title: "Outstanding"
author: "Frederik"
}
}
}
}