ui/components/ActionButton.qml

0001 // SPDX-FileCopyrightText: 2023 Mathis Brüchert <mbb@kaidan.im>
0002 //
0003 // SPDX-License-Identifier: GPL-2.0-only OR GPL-3.0-only OR LicenseRef-KDE-Accepted-GPL
0004
0005 import QtQuick 2.1
0006 import QtQuick.Controls 2.12 as Controls
0007 import QtQuick.Layouts 1.3
0008 import org.kde.kirigami 2.19 as Kirigami
0009 import org.kde.marknote 1.0
0010
0011 Controls.Button {
0012     id: root
0013
0014     height: 55
0015     width: 55
0016
0017     background: Kirigami.ShadowedRectangle{
0018         Kirigami.Theme.inherit: false
0019         Kirigami.Theme.colorSet: Kirigami.Theme.Window
0020
0021         color: if (parent.down) {
0022             Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.hoverColor, Kirigami.Theme.backgroundColor, 0.6)
0023         } else if (parent.hovered) {
0024             Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.hoverColor, Kirigami.Theme.backgroundColor, 0.8)
0025         } else {
0026             Kirigami.Theme.backgroundColor
0027         }
0028
0029         radius: 10
0030         border {
0031             width: 1
0032             color: if (parent.down){
0033                 Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.hoverColor, Kirigami.Theme.backgroundColor, 0.4)
0034             } else if(parent.hovered){
0035                 Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.hoverColor, Kirigami.Theme.backgroundColor, 0.6)
0036             } else{
0037                 Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.backgroundColor, Kirigami.Theme.textColor, 0.2)
0038             }
0039         }
0040
0041         shadow {
0042             size: 10
0043             xOffset: 2
0044             yOffset: 2
0045             color: Qt.rgba(0, 0, 0, 0.2)
0046         }
0047
0048         Behavior on color {
0049             ColorAnimation {
0050                 duration: Kirigami.Units.longDuration
0051                 easing.type: Easing.OutCubic
0052             }
0053         }
0054
0055         Behavior on border.color {
0056             ColorAnimation {
0057                 duration: Kirigami.Units.longDuration
0058                 easing.type: Easing.OutCubic
0059             }
0060         }
0061     }
0062
0063     contentItem: Item {
0064         Kirigami.Icon {
0065             implicitHeight: Kirigami.Units.gridUnit * 1.2
0066             source: root.icon.name
0067             anchors.centerIn: parent
0068         }
0069     }
0070 }