opaque/Button.qml

import QtGraphicalEffects 1.0
import QtQuick 2.7
import QtQuick.Controls 2.4
import QtQuick.Controls.Material 2.0
import QtQuick.Layouts 1.3

import "theme"
import "fonts"

Rectangle {
    id: button
    width: tm.width + (icon == undefined || icon == "" ? 0 : iconSize) + 2 * Theme.paddingClickTarget + 2 * radius
    Layout.minimumWidth: width
    Layout.maximumWidth: width
    height: 2 * Theme.paddingClickTarget + Math.max(tm.height, (icon == undefined || icon == "" ? 0 : iconSize))
    Layout.minimumHeight: height
    Layout.maximumHeight: height
    property color inactiveColor: Theme.defaultButtonColor
    property color activeColor: Theme.defaultButtonActiveColor
    property color textColor: Theme.defaultButtonTextColor
    color: mousedown ? activeColor : inactiveColor
    border.color:  mousedown ? activeColor : inactiveColor
    border.width: 1
    radius: height / 2
    antialiasing: true

    property bool checked: false
    property alias text: buttonText.text
    property alias font: buttonText.font.family
    property string icon
    property int iconSize: Theme.uiIconSizeS
    property bool mousedown
    property string tooltip
    signal clicked

    RowLayout {
        anchors.centerIn: parent
        spacing: Theme.paddingSmall

        Image {
            id: ico
            source: icon!="" ? gcd.assetPath + "core/"+icon+".webp" : "";
            visible: icon != ""
            height: button.iconSize
            sourceSize.height: button.iconSize

            ColorOverlay{
                id: iconColorOverlay
                color: textColor
                anchors.fill: ico
                source: ico
                antialiasing: true
                smooth: true
            }
        }



        Label {
            id: buttonText
            font.family: Fonts.applicationFontRegular.name
            font.styleName: "ExtraBold"
            font.pointSize: Theme.textMediumPt
            color: button.textColor
            visible: button.text != "" && button.text != undefined
        }

        TextMetrics {
        	id: tm
        	font: buttonText.font
        	text: buttonText.text
        }

        ToolTip.visible: tooltip != "" && mouseArea.containsMouse
        ToolTip.text: tooltip
    }


    MouseArea {
        id: mouseArea
        anchors.fill: parent

        onClicked: {
            parent.focus = true
            parent.clicked()
        }

        onPressed: mousedown = true

        onReleased: mousedown = false

        hoverEnabled: true
    }

    Keys.onSpacePressed: clicked()
}