在HorizontalHeaderView中显示列标题

Question

我试图创建一个简单的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
}
}
}
}

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