ui/StatusDelegate/InteractionButton.qml

0001 // SPDX-FileCopyrightText: 2022 Joshua Goins <josh@redstrate.com>
0002 // SPDX-License-Identifier: GPL-3.0-or-later
0003
0004 import QtQuick
0005 import QtQuick.Layouts
0006 import org.kde.kirigami 2 as Kirigami
0007 import QtQuick.Controls 2 as QQC2
0008
0009 // A specialized button used for the "Favorite", "Boost", and etc buttons on a status
0010 QQC2.AbstractButton {
0011     id: control
0012
0013     required property string iconName
0014     property string interactedIconName
0015
0016     property bool interactable: true
0017     property bool interacted: false
0018     property color interactionColor
0019
0020     required property string tooltip
0021
0022     hoverEnabled: true
0023     activeFocusOnTab: interactable
0024
0025     QQC2.ToolTip.text: control.tooltip
0026     QQC2.ToolTip.visible: hovered && QQC2.ToolTip.text !== ""
0027     QQC2.ToolTip.delay: Kirigami.Units.toolTipDelay
0028
0029     Accessible.name: tooltip
0030
0031     topPadding: Kirigami.Units.smallSpacing
0032     bottomPadding: Kirigami.Units.smallSpacing
0033     leftPadding: Kirigami.Units.smallSpacing
0034     rightPadding: Kirigami.Units.smallSpacing
0035
0036     contentItem: RowLayout {
0037         spacing: Kirigami.Units.smallSpacing
0038
0039         Kirigami.Icon {
0040             id: icon
0041
0042             Layout.preferredWidth: Kirigami.Units.iconSizes.smallMedium
0043             Layout.preferredHeight: Kirigami.Units.iconSizes.smallMedium
0044             Layout.alignment: Qt.AlignHCenter | Qt.AlignVCenter
0045
0046             source: control.interacted ? control.interactedIconName : control.iconName
0047
0048             isMask: true
0049             color: (interactable && (control.hovered || parent.activeFocus)) ? Kirigami.Theme.focusColor : (control.interacted ? control.interactionColor : Kirigami.Theme.textColor)
0050         }
0051
0052         QQC2.Label {
0053             id: label
0054
0055             text: control.text
0056             verticalAlignment: Text.AlignVCenter
0057             visible: control.text
0058             color: Kirigami.Theme.disabledTextColor
0059         }
0060     }
0061
0062     background: Rectangle {
0063         color: control.hovered && control.interactable ? Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.backgroundColor, Kirigami.Theme.textColor, 0.1) : "transparent"
0064         radius: Kirigami.Units.mediumSpacing
0065
0066         Rectangle {
0067             visible: control.visualFocus
0068             radius: parent.radius
0069             color: "transparent"
0070             anchors {
0071                 fill: parent
0072                 margins: -2
0073             }
0074             border {
0075                 width: 2
0076                 color: Kirigami.Theme.focusColor
0077             }
0078         }
0079     }
0080 }