QML中的GridLayout如何约束单元格中的矩形

时间:2018-10-09 18:59:03

标签: qt qml qt5

我正在使用以下代码,希望将Rectangle设置在Item的顶部中间。

import QtQuick 2.0
import QtQuick.Layouts 1.3

Item {
    GridLayout {
        id: gridLayout
        anchors.fill: parent
        columns: 5
        rows: 7

        Rectangle {
            id: rectangle
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.row: 0
            Layout.column: 2
            Layout.rowSpan: 1
            Layout.columnSpan: 2

            color: "#ffffff"
        }
    }
}

相反,Rectangle填充了整个项目。

1 个答案:

答案 0 :(得分:0)

我看到GridLayout中的一切都是相对的,如果事情没有正确地跨过指定的跨度,那就是“粪肥”表演。 以下对我有用。

import QtQuick 2.0
import QtQuick.Layouts 1.3

Item {
    GridLayout {
        id: gridLayout
        anchors.fill: parent

        Rectangle {
            id: top_center
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.row: 0
            Layout.column: 2
            Layout.rowSpan: 1
            Layout.columnSpan: 1

            color: "#ffffff"
        }
        Rectangle {
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.row: 1
            Layout.column: 0
            Layout.rowSpan: 3
            Layout.columnSpan: 1

            color: "lightblue"
        }
        Rectangle {
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.row: 1
            Layout.column: 1
            Layout.rowSpan: 3
            Layout.columnSpan: 6

            color: "white"
        }
        Rectangle {
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.row: 4
            Layout.column: 0
            Layout.rowSpan: 1
            Layout.columnSpan: 6

            color: "lightblue"
        }
    }
}