QML图像缩放意外行为

Question

Qt 5.9.2

以下QML代码：

ApplicationWindow
{
    visible: true
    width: 585
    height: 113
    title: qsTr("test")
    Rectangle
    {
        width: 585
        height: 113
        color: "black"
        x: 0
        y: 0
    }
    Image
    {
        source: "balloon.png"
        x: 0
        y: 0
    }
}

产生预期结果：

当我将scale: 0.5添加到Image元素时，我得到了这个：

但我希望它看起来像这样：

有人可以解释为什么0.5缩放图像不是位于（0,0）坐标，因为它在其属性中明确设置，并且可以在这里完成某些缩放图像位于（0,0）坐标吗？

Answer 1

正如documentation for scale中所述，缩放是从transformOrigin应用的，默认来源是Item.Center，因此您需要指定Item.TopLeft：

import QtQuick 2.7
import QtQuick.Controls 2.0

ApplicationWindow {
    visible: true
    width: 585
    height: 113
    title: qsTr("test")

    Rectangle {
        width: 585
        height: 113
        color: "black"
        x: 0
        y: 0
    }
    Image {
        source: "balloon.png"
        x: 0
        y: 0
        scale: 0.5
        transformOrigin: Item.TopLeft
    }
}

x和y属性仅影响项目的位置，而不影响其缩放起源。请注意，如果您需要进行更高级的转换，还有transform属性。