Qt筆記-qml-button

qml 自定義按鈕 pushButton

import QtQuick 2.0

Rectangle {
    id: sysbtn

    signal clicked

    property string btnImageCurrent: "qrc:/image/ButtonNormol.png"
    property string btnImageDisable: "qrc:/image/ButtonDisabled.png"
    property string btnImageNormol:  "qrc:/image/ButtonNormol.png"
    property string btnImagePressed: "qrc:/image/ButtonPressed.png"

    property string text: "hello world"


    width: 156;//btnImage.width
    height: 67;//btnImage.height
    color:"#00000000"
    state:"normal"



    MouseArea{
        hoverEnabled: true;
        anchors.fill: parent;
        onPressed:
        {
            if ( sysbtn.state == "normal" )
               sysbtn.state = "pressed"

        }
        onReleased:
        {
            if ( sysbtn.state != "disable" )
            {
                sysbtn.state = "normal"
                sysbtn.clicked()
            }


        }

    }

    Image {
        id: btnImage
        source: btnImageCurrent
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.verticalCenter: parent.verticalCenter
    }

    Text {
        id: m_text
        color: "#ffffff"
        font.pointSize: 14
        font.family: "微軟雅黑"
        text: sysbtn.text
        anchors.horizontalCenter: parent.horizontalCenter
        anchors.verticalCenter: parent.verticalCenter
    }

    states: [
        State {
            name: "normal"
            PropertyChanges {
                target: sysbtn
                btnImageCurrent: btnImageNormol
            }
        },
        State {
            name: "pressed"
            PropertyChanges {
                target: sysbtn
                btnImageCurrent: btnImagePressed
            }
        },
        State {
            name: "disable"
            PropertyChanges {
                target: sysbtn
                btnImageCurrent: btnImageDisable
            }
        }

    ]

}