Kirigami2

DefaultCardBackground.qml
1
2/*
3 * SPDX-FileCopyrightText: 2019 Marco Martin <mart@kde.org>
4 *
5 * SPDX-License-Identifier: LGPL-2.0-or-later
6 */
7import QtQuick
8import org.kde.kirigami as Kirigami
9
10/**
11 * @brief This is the default background for Cards.
12 *
13 * It provides background feedback on hover and click events, border customizability, and the ability to change the radius of each individual corner.
14 *
15 * @inherit org::kde::kirigami::ShadowedRectangle
16 */
17Kirigami.ShadowedRectangle {
18 id: root
19
20//BEGIN properties
21 /**
22 * @brief This property sets whether there should be a background change on a click event.
23 *
24 * default: ``false``
25 */
26 property bool clickFeedback: false
27
28 /**
29 * @brief This property sets whether there should be a background change on a click event.
30 *
31 * default: ``false``
32 */
33 property bool hoverFeedback: false
34
35 /**
36 * @brief This property holds the card's normal background color.
37 *
38 * default: ``Kirigami.Theme.backgroundColor``
39 */
40 property color defaultColor: Kirigami.Theme.backgroundColor
41
42 /**
43 * @brief This property holds the color displayed when a click event is triggered.
44 * @see DefaultCardBackground::clickFeedback
45 */
46 property color pressedColor: Kirigami.ColorUtils.tintWithAlpha(
47 defaultColor,
48 Kirigami.Theme.highlightColor, 0.3)
49
50 /**
51 * @brief This property holds the color displayed when a hover event is triggered.
52 * @see DefaultCardBackground::hoverFeedback
53 */
54 property color hoverColor: Kirigami.ColorUtils.tintWithAlpha(
55 defaultColor,
56 Kirigami.Theme.highlightColor, 0.1)
57
58 /**
59 * @brief This property holds the border width which is displayed at the edge of DefaultCardBackground.
60 *
61 * default: ``1``
62 */
63 property int borderWidth: 1
64
65 /**
66 * @brief This property holds the border color which is displayed at the edge of DefaultCardBackground.
67 */
68 property color borderColor: Kirigami.ColorUtils.linearInterpolation(Kirigami.Theme.backgroundColor, Kirigami.Theme.textColor, Kirigami.Theme.frameContrast)
69
70//END properties
71
72 color: {
73 if (root.parent.checked || (root.clickFeedback && (root.parent.down || root.parent.highlighted)))
74 return root.pressedColor
75 else if (root.hoverFeedback && root.parent.hovered)
76 return root.hoverColor
77 return root.defaultColor
78 }
79
80 radius: Kirigami.Units.cornerRadius
81
82 border {
83 width: root.borderWidth
84 color: root.borderColor
85 }
86 shadow {
87 size: Kirigami.Units.gridUnit
88 color: Qt.rgba(0, 0, 0, 0.05)
89 yOffset: 2
90 }
91
92 // basic drop shadow
93 Rectangle {
94 anchors.left: parent.left
95 anchors.right: parent.right
96 anchors.top: parent.top
97 anchors.topMargin: Math.round(Kirigami.Units.smallSpacing / 4)
98
99 radius: root.radius
100 height: root.height
101 color: Qt.darker(Qt.rgba(Kirigami.Theme.backgroundColor.r, Kirigami.Theme.backgroundColor.g, Kirigami.Theme.backgroundColor.b, 0.6), 1.1)
102 visible: !root.clickFeedback || !root.parent.down
103
104 z: -1
105 }
106}
This file is part of the KDE documentation.
Documentation copyright © 1996-2024 The KDE developers.
Generated on Fri Nov 8 2024 11:57:22 by doxygen 1.12.0 written by Dimitri van Heesch, © 1997-2006

KDE's Doxygen guidelines are available online.