Adding items to Grid

[mdahamshi]

Hey
I'm working on a homework to implement the STRIPS algorithm.
link to the project STRIPS.
I want a way to copy the objects in the left square (which are small squares 20x20) to the right square as complete objects (object that is 4 small squares should be 80x80 one big square) , so the user can arrange them how he like , and the begin the STRIPS algorithm.

• How can I add rectangle to the Grid from javascript ?
• How to allow drag and drop for these items ?

Thank you

[mdahamshi]

 function addObject(object){

        var theWidth = (Math.abs(object[0].x - object[1].x)+1) * MyScripts.blockSize;
        var theHeight = (Math.abs(object[0].y - object[1].y)+1) * MyScripts.blockSize;
        var theX = (object[0].x < object[1].x ? object[0].x : object[1].x) * MyScripts.blockSize ;
        var theY = (object[0].y < object[1].y ? object[0].y : object[1].y) * MyScripts.blockSize;
        var theColor = MyScripts.getAcolor(object[2] - 3);

        var comp = Qt.createComponent("newBlock.qml");
        var myb = comp.createObject(hisGrid , {"x":theX ,"y": theY,"width":theWidth ,"height":theHeight,"myColor":theColor });


    }

I succeed to do it !
Now the only thing that left is getting the drag and drop part to work.

• How to make the blocks drag-able , and to drop only on the gray small blocks (the blacks are "walls" ) , and to drop it on fixed place (not on half a square) ?

[mdahamshi]

I used the code from this example : Qt drag and drop.
But it didn't work ! The objects drag fine, but don't drop on the required location !
Any help please ?

DropArea {
    id: dragTarget

    property string colorKey : ""
    property alias dropProxy: dragTarget
    property string myColor: "white"

    width: MyScripts.blockSize; height: MyScripts.blockSize;
    keys: [ colorKey ]      // empty. so every color can drop, except for black blocks (walls) it then "black" so no object drop on wall

    Rectangle {
        id: dropRectangle

        anchors.fill: parent
        color: myColor

        states: [
            State {
                when: dragTarget.containsDrag
                PropertyChanges {
                    target: dropRectangle
                    color: "grey"
                }
            }
        ]
    }
}

Item {        //these are created dynamically using Qt.createObject() 
    id: root

    property string colorKey

    MouseArea {
            id: mouseArea

            width: parent.width; height: parent.height
            anchors.centerIn: parent

            drag.target: tile

            onReleased: parent = tile.Drag.target !== null ? tile.Drag.target : root

            Rectangle {
                id: tile

                width: parent.width; height: parent.height
                anchors.verticalCenter: parent.verticalCenter
                anchors.horizontalCenter: parent.horizontalCenter

                color: colorKey

                Drag.keys: [  ]
                Drag.active: mouseArea.drag.active
                Drag.hotSpot.x: 32
                Drag.hotSpot.y: 32
                states: State {
                    when: mouseArea.drag.active
                    ParentChange { target: tile; parent: root }
                    AnchorChanges { target: tile; anchors.verticalCenter: undefined; anchors.horizontalCenter: undefined }
                }

            }
        }
}

[mdahamshi]

I got it to work by setting keys itself instead of setting colorKey to black .
Now I have another problem, when the object drop, it shrink to one small square, although when clicked it restore to the original position with original size.
How can I fix this also how to get the new x,y coordinator after dropping an object ?