[Solved]Problem in QML sate transition when moving multiple images.

[pramod.s]

I have two rectangle and two images.
Rectangle 1 id "rectgreen" is at postion P1 (x,y) and a image " imagegreen" at same postion.
Rectangle 2 id "rectred" is at postion P2 (x,y) and a image " imagered" at same postion.

On click of rectangle 1 id "rectgreen" I am moving the image "imagegreen" 300 pixel right , say P1(x+300,y) using state and transition .This works fine when I change state onclick event of rectgreen.

On click of rectangle 2 id "rectred" I am moving the image "imagered" 300 pixel right , say P2(x+300,y) using state and transition.But when change the state on Click event of "rectred" the redimage move to right* but at the same time "imagegreen" move back to its original position P1 (x,y) *though I am not doing any operation on "imagegreen" while I click on redrect.

Please suggest if I am missing any thing or need to be take any other approach ,( or a QML bug ?).
Code snippet below
////////
@

import QtQuick 2.0

Rectangle {
id:page;width: 660;height: 660
Rectangle {
id:rectgreen;width: 50;height: 50;color:"yellow";x: 20;y:300
MouseArea {
anchors.fill: parent;
onClicked:page.state = 'stategreenToRight'
}
}
Rectangle {
id:rectred;width: 50;height: 50;color:"yellow";x: 20;y:400;
MouseArea {
anchors.fill: parent;
onClicked: page.state = 'stateredToRight'
}
}

Image {
    id: imagegreen;x: 20;y:300;width: 50;height: 50;source: "green.png"
}
Image {
    id: imagegred;x: 20;y:400;width: 50;height: 50;source: "red.png"
}

states: [
    // In state 'stategreenToRight', move green image to  right 300 px
    State {
        name: "stategreenToRight"
        PropertyChanges { target: imagegreen; x: rectgreen.x +300; y: rectgreen.y }
    },
    // In state 'stateredToRight', move red  image to right 300 px
    State {
        name: "stateredToRight"
        PropertyChanges { target: imagegred; x: rectred.x + 300; y: rectred.y }
    }
]

transitions: [
    Transition {
        from: "*"; to: "stategreenToRight"
        NumberAnimation { properties: "x,y"; easing.type: Easing.OutBounce; duration: 1000 }
    },
    Transition {
        from: "*"; to: "stateredToRight"
        NumberAnimation { properties: "x,y"; easing.type: Easing.OutBounce; duration: 1000 }
    }
]

}

@

[xenotrax]

This shoud do the job..
@
import QtQuick 2.0
import QtQuick.Window 2.1

Window
{
visible: true
width: 709
height: 1024

Rectangle {
    id:page;width: 660;height: 660
    Rectangle {
        id:rectgreen;width: 64;height: 64;color:"yellow";x: 20;y:300
        MouseArea {
            anchors.fill: parent;
            onClicked:rectgreen.state = 'stategreenToRight'
        }
        states: [
            // In state 'stategreenToRight', move green image to  right 300 px
            State {
                name: "stategreenToRight"
                PropertyChanges { target: imagegreen; x: rectgreen.x +300; y: rectgreen.y }
            }
        ]
        
        transitions: [
            Transition {
                from: "*"; to: "stategreenToRight"
                NumberAnimation { properties: "x,y"; easing.type: Easing.OutBounce; duration: 1000 }
            }
        ]
    }
    Rectangle {
        id:rectred;width: 64;height: 64;color:"yellow";x: 20;y:400;
        MouseArea {
            anchors.fill: parent;
            onClicked: rectred.state = 'stateredToRight'
        }
        states: [
            // In state 'stateredToRight', move red  image to right 300 px
            State {
                name: "stateredToRight"
                PropertyChanges { target: imagegred; x: rectred.x + 300; y: rectred.y }
            }
        ]
        
        transitions: [
            Transition {
                from: "*"; to: "stateredToRight"
                NumberAnimation { properties: "x,y"; easing.type: Easing.OutBounce; duration: 1000 }
            }
        ]
        
    }
    
    Image {
        id: imagegreen;x: 20;y:300;width: 64;height: 64;source: "red.png" 
    }
    Image {
        id: imagegred;x: 20;y:400;width: 64;height: 64;source: "green.png" 
    }
}

}@

[pramod.s]

Thank you very much "xenotrax" , the solution works fine for me .