Warning, /libraries/kirigami-addons/src/components/FloatingButton.qml is written in an unsupported language. File is not indexed.

0001 // SPDX-FileCopyrightText: 2023 Mathis BrĂ¼chert <mbb@kaidan.im>
0002 // SPDX-FileCopyrightText: 2023 Carl Schwan <carl@carlschwan.eu>
0003 // SPDX-FileCopyrightText: 2023 ivan tkachenko <me@ratijas.tk>
0004 //
0005 // SPDX-License-Identifier: LGPL-2.0-only OR LGPL-3.0-only OR LicenseRef-KDE-Accepted-LGPL
0006 
0007 import QtQuick 2.15
0008 import QtQuick.Layouts 1.15
0009 import QtQuick.Controls 2.15 as QQC2
0010 import QtQuick.Templates 2.15 as T
0011 import org.kde.kirigami 2.20 as Kirigami
0012 
0013 /**
0014  * This component is a button that can be displayed at the bottom of a page.
0015  *
0016  * @code{.qml}
0017  * import QtQuick 2.15
0018  * import QtQuick.Controls 2.15 as QQC2
0019  * import org.kde.kirigami 2.20 as Kirigami
0020  * import org.kde.kirigamiaddons.components 1.0 as KirigamiComponents
0021  *
0022  * Kirigami.ScrollablePage {
0023  *     ListView {
0024  *         model: []
0025  *         delegate: QQC2.ItemDelegate {}
0026  *
0027  *         KirigamiComponents.FloatingButton {
0028  *             anchors {
0029  *                 right: parent.right
0030  *                 bottom: parent.bottom
0031  *             }
0032  *             margins: Kirigami.Units.largeSpacing
0033  *
0034  *             action: Kirigami.Action {
0035  *                 text: "Add new item"
0036  *                 icon.name: "list-add"
0037  *             }
0038  *         }
0039  *     }
0040  * }
0041  * @endcode
0042  *
0043  * @since Kirigami Addons 0.11
0044  */
0045 T.RoundButton {
0046     id: controlRoot
0047 
0048     Kirigami.Theme.colorSet: Kirigami.Theme.Button
0049     Kirigami.Theme.inherit: false
0050 
0051     implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
0052                             implicitContentWidth + leftPadding + rightPadding)
0053     implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
0054                              implicitContentHeight + topPadding + bottomPadding)
0055 
0056     readonly property size __effectiveIconSize: Qt.size(
0057         icon.height > 0 ? icon.height : Kirigami.Units.iconSizes.medium,
0058         icon.width > 0 ? icon.width : Kirigami.Units.iconSizes.medium,
0059     )
0060 
0061     // Property is needed to prevent binding loops on insets
0062     readonly property real __padding: radius === Infinity
0063         ? Math.round(Math.max(__effectiveIconSize.width, __effectiveIconSize.height) * (Math.sqrt(2) - 1))
0064         : Kirigami.Settings.hasTransientTouchInput ? (Kirigami.Units.largeSpacing * 2) : Kirigami.Units.largeSpacing
0065 
0066     // Extra clickable area that adjusts both paddings and insets.
0067     property real margins: 0
0068     property real topMargin: margins
0069     property real leftMargin: margins
0070     property real rightMargin: margins
0071     property real bottomMargin: margins
0072 
0073     // Fit icon into a square bounded by a circle bounded by button
0074     padding: __padding
0075 
0076     topPadding: padding + topMargin
0077     leftPadding: padding + leftMargin
0078     rightPadding: padding + rightMargin
0079     bottomPadding: padding + bottomMargin
0080 
0081     // If user overrides individual padding value, we should adjust background. By default all insets will be 0.
0082     topInset: topMargin
0083     leftInset: leftMargin
0084     rightInset: rightMargin
0085     bottomInset: bottomMargin
0086 
0087     // Set to Infinity to get extra padding for round button style.
0088     radius: Kirigami.Units.largeSpacing
0089 
0090     // Text is not supported anyway
0091     spacing: 0
0092 
0093     hoverEnabled: !Kirigami.Settings.hasTransientTouchInput
0094 
0095     contentItem: Item {
0096         implicitWidth: controlRoot.__effectiveIconSize.width
0097         implicitHeight: controlRoot.__effectiveIconSize.height
0098 
0099         Kirigami.Icon {
0100             anchors.fill: parent
0101             color: controlRoot.icon.color
0102             source: controlRoot.icon.name !== "" ? controlRoot.icon.name : controlRoot.icon.source
0103         }
0104     }
0105 
0106     background: Item {
0107         Kirigami.ShadowedRectangle {
0108             anchors.centerIn: parent
0109             width: Math.min(parent.width, parent.height)
0110             height: width
0111             radius: controlRoot.radius
0112 
0113             shadow {
0114                 size: 10
0115                 xOffset: 0
0116                 yOffset: 2
0117                 color: Qt.rgba(0, 0, 0, 0.2)
0118             }
0119 
0120             border {
0121                 width: 1
0122                 color: if (controlRoot.down || controlRoot.visualFocus) {
0123                     Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.hoverColor, Kirigami.Theme.backgroundColor, 0.4)
0124                 } else if (controlRoot.enabled && controlRoot.hovered) {
0125                     Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.hoverColor, Kirigami.Theme.backgroundColor, 0.6)
0126                 } else {
0127                     Kirigami.ColorUtils.linearInterpolation(Kirigami.Theme.backgroundColor, Kirigami.Theme.textColor, Kirigami.Theme.frameContrast)
0128                 }
0129             }
0130 
0131             color: if (controlRoot.down || controlRoot.visualFocus) {
0132                 Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.hoverColor, Kirigami.Theme.backgroundColor, 0.6)
0133             } else if (controlRoot.enabled && controlRoot.hovered) {
0134                 Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.hoverColor, Kirigami.Theme.backgroundColor, 0.8)
0135             } else {
0136                 Kirigami.Theme.backgroundColor
0137             }
0138 
0139             Behavior on border.color {
0140                 ColorAnimation {
0141                     duration: Kirigami.Units.veryShortDuration
0142                 }
0143             }
0144 
0145             Behavior on color {
0146                 ColorAnimation {
0147                     duration: Kirigami.Units.veryShortDuration
0148                 }
0149             }
0150         }
0151     }
0152 }