如何将QQuickItem的位置转换为其新的父级

Question

我有下面的2个QQuickItem ，我可以像这样使用QMLEngine在C ++端获取。

QQuickItem * quick_item_1 = m_qml_engine->rootObjects()[0]->findChild<QQuickItem*>("quickitem1");
QQuickItem * quick_item_2 = m_qml_engine->rootObjects()[0]->findChild<QQuickItem*>("quickitem2");

注： quick_item_1的母公司为不同的 ＆ quick_item_2的直接父也不同。 但是它们都在同一应用程序窗口中被绘制为不同的直接父级。

我正在不同的QQuickItem它们都画在屏幕外。 我们称之为new_parent_surface 。 我通过将它们的父new_parent_surface更改为new_parent_surface来在new_parent_surface上绘制这两个项目。

quick_item_1->setParentItem(new_parent_surface);
quick_item_2->setParentItem(new_parent_surface);

这对于将它们绘制在新的父QQuickItem上的目的而言效果很好 。 我得到两个quick_item_1 ＆ quick_item_2上绘制new_parent_surface 。 即使未在UI上绘制new_parent_surface ，但是如果我使用new_parent_surface的new_parent_surface拍摄快照，则可以看到在其上绘制的两个项目。 很好，直到这里。

但是， quick_item_1和quick_item_2的位置不正确。 我想以类似于放置原始父项的方式放置它们。 我可以做一些百分比数学运算，并尝试以与在其原始父级上绘制相同的方式定位它们， 但是没有QQQuickItem或Qt API将此定位转换为新父级吗？

我试图研究QQuickItem的映射API，例如mapToItem ，并像这样尝试它们。

quick_item_2->mapToItem(new_parent_surface, quick_item_2->position());

但是定位仍然不正确。

因此，在执行setParentItem之后， 如何将QQuickItem的位置映射到其新的父QQuickItem中？

Answer 1

Item的位置始终相对于其父项。 父级的位置是相对于其父级的，依此类推。 但是，您始终可以获得相对或全球职位。 QML具有很多协调翻译功能。 这是一个可以解释问题的小例子：

import QtQuick 2.7
import QtQuick.Window 2.0
import QtQuick.Controls 2.1

Window {
    id:container
    width: 800
    height: 800
    visible: true

    Component {
        id: rect
        Rectangle {
            property bool imParent: false
            x: 50 + Math.round(Math.random() * 550)
            y: 50 + Math.round(Math.random() * 550)
            width: 100 + Math.round(Math.random() * 100)
            height: 100 + Math.round(Math.random() * 100)
            color: Qt.rgba(Math.random(),Math.random(),Math.random(),1);
            Drag.active: dragArea.drag.active
            MouseArea {
                id: dragArea
                anchors.fill: parent
                drag.target: parent
            }
            Text {
                anchors.centerIn: parent
                text: imParent ? "I'm parent" : "Drag me"
                color: "white"
            }
        }
    }

    Rectangle {
        id: blk
        x: 10
        y: 10
        z: 100
        parent: null
        height: 50
        width: 50
        radius: 5
        border.color: "white"
        color: "black"

    }

    Repeater {
        id: reptr
        model: 5
        property int pos: 0
        Loader {
            id: loader
            sourceComponent: rect
            onLoaded: {
                if(blk.parent == null) {
                    blk.parent = loader.item;
                    loader.item.imParent = true;
                }
            }
        }
    }

    Row {
        anchors.horizontalCenter: container.contentItem.horizontalCenter
        spacing: 2
        Button {
            text: "Reparent relative to parent"
            onClicked: {
                reptr.pos ++;
                if(reptr.pos >= reptr.model) {
                    reptr.pos = 0;
                }
                var item = reptr.itemAt(reptr.pos).item;
                blk.parent.imParent = false;
                blk.parent = item;
                blk.parent.imParent = true;
            }
        }
        Button {
            text: "Reparent relative to scene"
            onClicked: {
                reptr.pos ++;
                if(reptr.pos >= reptr.model) {
                    reptr.pos = 0;
                }
                var item = reptr.itemAt(reptr.pos).item;
                var coord = blk.mapToGlobal(blk.x, blk.y);
                blk.parent.imParent = false;
                blk.parent = item;
                blk.parent.imParent = true;
                coord = blk.mapFromGlobal(coord.x, coord.y);
                blk.x = coord.x;
                blk.y = coord.y;
            }
        }
    }
}