QML/QtQuick：使图像仅占据ColumnLayout中的可用高度

我正在开发一个带有QML/QtQuick和qt5.9.x的移动应用程序（qt5.10+不是一个选项，因为它不支持ios8和9）

在我的垂直布局中，我想将

图像

自动调整到可用高度，但我不知道如何实现这一点：它总是以全高显示。我的QML文件：

import QtQuick 2.9
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3

ApplicationWindow {
    id: window
    visible: true

    // simulate iPhone 6
    width: 375
    height: 667

    ColumnLayout {
        anchors.fill: parent
        spacing: 0

        Text {
            text: qsTr("multiline text multiline text multiline text multiline text")
            textFormat: Text.PlainText
            horizontalAlignment: Text.AlignHCenter
            wrapMode: Text.WordWrap
            font { weight: Font.Normal; pointSize: 18 }

            Layout.fillWidth: true
            Layout.topMargin: 20
        }

        Text {
            text: qsTr("title1")
            textFormat: Text.PlainText
            font { weight: Font.DemiBold; pointSize: 50 }

            Layout.alignment: Qt.AlignHCenter
            Layout.topMargin: 30
        }
        Text {
            text: qsTr("title2")
            textFormat: Text.PlainText
            font { weight: Font.DemiBold; pointSize: 25 }

            Layout.alignment: Qt.AlignHCenter
        }

        Image {
            source: "qrc:/Painting.jpg"
            verticalAlignment: Image.AlignTop
            fillMode: Image.PreserveAspectCrop

//            Layout.preferredHeight: 200 // that's how I obtained the second screenshot, but using a constant is not an option of course
            Layout.alignment: Qt.AlignHCenter
            Layout.topMargin: 20
        }

        Text {
            text: qsTr("multiline text multiline text multiline text multiline text")
            textFormat: Text.PlainText
            horizontalAlignment: Text.AlignHCenter
            wrapMode: Text.WordWrap
            font { weight: Font.Normal; pointSize: 17 }

            Layout.fillWidth: true
            Layout.topMargin: 20
        }

        GridLayout {
            Layout.maximumWidth: 300
            Layout.alignment: Qt.AlignHCenter
            Layout.topMargin: 20
            Layout.bottomMargin: 30

            rows: 3
            columns: 3
            rowSpacing: 10
            columnSpacing: 10

            Rectangle {
                color: "blue"

                Layout.row: 0
                Layout.column: 0
                Layout.columnSpan: 3
                Layout.fillWidth: true
                Layout.preferredHeight: 25
            }
            Rectangle {
                color: "blue"

                Layout.row: 1
                Layout.column: 0
                Layout.fillWidth: true
                Layout.preferredHeight: 25
            }
            Rectangle {
                color: "blue"

                Layout.row: 1
                Layout.column: 1
                Layout.columnSpan: 2
                Layout.fillWidth: true
                Layout.preferredHeight: 25
            }
            Rectangle {
                color: "blue"

                Layout.row: 2
                Layout.column: 0
                Layout.fillWidth: true
                Layout.preferredHeight: 25
            }
            Rectangle {
                color: "blue"

                Layout.row: 2
                Layout.column: 1
                Layout.fillWidth: true
                Layout.preferredHeight: 25
            }
            Rectangle {
                color: "blue"

                Layout.row: 2
                Layout.column: 2
                Layout.fillWidth: true
                Layout.preferredHeight: 25
            }
        }
    }
}

第一张图片是现在的样子，第二张是我想要的样子：（屏幕截图来自桌面，但在手机上结果是一样的）

---

我知道如何通过自动布局在iOS上实现所需的行为（使用图像的拥抱优先级和/或压缩阻力），但我在QML/QtQuick中找不到任何类似的功能。

使用

布局。fillHeight

将自动将

图像调整为可用高度：

Image {
    // ...
    fillMode: Image.PreserveAspectCrop
    Layout.fillHeight: true
}