Kirigami2

Card.qml
1 /*
2  * SPDX-FileCopyrightText: 2018 Marco Martin <[email protected]>
3  *
4  * SPDX-License-Identifier: LGPL-2.0-or-later
5  */
6 
7 import QtQuick 2.6
8 import QtQuick.Layouts 1.2
9 import QtQuick.Controls 2.0 as QQC2
10 import org.kde.kirigami 2.12 as Kirigami
11 import "private" as P
12 
13 /**
14  * @brief This is the standard layout of a Card.
15  *
16  * It is recommended to use this class when the concept of Cards is needed
17  * in the application.
18  *
19  * This Card has default items as header and footer. The header is an
20  * image that can contain an optional title and icon, accessible via the
21  * banner grouped property.
22  *
23  * The footer will show a series of toolbuttons (and eventual overflow menu)
24  * representing the actions list accessible with the list property actions.
25  * It is possible even tough is discouraged to override the footer:
26  * in this case the actions property shouldn't be used.
27  *
28  * @inherit org::kde::kirigami::AbstractCard
29  * @since 2.4
30  */
31 Kirigami.AbstractCard {
32  id: root
33 
34  /**
35  * @brief This property holds the clickable actions that will be available in the footer
36  * of the card.
37  *
38  * The actions will be represented by a list of ToolButtons with an optional overflow
39  * menu, when not all of them will fit in the available Card width.
40  *
41  * @property list<org::kde::kirigami::Action> Card::actions
42  */
43  property list<QtObject> actions
44 
45  /**
46  * @brief This property holds hidden actions that will be available in the footer.
47  *
48  * These actions will only be shown in the overflow menu, even when there is enough space.
49  *
50  * @deprecated Use actions with a ``Kirigami.DisplayHint.AlwaysHide`` as displayHint.
51  * @see org::kde::kirigami::DisplayHint
52  * @property list<org::kde::kirigami::Action> hiddenActions
53  * @since 2.6
54  */
55  property alias hiddenActions: actionsToolBar.hiddenActions
56 
57  /**
58  * @brief This grouped property controls the banner image present in the header.
59  *
60  * This grouped property has the following sub-properties:
61  * * ``source: url``: The source for the image. It understands any URL valid for an Image component.
62  * * ``titleIcon: string``: The optional icon to put in the banner, either a freedesktop-compatible
63  * icon name (recommended) or any URL supported by QtQuick.Image.
64  * * ``title: string``: The title for the banner, shown as contrasting text over the image.
65  * * ``titleAlignment: Qt::Alignment``: The alignment of the title inside the image.
66  * default: ``Qt.AlignTop | Qt.AlignLeft``
67  * * ``titleLevel: int``: The Kirigami.Heading level for the title, which controls the font size.
68  * default: ``1``, which is the largest size.
69  * * ``titleWrapMode: QtQuick.Text::wrapMode``: Whether the header text should be able to wrap.
70  * default: ``Text.NoWrap``
71  *
72  * It also has the full set of properties that QtQuick.Image has, such as sourceSize and fillMode.
73  *
74  * @see org::kde::kirigami::private::BannerImage
75  * @property Image banner
76  */
77  readonly property alias banner: bannerImage
78 
79 
80  header: P.BannerImage {
81  id: bannerImage
82  anchors.leftMargin: -root.leftPadding + root.background.border.width
83  anchors.topMargin: -root.topPadding + root.background.border.width
84  anchors.rightMargin: root.headerOrientation === Qt.Vertical ? -root.rightPadding + root.background.border.width : 0
85  anchors.bottomMargin: root.headerOrientation === Qt.Horizontal ? -root.bottomPadding + root.background.border.width : 0
86  //height: Layout.preferredHeight
87  implicitWidth: root.headerOrientation === Qt.Horizontal ? sourceSize.width : Layout.preferredWidth
88  Layout.preferredHeight: (source.toString() !== "" ? width / (sourceSize.width / sourceSize.height) : Layout.minimumHeight) + anchors.topMargin + anchors.bottomMargin
89 
90  readonly property real widthWithBorder: width + root.background.border.width * 2
91  readonly property real heightWithBorder: height + root.background.border.width * 2
92  readonly property real radiusFromBackground: root.background.radius - root.background.border.width
93 
94  corners.topLeftRadius: radiusFromBackground
95  corners.topRightRadius: (root.headerOrientation === Qt.Horizontal && widthWithBorder < root.width) ? 0 : radiusFromBackground
96  corners.bottomLeftRadius: (root.headerOrientation !== Qt.Horizontal && heightWithBorder < root.height) ? 0 : radiusFromBackground
97  corners.bottomRightRadius: heightWithBorder < root.height ? 0 : radiusFromBackground
98  }
99 
100  onHeaderChanged: {
101  if (!header) {
102  return;
103  }
104 
105  header.anchors.leftMargin = Qt.binding(() => -root.leftPadding);
106  header.anchors.topMargin = Qt.binding(() => -root.topPadding);
107  header.anchors.rightMargin = Qt.binding(() => root.headerOrientation === Qt.Vertical ? -root.rightPadding : 0);
108  header.anchors.bottomMargin = Qt.binding(() => root.headerOrientation === Qt.Horizontal ? -root.bottomPadding : 0);
109  }
110 
111  footer: Kirigami.ActionToolBar {
112  id: actionsToolBar
113  actions: root.actions
114  position: QQC2.ToolBar.Footer
115  visible: root.footer === actionsToolBar
116  }
117 }
This file is part of the KDE documentation.
Documentation copyright © 1996-2023 The KDE developers.
Generated on Tue Feb 7 2023 04:14:23 by doxygen 1.8.17 written by Dimitri van Heesch, © 1997-2006

KDE's Doxygen guidelines are available online.