style/impl/ButtonBackground.qml

0001 /* SPDX-FileCopyrightText: 2020 Noah Davis <noahadvs@gmail.com>
0002  * SPDX-License-Identifier: LGPL-2.1-only OR LGPL-3.0-only OR LicenseRef-KDE-Accepted-LGPL
0003  */
0004
0005 import QtQuick
0006 import QtQuick.Templates as T
0007 import org.kde.kirigami as Kirigami
0008
0009 import "." as Impl
0010
0011 // TODO: Maybe use a loader here one day. Make sure nothing breaks.
0012 // Kirigami ShadowedRectangle doesn't have a gradient property, which could be an issue in some cases
0013 Kirigami.ShadowedRectangle {
0014     id: mainBackground
0015
0016     property T.AbstractButton control: mainBackground.parent
0017
0018     // Segmented button control group properties
0019     property T.ButtonGroup buttonGroup: control.T.ButtonGroup.group
0020     property bool zeroOrLessSpacing: control.parent.hasOwnProperty("spacing") && control.parent.spacing <= 0
0021     property bool isInButtonGroup: Boolean(buttonGroup)
0022     property bool isFirstInButtonGroup: isInButtonGroup && buttonGroup.buttons[0] == control
0023     property bool isLastInButtonGroup: isInButtonGroup && buttonGroup.buttons[buttonGroup.buttons.length-1] == control
0024     property real leftRadius: !isInButtonGroup || (isLastInButtonGroup && zeroOrLessSpacing) ? radius : 0
0025     property real rightRadius: !isInButtonGroup || (isFirstInButtonGroup && zeroOrLessSpacing) ? radius : 0
0026
0027     property color flatColor: Qt.rgba(
0028         Kirigami.Theme.backgroundColor.r,
0029         Kirigami.Theme.backgroundColor.g,
0030         Kirigami.Theme.backgroundColor.b,
0031         0
0032     )
0033     property bool highlightBackground: control.down || control.checked
0034     property bool highlightBorder: control.enabled && control.down || control.checked || control.highlighted || control.visualFocus || control.hovered
0035
0036     radius: Impl.Units.smallRadius
0037     corners {
0038         topLeftRadius: leftRadius
0039         topRightRadius: rightRadius
0040         bottomLeftRadius: leftRadius
0041         bottomRightRadius: rightRadius
0042     }
0043
0044     implicitWidth: implicitHeight
0045     implicitHeight: Impl.Units.mediumControlHeight
0046
0047     visible: !control.flat || control.editable || control.down || control.checked || control.highlighted || control.visualFocus || control.hovered
0048
0049     color: {
0050         if (highlightBackground) {
0051             return Kirigami.Theme.alternateBackgroundColor
0052         } else if (control.flat) {
0053             return flatColor
0054         } else {
0055             return Kirigami.Theme.backgroundColor
0056         }
0057     }
0058
0059     border {
0060         color: {
0061             if (highlightBorder) {
0062                 return Kirigami.Theme.focusColor
0063             } else {
0064                 return Impl.Theme.separatorColor()
0065             }
0066         }
0067         width: Impl.Units.smallBorder
0068     }
0069
0070     Behavior on color {
0071         enabled: highlightBackground
0072         ColorAnimation {
0073             duration: Kirigami.Units.shortDuration
0074             easing.type: Easing.OutCubic
0075         }
0076     }
0077     Behavior on border.color {
0078         enabled: highlightBorder
0079         ColorAnimation {
0080             duration: Kirigami.Units.shortDuration
0081             easing.type: Easing.OutCubic
0082         }
0083     }
0084
0085     SmallBoxShadow {
0086         opacity: control.down ? 0 : 1
0087         visible: !control.editable && !control.flat && control.enabled
0088         radius: mainBackground.radius
0089     }
0090
0091     FocusRect {
0092         id: focusRect
0093         baseRadius: mainBackground.radius
0094         visible: control.visualFocus
0095     }
0096 }