0

I have a Qt QML application. Following is the complete code of the application:

Code: 

import QtQuick 2.9
import QtQuick.Window 2.2

Window {
    id: app_main_window
    visible: true
    width: 800
    height: 600
    title: qsTr("Hello QML")

    Rectangle {
        id: my_item_1
        x: 100
        y: 100
        width: 100
        height: 100
        color: "grey"
        visible: true
        z: 1
    }

    Rectangle {
        id: my_item_2
        x: 400
        y: 400
        width: 100
        height: 100
        color: "grey"
        visible: true
        z: 1

        MouseArea {
            anchors.fill: parent
            onClicked: {
                // How can I change the center of my_item_1  to some arbitrary new center. lets say app_main_window's center. this involves another question. how can I get app_main_window's center?
            }
        }
    }
}

Question:
My question is simple. How can change the center of any QQuickitem to a new center? So in above case how can change the center of my_item_1 to a new center (Qt.point(some_x_center, some_y_center)) when my_item_2 gets a click event. Additionally, is possible to get another item's center? Like app_main_window or my_item_2's center to apply to the target my_item_1?

PS:
I have made the code simple to make the question objective. I have quite a complicated logic in my actual code where I need to realign something like my_item_1 to a new center without usage of anchors as the QQuickitem I am trying to do that with is scaled and panned into a new point.

TheWaterProgrammer
  • 7,055
  • 12
  • 70
  • 159
  • If you're talking about within QML, take a look at the `anchors` property. For the implementation, you would use the `MouseArea` and `onClicked` along with `my_item_1.anchors.centerIn: app_main_window`. Is this what you're looking for? – Aditya Feb 19 '18 at 21:42
  • What is the problem with `anchors.centerIn` ? – dydil Feb 19 '18 at 21:43
  • @dydil one potential problem is you can only use parent or siblings with anchors. – dtech Feb 19 '18 at 21:49
  • @dydil as I said. I have a different issue which can be solved if I can change the center of `my_item_1`. this sample only has code enough demonstrate the question. – TheWaterProgrammer Feb 19 '18 at 21:52

1 Answers1

1

If anchors can't be used, you have to calculate manually the center and assign it.

Quick example:

Item
{
    anchors.fill: parent

    Rectangle
    {
        id: nonParentOrSibling
        width: 200
        height: 200
        x: 350
        y: 240
        color: "red"
    }

}

Rectangle
{
    id: rectToMove

    width: 100
    height: 100
    y: 200
    color: "blue"

    MouseArea
    {
        anchors.fill: parent
        onClicked:
        {
            var itemCenter = Qt.point(nonParentOrSibling.x + nonParentOrSibling.width / 2, nonParentOrSibling.y + nonParentOrSibling.height / 2)
            rectToMove.x = itemCenter.x - rectToMove.width / 2
            rectToMove.y = itemCenter.y - rectToMove.height / 2
        }
    }
}

Note that this is a one time moving only, and the rectangle won't move if the target is moved.

To make it follow the target you have to rebind it with Qt.binding.

If rectToMove is not in the same coordinate system as nonParentOrSibling, you can use Item.mapToItem() and mapFromItem() to adapt the coordinates.

dydil
  • 949
  • 7
  • 20