时间戳

首页 > 解决方案 > 获取动态创建的组件坐标

qt - 获取动态创建的组件坐标

问题描述

我有一个主放置区域，加载时会动态创建一个新的矩形组件。新创建的矩形组件可以在拖动区域内拖动。但是，我不知道如何在拖放矩形时获取新矩形组件在拖动区域上的坐标。

编辑 我不知何故需要放置区代码中的新坐标数据

放置区代码

import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.3

Page{
    
    id: page1

    // On Dropped
    function onDropAreaDropped(drag){
        console.log(JSON.stringify(drag))
    }

    // On Entered
    function onDropAreaEntered(drag){
        console.log(JSON.stringify(drag))
    }

    // This is the Drop area code
    Rectangle{
        id: dropRectangle
        color: "beige"
        width: parent.width
        height: parent.height

        DropArea {
            id: dropArea
            anchors.fill: parent
            onEntered: onDropAreaEntered(drag)
            onDropped: onDropAreaDropped(drag)
        }

        // This creates the new rectangle component
        Component.onCompleted: {
            var dynamicRectangle2 = Qt.createComponent("Test2.qml");
            dynamicRectangle2.createObject(parent, {x:100, y: 100})
        }
    }
}

代码Test2.qml- 矩形组件

import QtQuick 2.15
import QtQuick.Controls 2.15

Page {
    id : somepageid

    Rectangle{
        id:dragRect

        height: 40
        width: 60
        color: "blue"
      
        // Need this x and y coordinate data in the drop area component
        onXChanged: {
            console.log(dragRect.x)
        }
        onYChanged: {
            console.log(dragRect.y)
        }

        MouseArea{
            id: mArea
            anchors.fill: parent
            drag.target: dragRect
        }
    }
}

标签： qtdrag-and-dropqml

解决方案

我只知道一种获取动态创建对象的方法，该对象尚未附加到任何变量或属性 - 您需要通过名称或data父属性中的已知索引找到它。

例如。你的Component.onCreated意志改变如下：

 Component.onCompleted: {
                var dynamicRectangle2 = Qt.createComponent("Test2.qml");
                dynamicRectangle2.createObject(parent, {x:100, y: 100, objectName: "dynamic_rectangle"})

                var index = indexOfObject("dynamic_rectangle", parent)
                if (index == -1)
                    console.debug("couldn't find an object")
                else
                    console.debug("object found at: (" + parent.data[index].x + "," + parent.data[index].y + ")")
            }

功能indexOfObject：

    // Searches for object with objectName inside parent's property 'data'
    // @param objName object name to search for
    // @param parent object where to search
    // @return -1 if not found, index if found
    function indexOfObject(objName, parent) {
        for (var i = 0 ; i < parent.data.length; i++) {
            if (parent.data[i].objectName === objName)
                return i
        }
        return -1
    }

推荐阅读