QuickControls2图像未拉伸到父级的整个宽度

Question

我有一个简单的QuickControls2 QML设计，其中图像应水平拉伸以填充应用程序窗口并保持其纵横比。但是当我运行程序时，图像不会缩放/拉伸。

问题是图像小于当前窗口大小并且QT不能放大/增加图像大小吗？是否有一项设置可以使QT调整图像大小以填充宽度而与图像大小无关？

您能告诉我哪里出了问题以及如何解决吗？

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

ApplicationWindow {
    id: applicationWindow
    visible: true
    width: 640
    height: 480
    title: qsTr("Scroll")

    ColumnLayout {
        id: mainLayout
        anchors.fill: parent

        Image {
            id: imagePane
            Layout.fillWidth: true
            fillMode: Image.PreserveAspectFit
            source: "placeholder.jpg"
        }
    }
}

Answer 1

使用Image.PreserveAspectFit，图像会按比例缩放以适合裁切效果， 现在，由于您没有填充Layout高度，因此图像无法缩放到超出其隐式高度。

由于您的要求是使QT调整图像大小以适合宽度而不管图像大小 表示您接受裁剪超出高度限制的图像，在这种情况下您需要使用：

 fillMode: Image.PreserveAspectCrop

Answer 2

尝试一下：

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

ApplicationWindow {
    id: applicationWindow
    visible: true
    width: 640
    height: 480
    title: qsTr("Scroll")

    ColumnLayout {
        id: mainLayout
        anchors.fill: parent

        Image {
            id: imagePane
            Layout.preferredWidth: parent.width
            Layout.preferredHeight: parent.height
            fillMode: Image.PreserveAspectFit
            source: "placeholder.jpg"
        }
    }
}