启动时未更新Qt快速绑定

尝试在Qt Quick中创建一个非常简单的节点编辑器

最棘手的部分似乎是

连接

项，它必须跟踪源和目标的两个绝对位置

IOPort

s

以下代码可以正常工作，但在启动时绑定没有计算（或以错误的顺序计算），导致连接线在启动时处于错误的位置：

移动任一节点后，会立即将其调整到正确位置：

我想加上：

Component.onCompleted: {
    start = mapFromItem(from, 0, 0)
    end = mapFromItem(to, 0, 0)
}

到

连接

，修复了启动问题，但破坏了绑定

所以我求助于这个丑陋的黑客：

Component.onCompleted: {
    from.x = from.x+1
    from.x = from.x-1
}

这个问题有更好的解决办法吗

（GitHub存储库中提供的文件，底部链接）

main.qml：

import QtQuick 2.15
import QtQuick.Window 2.15

Window {
    width: 420
    height: 280
    visible: true
    title: qsTr("Node editor")

    Node {
        x: 20
        y: 40
        width: 120
        height: 50

        IOPort {id: o1; x: 0; y: parent.height}
    }

    Node {
        x: 260
        y: 140
        width: 120
        height: 50

        IOPort {id: i1; x: 0; y: 0}
    }

    Connection {
        from: o1; to: i1
    }
}

Node.qml：

import QtQuick 2.0

Rectangle {
    id: rect
    border.color: "black"
    border.width: 2
    color: "#eee"

    MouseArea {
        anchors.fill: parent
        drag.target: rect
    }
}

IOPort.qml：

import QtQuick 2.0

Item {
    id: root
    property real size: 15
    property real globalX: x + parent.x
    property real globalY: y + parent.y
    property real globalZ: 1 + parent.z

    Rectangle {
        id: rect
        x: -width/2
        y: -height/2
        width: root.size
        height: root.size
        border.color: "black"
        color: "gray"
    }
}

Connection.qml：

import QtQuick 2.0
import QtQuick.Shapes 1.15

Shape {
    id: root
    property IOPort from
    property IOPort to
    x: Math.min(from.globalX, to.globalX)
    y: Math.min(from.globalY, to.globalY)
    z: Math.max(from.globalZ, to.globalZ) + 0.5
    width: Math.abs(from.globalX - to.globalX)
    height: Math.abs(from.globalY - to.globalY)
    property point start: from.globalX, from.globalY, to.globalX, to.globalY, mapFromItem(from, 0, 0)
    property point end: from.globalX, from.globalY, to.globalX, to.globalY, mapFromItem(to, 0, 0)

    ShapePath {
        strokeWidth: 4
        strokeColor: "black"
        startX: root.start.x
        startY: root.start.y
        PathLine {
            x: root.end.x
            y: root.end.y
        }
    }
}

---

GitHub存储库：

我目前无法重现错误，但我认为我发现了一个问题：

您的

连接

根的

开始

和

结束

属性缺少对同一对象的

x

和

y

的“强制”依赖关系

出于某种原因，您决定不仅要设置路径点的坐标，还要移动整个

连接

元素本身。因此，如果

root

的

x

和

y

在

start

和

end

之后发生更新，则后者仍然包含

x

和

y

仍为默认值（可能

0,0

）时点的相对坐标，因此该行被

x，y

像素替换

尝试以这种方式更改它们（我还删除了您不需要的依赖项）：

---

（这里有更多的建议，以防这不起作用，但它们被删除了，因为上面似乎已经解决了问题）

我目前无法重现错误，但我认为我发现了一个问题：

您的

连接

根的

开始

和

结束

属性缺少对同一对象的

x

和

y

的“强制”依赖关系

出于某种原因，您决定不仅要设置路径点的坐标，还要移动整个

连接

元素本身。因此，如果

root

的

x

和

y

在

start

和

end

之后发生更新，则后者仍然包含

x

和

y

仍为默认值（可能

0,0

）时点的相对坐标，因此该行被

x，y

像素替换

尝试以这种方式更改它们（我还删除了您不需要的依赖项）：

---

（这里有更多的建议，以防这不起作用，但它们被删除了，因为上面似乎已经解决了问题）

你完全正确：

连接

的

开始

和

结束

属性缺少对

连接

的

x

和

y

的依赖性。谢谢你的解释！也许

ShapePath

不必（直观地）包含在其父（

Shape

）矩形中，但我认为在未来的开发中，它会更有意义，例如，如果我需要使连接可点击。您仍然需要制作一个可以位于任何位置的

MouseArea

。。但我想我明白你的意思了。如果这完全解决了您的问题，请接受答案，以便将您的问题标记为不需要更多答案。谢谢。你完全正确：

连接

的

开始

和

结束

属性缺少对

连接

的

x

和

y

的依赖关系。谢谢你的解释！也许

ShapePath

不必（直观地）包含在其父（

Shape

）矩形中，但我认为在未来的开发中，它会更有意义，例如，如果我需要使连接可点击。您仍然需要制作一个可以位于任何位置的

MouseArea

。。但我想我明白你的意思了。如果这完全解决了您的问题，请接受答案，以便将您的问题标记为不需要更多答案。谢谢

property point start: from.globalX, from.globalY, x, y, mapFromItem(from, 0, 0)
property point end: x, y, to.globalX, to.globalY, mapFromItem(to, 0, 0)