QML Drag & Drop in einem Raster

Question

Ich habe ein Element (ein Rechteck), das durch die verschiedenen Positionen des Rasters verschoben werden kann (siehe Code unten).

Der Verweis, um zu entscheiden, ob sich das Rechteck in der einen oder anderen Zelle befindet, ist oben links (x = 0; y = 0) des Rechtecks. Ich möchte, dass die Referenz die Mitte des Rechtecks ​​ist. Irgendwelche Ideen?

Finden Sie den Code unten:

import QtQuick 2.5 
import QtPositioning 5.5 
import QtLocation 5.6 
import QtGraphicalEffects 1.0 
import QtQml 2.2 
import QtQuick.Controls 1.0 

Rectangle{ 
id: mainContainer 
width:800; height:width 
color: "red" 

Grid { 
id:gridA 
anchors.centerIn: parent 
width: parent.width; height:width; 
columns: 2; rows: 2; spacing: 2 

verticalItemAlignment: Grid.AlignHCenter 
horizontalItemAlignment: Grid.AlignVCenter 

Repeater { 
id:cells 
model: gridA.columns*gridA.rows 
property int draggedItemIndex: -1 

Rectangle { 

width: gridA.width/gridA.columns; height: gridA.height/gridA.rows 
color: "white" 

DropArea { 
    id: dragTarget 
    property alias dropProxy: dragTarget 
    anchors.fill: parent 
    keys: [ "KEY_A" ] 

    Rectangle { 
     id: dropRectangle 
     anchors.fill: parent 
     states: [ 
      State { 
       when: dragTarget.containsDrag 
       PropertyChanges { target: dropRectangle; color: "grey"} 
       PropertyChanges { target: cells; draggedItemIndex: index} 
       } 
      ] 
     } 
    } 
} 
} 
} 

Rectangle{ 
id: icon 
property var draggedIndex: 0 

width: parent.width/3; height:width 
color:"blue" 
Drag.active: dragArea.drag.active 
Drag.keys: [ "KEY_A" ] 

MouseArea { 
    id: dragArea 
    anchors.fill: parent 
    drag.target: icon 
    cursorShape: drag.active ? Qt.ClosedHandCursor : Qt.OpenHandCursor 
     onReleased: { 
      console.log("Drag: " + cells.draggedItemIndex) 
      if (cells.draggedItemIndex != icon.draggedIndex) { 
       icon.draggedIndex = cells.draggedItemIndex 
       cells.draggedItemIndex = -1 
      } 
      icon.x = cells.itemAt(icon.draggedIndex).x 
      icon.y = cells.itemAt(icon.draggedIndex).y 
     } 
    } 
} 
} 

Answer 1

Sie haben die Drag Attached-Eigenschaft, die die hotSpot -property vom Typ PointF hat.

Setzen Sie diese Eigenschaft auf Qt.point(width/2, height/2)