Titreşen bir ızgarada bir ızgara için yapışkan bir başlık nasıl bulunur

Biraz zor ama bir çözüm buldum.

İlk olarak, "kukla" üstbilgileri oluşturun Items. Onların setini yapabilirsiniz Layout.minimalWidth gerekirse başlık metninin genişliği olmak için.

Ardından, Titremeden önceki bir Öğede başlığınızı oluşturun, ızgarayla yatay olarak hizalandığından emin olun ve öğeleri kullanarak konumlandırın. x başlığın değerleri.

Son olarak, sahte üstbilgiler tarafından eklenen yabancı satırı kaldırmak için Titreşebilir üzerinde negatif bir kenar boşluğu ayarlayın.

Ben de kullanmayı denedim fillWidth: true mankenler üzerinde ve sonra ayarı width her başlık öğesinden, ancak dezavantajı, tablo sütun genişliğini değiştirmesidir.

import QtQuick 2.0
import QtQuick.Layouts 1.12

ColumnLayout {
    width: 200
    height: 200

    // Header
    Item {
        Layout.minimumHeight: childrenRect.height
        Layout.fillWidth: true
        Text {
            id: header0
            x: headerDummy0.x
            anchors.top: parent.top
            text: "Header 0"
        }
        Text {
            id: header1
            x: headerDummy1.x
            anchors.top: parent.top
            text: "Header 1"
        }
        Text {
            id: header2
            x: headerDummy2.x
            anchors.top: parent.top
            text: "Header 2"
        }
    }

    Flickable {
        Layout.fillWidth: true
        Layout.preferredHeight: 200
        contentWidth: width
        contentHeight: grid.height
        clip: true
        // Eliminate the first row, which are the dummies
        topMargin: - grid.rowSpacing

        GridLayout {
            id: grid
            columns: 3
            rowSpacing: 50
            columnSpacing: 10

            function reparentChildren(source, target) {
                while (source.children.length) {
                    source.children[0].parent = target;
                }
            }

            // Header dummies
            Item {
                id: headerDummy0
                Layout.minimumWidth: header0.implicitWidth
            }
            Item {
                id: headerDummy1
                Layout.minimumWidth: header1.implicitWidth
            }
            Item {
                id: headerDummy2
                Layout.minimumWidth: header2.implicitWidth
            }

            // Data
            Repeater {
                model: 50

                Item {
                    Component.onCompleted: grid.reparentChildren(this, grid)
                    Text {
                        text: "Column 0, %1".arg(modelData)
                    }
                    Text {
                        text: "Column 1, %1".arg(modelData)
                    }
                    Text {
                        text: "Column 2, %1".arg(modelData)
                    }
                }
            }
        }
    }
}