无法将 double 分配给 QQuickAnchorLine

Question

我想将底部图像放置在顶部图像上方。但是在向锚点添加偏移量后，我收到此错误：

qrc:/Template.qml:21:22: Unable to assign double to QQuickAnchorLine

在此线上添加 20 像素的偏移后：

anchors.top: top_bg.bottom-20

如何使用锚点作为参考点来偏移项目？

import QtQuick 2.11
import QtQuick.Controls 2.4
import QtQuick.Layouts 1.11
import QtQuick.Dialogs 1.0
import QtQuick.Controls.Material 2.3

Item {
    id: root
    Image {
        id: top_bg
        source: "qrc:/images/top_bg.png"
        anchors.top: parent.top
        anchors.left: parent.left
        anchors.right: parent.right
        height: root.height*0.33
        fillMode: Image.PreserveAspectCrop
    }
    Image {
        id: map_bg
        source: "qrc:/images/map_bg.png"
        anchors.top: top_bg.bottom-20
        anchors.left: parent.left
        anchors.right: parent.right
        anchors.bottom: parent.bottom
        fillMode: Image.PreserveAspectCrop

    }
}

Answer 1

锚点不是数字位置，而是相对于项目的位置，它们不能相加或相减，在您的情况下，您应该使用属性y和height：

Image {
    id: map_bg
    source: "qrc:/images/map_bg.png"
    y: top_bg.y + top_bg.height - 20 // <---
    anchors.left: parent.left
    anchors.right: parent.right
    anchors.bottom: parent.bottom
    fillMode: Image.PreserveAspectCrop
}

另一种选择是使用边距：

Image {
    id: map_bg
    source: "qrc:/images/map_bg.png"
    anchors.top: top_bg.bottom
    anchors.topMargin: -20
    anchors.left: parent.left
    anchors.right: parent.right
    anchors.bottom: parent.bottom
    fillMode: Image.PreserveAspectCrop
}