Issue with State Transitions

Placeable

In my QML I have the following markup for 2 states & transition that are supposed to expand a rectangle when clicking a toggle button. It only works when expanding the rectangle every time just fine but not when the rectangle goes back to its "original" state (back to textIn), then it just snaps to the values without a transition. What gives?

...

property int animTargetY: 0

Rectangle {
    id: parentContainer
    width:  parent.width
    height: parent.height
    color: model.bgColor
    state: "textIn"

    /* Animations for ParentContainer */
    states: [
        State {
            name: "textOut"
            PropertyChanges {
                target: parentContainer
                y: -animTargetY
                height: parentContainer.parent.height + animTargetY
            }
        },
        State {
            name: "textIn"
            PropertyChanges {
                target: parentContainer
                y: 0
                height: parentContainer.parent.height
            }
        }
    ]
    transitions: [
        Transition {
            from: "textIn"
            to: "textOut"
            NumberAnimation { target: parentContainer; properties: "y,height"; easing.type: Easing.OutExpo; duration: 500 }
        },
        Transition {
            from: "textOut"
            to: "textIn"
            NumberAnimation { target: parentContainer; properties: "y,height"; easing.type: Easing.InExpo; duration: 500; }
        }
    ]
}

Rectangle {
    color: "#FFFFFF"
    width: 150
    height 50

    MouseArea {
        anchors.fill: parent
        onClicked: {
            var diff = (textContainer.height - solutionTextRect.height) + 10;
            animTargetY = diff;
            parentContainer.state = parentContainer.state == 'textOut' ? 'textIn' : 'textOut';
            console.log("Current State: " + parentContainer.state);
        }
    }
}

[Moved to Qt Quick ~kshegunov]

Placeable

Found out that as soon as I animated the height with Transition it would just snap instantly, dunno why. But I changed the QML to this, using Behaviors instead and now it works:

 states: [
    State {
        name: "textOut"
        PropertyChanges {
            target: parentContainer
            y: -animTargetY
            height: parentContainer.parent.height + animTargetY
        }
    }
]
Behavior on height {
   NumberAnimation { easing.type: Easing.InOutQuad; duration: 400 }
}

Behavior on y {
   NumberAnimation { easing.type: Easing.InOutQuad; duration: 400 }
}