一个QML图标按钮控件样式

这个样式在当前项目已经用不到了，删了免得占空间，随便记录一下代码

封装后食用效果更佳：

import QtQuick 2.0

Image {
    id: button1
    // 按钮图标
    property string icon_source: ""
    // 图标下方文字
    property string bottom_text: ""
    // 文字字体属性
    property string font_family: "SinSun"
    property bool font_bold: false
    property real font_pointSize: 9
    // 按钮尺寸
    property real button_width: 64
    property real button_heigth: 48

    source: icon_source

    // 定义信号
    signal clicked

    width: button_width
    height: button_heigth

    // 被点击时按钮变灰
    Rectangle{
        id:shade
        anchors.fill: parent
        color: "black"
        // 不透明度  0透明 1不透明
        opacity: 0
    }
    // 鼠标区域
    MouseArea{
        id:mouse_area
        anchors.fill: parent
        enabled: (button1.visible && button1.enabled)
        onClicked: {
            // 触发 button1 的 clicked 信号
            button1.clicked();
        }
    }
    // 按钮下方文字
    Text {
        id: button_bottom_text
        text: qsTr(bottom_text)
        anchors.top: button1.bottom
        anchors.horizontalCenter: parent.horizontalCenter
        // 字体 、 明显 、 字号
        font.family: font_family
        font.bold: font_bold
        font.pointSize: font_pointSize
    }
    // 状态切换，如果这行报错就注释掉
    state: State{
        name:"pressed"
        // 条件判断，被按压时触发
        when: (mouse_area.pressed === true)
        PropertyChanges {
            // 按钮变灰
            target: shade
            opacity:0.4
        }
    }
}