import QtQuick 2.0
Rectangle{
    id: blueButton
    width: mainText.width+2*mm
    height: mainText.height+2*mm
    color:"light blue"
    
    border.color:"grey"
    border.width:1
    radius: mm
    property alias text: mainText.text
    signal clicked
    state:""

    Text{
        id:mainText
        color: "black"
        anchors.centerIn: parent
        width: contentWidth
        height: contentHeight
        font.pixelSize: 3*mm
        text: ""
        }
    MouseArea{
        id:buttonArea
        anchors.fill:parent
        onPressed: blueButton.state="Pressed"
        onReleased: blueButton.state=""
        onClicked: {parent.clicked()}
        }

states: [
    State { name: "Pressed"
       PropertyChanges { target: blueButton; color: "lightsteelblue"} }
    //State { name: "RELEASED" PropertyChanges { target: button; color: "lightsteelblue"} 
    ]
transitions: [
    Transition { to:"*"
        ColorAnimation { target: blueButton; duration: 100} }
    ]
}