如何將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;
            }
        }
    }
}