Показать несколько ролей в одном столбце TableView

Question

У меня есть база данных SQLite 3 с 4-мя колоннами и QML код с TableView, который отображает его:

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 
} 

Он отлично работает, но мне нужно, чтобы отобразить первые две роли, name и surname, как уникальный столбец в TableView.

Вот код моей модели и 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

Я думаю, вы могли бы присоединиться оба значения, используя delegate компонент.

В вашем случае:

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 
} 

Вот вам еще один пример, только для тестирования, если вы хотите работать с ним. Пример основан на этом 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" 
      } 
     } 
    } 

}