在 HorizontalHeaderView 中显示列标题答案

【问题标题】：Show column titles in HorizontalHeaderView在 HorizontalHeaderView 中显示列标题
【发布时间】：2021-09-28 17:49:39
【问题描述】：

我正在尝试基于静态模型创建一个简单的 QML 表视图。虽然我有这个工作，但我无法显示我的列标题。现在显示的是“1”、“2”、“3”等。但我想显示模型中定义的列标题。

我想使用 HorizontalHeaderView（因为这是使用标题的新方法）。有人可以指出如何在下面修复我的代码吗？

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
            }
        }
    }
}

【问题讨论】：

标签： qt qml qtableview

【解决方案1】：

几天前我遇到了同样的问题。显然，您还必须在 HorizontalHeaderView 中指定模型，即列标题。

这种方式对我来说是按预期工作的。我希望它能回答你的问题。

    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: [ "companyName","info1","info2"] // HERE column titles
    //        model: [ "A","B","C"]

    delegate: Rectangle {
        implicitWidth: 100
        implicitHeight: 50
        Text {
            text: modelData // HERE point to model
            anchors.centerIn: parent
        }
    }
}

【讨论】：