Tableview header

[Babs]

Hello. Anyone get an idea of how to set title for each column in new TableView on qml side and c++ side?

[gfxx]

@Babs

import QtQuick 2.3
import QtQuick.Controls 2.3
import QtQuick.Controls 1.4 as C /* for make possible work controls 1.4 and 2.3 in the same page*/

/* your page layout and style code*/


                  C.TableView {
                       id: tableViewUser
                       x: 8
                       y: 8
                       width: 1152
                       height: 675
                       verticalScrollBarPolicy: 2
                       anchors.fill: parent
                       clip: true


                       C.TableViewColumn {
                           title: "User id"  /***************  !!!!   ********************/
                           role: "IDuser"
                           width: title.length * 10
                       }

regards

[Babs]

@gfxx I was talking about the new tableview in qt 5.12. This one is the one from QtQuick Controls. Anyway thank you for your response

[gfxx]

@Babs sorry I've unistall 5.12 so not can try .... but I think (for the Qt blog 5.12 tableView is only a special type of ListView) is similar to item{ text: .... where item are column .... but never try on 5.12 .... Please modify the title in somethings like "qt5.12 tableview header" .... so you can obtain more precise help.

regards

[gfxx]

@Babs I've istall today 5.12 ... same problem so I return to

import QtQuick.Controls 1.4 as C

If you have find the solutions ...

regards

[gfxx]

@gfxx I reply to my questions and @Babs question .... the solution is provided by qt example:

   TableView {
        id: tableView
        anchors.top: parent.top
        anchors.left: parent.left
        TableViewColumn{ role: "timestamp" ; title:  "Month"; width: tableView.width / 2 }
        TableViewColumn{ role: "expenses" ; title: "Expenses" ; width: tableView.width / 4 }
        TableViewColumn{ role: "income" ; title: "Income" ; width: tableView.width / 4 }
/* TableViewColumn{ role: "timestamp" ; title: nameColumn1 ; width: tableView.width / 2 }
        TableViewColumn{ role: "expenses" ; title: nameColumn2 ; width: tableView.width / 4 }
        TableViewColumn{ role: "income" ; title: nameColumn3 ; width: tableView.width / 4 }  if you would set column name from c++ main*/

        itemDelegate: Item {
            Text {
                id: delegateText
                anchors.verticalCenter: parent.verticalCenter
                width: parent.width
                anchors.leftMargin: 4
                anchors.left: parent.left
                anchors.right: parent.right
                color: styleData.textColor
                elide: styleData.elideMode
                text: customText
                horizontalAlignment: styleData.textAlignment

                property string originalText: styleData.value
                property string customText

                onOriginalTextChanged: {
                    if (styleData.column === 0) {
                        if (delegateText.originalText !== "") {
                            var pattern = /(\d\d\d\d)-(\d\d)/
                            var matches = pattern.exec(delegateText.originalText)
                            var colIndex = parseInt(matches[2], 10) - 1
                            delegateText.customText = matches[1] + " - " + graphAxes.column.labels[colIndex]
                        }
                    } else {
                        delegateText.customText = originalText
                    }
                }
            }
        }

        model: graphData.model

So I see that my first reply was ok.

for C++ side

auto* ctx = engine.rootContext();
ctx->setContextProperty("nameColumn1", "myColumn1");
ctx->setContextProperty("nameColumn2", "myColumn2");
ctx->setContextProperty("nameColumn3", "myColumn3");

[Babs]

@gfxx Your are using tableview for qt quick control 1.4. A new tableview was released from version 5.12 and is more efficient. I am talking about this one.
https://doc.qt.io/qt-5/qml-qtquick-tableview.html

[gfxx]

@Babs these example came from 5.12

[maxwell31]

As far as I understood it, you need to make headers on your own, e.g. outside of the table (which is a shame QT!).

[NeoMind]

So is this still the case or has headers been added now in TableView. because i still do not see them.

[YamielAbreu]

More than 1 year later, I am having the same issue with tableview on QML, having a table on QML with headers is not easy or well documented. This is really a shame if you want to use QML for desktop applications.

[Diracsbracket]

@YamielAbreu
Faced the same problem, and found a sketch of a "solution" here:
https://stackoverflow.com/questions/55610163/how-to-create-a-tableview-5-12-with-column-headers