如何使 QML TableView 有两列和一个 header？

Question

TableView 的每一列都绑定到一个模型项。

我怎样才能像图片那样用一 header 制作两列？ “Column 1”包含两列，“F-1”和“drop here”。

Answer 1

这里有一些简单的例子：

import QtQuick 2.7
import QtQuick.Window 2.0
import QtQuick.Controls 1.4


Window
{
    width: 600
    height: 500
    visible: true

    ListModel {
        id: myModel
        ListElement {
            column1: "A1"
            column2: "A2"
            column3: "A3"
        }
        ListElement {
            column1: "B1"
            column2: "B2"
            column3: "B3"
        }
        ListElement {
            column1: "C1"
            column2: "C2"
            column3: "C3"
        }
    }

    TableView {
        id: myTable
        anchors.fill: parent
        anchors.margins: 5
        TableViewColumn {
            role: "column1"
            title: "Column1"
            width: myTable.width / 3
            horizontalAlignment: Text.AlignHCenter
        }
        TableViewColumn {
            role: "column2"
            title: "Column2"
            width: myTable.width / 3
            horizontalAlignment: Text.AlignHCenter
        }
        TableViewColumn {
            role: "column3"
            title: "Column3"
            width: myTable.width / 3
            horizontalAlignment: Text.AlignHCenter
        }
        model: myModel
        itemDelegate: Item {
            Row {
                id: row
                anchors.fill: parent
                Text {
                    width: row.width/2
                    text: styleData.value
                    horizontalAlignment: Text.AlignHCenter
                }
                Text {
                    width: row.width/2
                    text: "drop here"
                    color: "red"
                    horizontalAlignment: Text.AlignHCenter
                }
            }
        }
    }
}

如何使 QML TableView 有两列和一个 header？

How do I make QML TableView have two columns with a single header?

qml

qtquickcontrols