How to animate a message that appears on bottom?

Question

I'm showing a message on the bottom:

Msg.qml

import QtQuick 2.4

Item {
    property alias text: mf.text
    anchors.fill: parent
    antialiasing: false
    opacity: 0.9
    z: 100

    MsgForm {
        id: mf
        width: parent.width
        y: parent.height - height - 5
    }
}

MsgForm.ui.qml

import QtQuick 2.4

Item {
    property alias text: msg.text

    width: 200

    id: message
    height: msg.height+10

    Rectangle {
        id: rectangle
        color: "#fb9191"
        anchors.fill: parent
        border.color: "#fd6666"
        border.width: 2

        Text {
            id: msg
            anchors.top: parent.top
            anchors.topMargin: 2
            textFormat: Text.PlainText
            anchors.right: parent.right
            anchors.rightMargin: 4
            anchors.left: parent.left
            anchors.leftMargin: 4
            wrapMode: Text.WordWrap
            clip: false
            font.bold: true
            font.pointSize: 12
            font.family: "Tahoma"
        }
    }
}

How can I animate the form to appear from the bottom smoothly? After the animation, if the window resizes, the message must stay always on the bottom.

Answer 1

Thanks everyone. In the end I've solved the issue by following advices received in the qtcentre forum.

The desired effect can be achieved easily by defining a local numerical property that is use to bind to either an anchors.XXXXmargin or the y property expression.

Following this approach a possible solution is the following:

MsgForm {
    property bool showing: false
    property int position: showing ? height : 0
    width: parent.width
    y: parent.height - position
    Behavior on position {
        NumberAnimation {duration: 500}
    }   
}