设置Layout.fillHeight:true使矩形不可见在Qt Quick 2中

时间:2017-11-07 17:55:02

标签: qt qml qtquick2

我正在尝试为我的应用程序创建基本布局。我希望它看起来像this。这是我到目前为止的设置。

main.qml

import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.3

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("basic layout")

    ColumnLayout {
        anchors.fill: parent
        spacing: 0

        Header {
            Layout.fillWidth: true
            height: 50
        }

        Body {
            Layout.fillWidth: true
            Layout.fillHeight: true
        }

        Footer {
            Layout.fillWidth: true
            height: 30
        }
    }
}

Header.qml

import QtQuick 2.7
import QtQuick.Layouts 1.3

Rectangle {
    color: "red"
}

Footer.qml

import QtQuick 2.7
import QtQuick.Layouts 1.3

Rectangle {
    color: "blue"
}

Body.qml

import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.3

Item {
    RowLayout {
        anchors.fill: parent

        Rectangle {
            color: "red"

            width: 100
            Layout.fillHeight: true
        }

        Rectangle {
            color: "green"

            width: 400
            Layout.fillHeight: true
        }

        Rectangle {
            color: "blue"

            width: 400
            Layout.fillHeight: true
        }

        Rectangle {
            color: "black"

            Layout.fillWidth: true
            Layout.fillHeight: true
        }
    }
}

当它运行时,我得到的Body部分只是空格。 This what i get当我手动给它们一个尺寸时,可以看到矩形。我尝试在anchors.fill: parent中将Item添加到Body.qml级别。结果仍然相同。我做错了什么?

1 个答案:

答案 0 :(得分:1)

您必须使用

在RowLayout中设置矩形的宽度
Layout.preferredWidth: 400

而不是

 width: 400