是否有办法在QML GridLayout中创建一个空网格?

Question

我正在尝试使用QML创建一个元素周期表。为了正确地排列元素(我使用GroupBoxes)，我需要有空白空间/空网格。我已经尝试将空项插入到所需的网格中，但GridLayout会忽略它们。使用空groupbox会导致在不应该有任何东西的位置留下小方块。

然而我的代码是这样的:

GridLayout {
id: grid
anchors.fill: parent  //grid erstreckt sich nun über ganzes Window
columns: 18
rows: 9
GroupBox {
//GroupBoxen werden maximal gestreckt in Höhe und Breite --> raum wird ausgefüllt
Layout.fillHeight: true
Layout.fillWidth: true
ColumnLayout {
Label {
Layout.alignment: Qt.AlignLeft
text: qsTr("1")
}
Label {
Layout.alignment: Qt.AlignHCenter
text: qsTr("H")
}
Label {
Layout.alignment: Qt.AlignHCenter
text: qsTr("Hydrogen")
}
}
}
Repeater {
model: 16
GroupBox {
}
}
GroupBox {
//GroupBoxen werden maximal gestreckt in Höhe und Breite --> raum wird ausgefüllt
Layout.fillHeight: true
Layout.fillWidth: true
ColumnLayout {
Label {
Layout.alignment: Qt.AlignLeft
text: qsTr("1")
}
Label {
Layout.alignment: Qt.AlignHCenter
text: qsTr("H")
}
Label {
Layout.alignment: Qt.AlignHCenter
text: qsTr("Hydrogen")
}
}
}
Repeater {
model: 100
GroupBox {
//GroupBoxen werden maximal gestreckt in Höhe und Breite --> raum wird ausgefüllt
Layout.fillHeight: true
Layout.fillWidth: true
ColumnLayout {
Label {
Layout.alignment: Qt.AlignLeft
text: qsTr("1")
}
Label {
Layout.alignment: Qt.AlignHCenter
text: qsTr("H")
}
Label {
Layout.alignment: Qt.AlignHCenter
text: qsTr("Hydrogen")
}
}
}
} 

这导致我的应用程序看起来像这样:

周期表qml

Answer 1

您可以将占位符GroupBox的background设置为Item，如下所示

Repeater {
model: 16
GroupBox {
background: Item {}
}
}

或者你可以像这样直接使用Item

Repeater {
model: 16
Item {}
}