Important: Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

Show column titles in HorizontalHeaderView



  • I am trying to create a simple QML Table view, based on a static model. While I have that working, I can't get my column titles to display. What displays now is "1", "2", "3" etc. But I want to show the column titles as defined in my model.

    I would like to use HorizontalHeaderView (since that is the NEW way to use titles). Can someone point out how to fix my code below?

    import QtQuick 2.12
    import QtQuick.Window 2.12
    import QtQuick.Controls 2.15
    import Qt.labs.qmlmodels 1.0
    Window {
        width: 640
        height: 480
        visible: true
        title: qsTr("Hello World")
        
        TableModel {
            id: myModel
            TableModelColumn { display: "companyName" }
            TableModelColumn { display: "info1" }
            TableModelColumn { display: "info2" }
            rows: [
                {
                    companyName: "company 1",
                    info1: "company 1 info 1",
                    info2: "company 1 info 2"
                },
                {
                    companyName: "company 2",
                    info1: "company 2 info 1",
                    info2: "company 2 info 2"
                },
                {
                    companyName: "company 3",
                    info1: "company 3 info 1",
                    info2: "company 3 info 2"
                }
            ]
        }
        
        TableView {
            id: myTableView
            anchors.fill: parent
            clip: true
            
            model: myModel
            
            delegate: Rectangle {
                implicitWidth: 100
                implicitHeight: 50
                border.width: 1
                Text {
                    text: display
                    anchors.centerIn: parent
                }
            }
        }
        
        HorizontalHeaderView {
            id: horizontalHeader
            syncView: myTableView
            model: myModel
            //        model: [ "A","B","C"]
            delegate: Rectangle {
                implicitWidth: 100
                implicitHeight: 50
                Text {
                    text: display
                    anchors.centerIn: parent
                }
            }
        }
    }
    


  • I don't see a way to add this to TableModel. I think the best you can do is just create a model that mirrors your columns, or create a QAbtractTableModel.

    HorizontalHeaderView {
            id: horizontalHeader
            syncView: myTableView
            model: ["Company Name", "Info 1", "Info 2"]
            delegate: Rectangle {
                implicitWidth: 100
                implicitHeight: 50
                Text {
                    text: modelData  // notice non abstract models assume data appears in modelData
                    anchors.centerIn: parent
                }
            }
        }
    

    Edit:
    If you go the QAbstractTableModel route you have to define the headerData() function.



  • I have implemented a QAbstractTableModel with a headerData function, but the header row is still messed up. Could you elaborate on your answer, or provide a complete example? I assume that my horizontalHeaderView model points to the same model as the view.



  • The docs don't show it specifying a model. Not sure what is supposed to happen with headerData. I don't know how to build the delegate for a qabstracttablemodel. I just read the docs and figure things out.

    Edit: This might help. https://stackoverflow.com/questions/63719365/horizontalheaderview-not-calling-headerdata-of-qabstracttablemodels-child


Log in to reply