import Qt 4.7

Rectangle {
    id: button
    property alias textInButton: buttonText.text
    property bool checkable: false
    property bool checked: false

    height: 20;
    width: 60;

    signal clicked;
    signal changeCheck;

    function setText(string) { textInButton = qsTr(string); }
    function press() { mouseArea.pressed }

    Keys.onReturnPressed: {
        button.clicked();
        if(checkable){
            button.checked=!button.checked;
            button.changeCheck();
        }
    }

    MouseArea {
        id: mouseArea
        anchors.centerIn: parent;
        width:  parent.width;
        height: parent.height;
        onClicked: {
            button.clicked();
            if(checkable){
                button.checked=!button.checked;
                button.changeCheck();
            }
        }
    }

    Text {
        z:1
        id: buttonText
        width: parent.width;
        anchors.centerIn: parent;
        horizontalAlignment: Text.AlignHCenter
        font.pixelSize: parent.height * .5
        elide: Text.ElideRight;
        style: Text.Sunken; color: "white"; styleColor: "black"; smooth: true
    }

    Image {
        id: image1
        width:  (image1.sourceSize.width*parent.height)/image1.sourceSize.height +1
        height: parent.height
        anchors.left: parent.left
        source: "qrc:/button/buttonLeft.png"
        smooth: true
        fillMode:Image.Stretch
    }

    Image {
        id: image3
        smooth: true
        height: parent.height
        anchors.right: image2.left
        anchors.rightMargin: -1
        anchors.left: image1.right
        anchors.leftMargin: -1
        source: "qrc:/button/buttonCenter.png"
        //fillMode:Image.Stretch
        fillMode: Image.TileHorizontally

    }

    Image {
        id: image2
        smooth: true
        width: (image1.sourceSize.width*parent.height)/image1.sourceSize.height +1
        height: parent.height
        anchors.right: parent.right
        source: "qrc:/button/buttonR.png"
        fillMode:Image.Stretch
    }

    states: [
        State {
            name: "pressed";
            when: ((button.enabled) && (mouseArea.pressed || (button.checkable && button.checked) ) )

            PropertyChanges { target: image1; source: "qrc:/button/buttonLeftPushed.png" }
            PropertyChanges { target: image3; source: "qrc:/button/buttonCenterPushed.png" }
            PropertyChanges { target: image2; source: "qrc:/button/buttonRightPushed.png" }
        },
        State {
            name: "disabled";
            when: (button.enabled == false);

            PropertyChanges { target: image1; source: "qrc:/button/buttonLeftDisabled.png" }
            PropertyChanges { target: image3; source: "qrc:/button/buttonCenterDisabled.png" }
            PropertyChanges { target: image2; source: "qrc:/button/buttonRightDisabled.png" }
        },
        State {
            name: "focused";
            when: (button.enabled && !mouseArea.pressed && button.focus)

            PropertyChanges { target: image1; source: "qrc:/button/buttonLeftFocus.png" }
            PropertyChanges { target: image3; source: "qrc:/button/buttonCenterFocus.png" }
            PropertyChanges { target: image2; source: "qrc:/button/buttonRFocus.png" }
        }

    ]
}