src/controls/ListSectionHeader.qml

0001 /*
0002  *  SPDX-FileCopyrightText: 2019 Björn Feber <bfeber@protonmail.com>
0003  *
0004  *  SPDX-License-Identifier: LGPL-2.0-or-later
0005  */
0006
0007 import QtQuick 2.5
0008 import QtQuick.Controls 2.15
0009 import QtQuick.Layouts 1.2
0010 import org.kde.kirigami 2.10 as Kirigami
0011
0012 /**
0013  * @brief A section delegate for the primitive ListView component.
0014  *
0015  * It's intended to make all listviews look coherent.
0016  *
0017  * Example usage:
0018  * @code{.qml}
0019  * import QtQuick 2.5
0020  * import QtQuick.Controls 2.5 as QQC2
0021  *
0022  * import org.kde.kirigami 2.10 as Kirigami
0023  *
0024  * ListView {
0025  *  [...]
0026  *     section.delegate: Kirigami.ListSectionHeader {
0027  *         label: section
0028  *
0029  *         QQC2.Button {
0030  *             text: "Button 1"
0031  *         }
0032  *         QQC2.Button {
0033  *             text: "Button 2"
0034  *         }
0035  *     }
0036  *  [...]
0037  * }
0038  * @endcode
0039  * @inherit kirigami::AbstractListItem
0040  */
0041 Kirigami.AbstractListItem {
0042     id: listSection
0043
0044     /**
0045      * @brief This property sets the text of the ListView's section header.
0046      * @property string label
0047      */
0048     property alias label: listSection.text
0049
0050     /** @internal */
0051     default property alias _contents: rowLayout.data
0052
0053     separatorVisible: false
0054     sectionDelegate: true
0055     hoverEnabled: false
0056
0057     activeFocusOnTab: false
0058
0059     // we do not need a background
0060     background: Item {}
0061
0062     topPadding: Kirigami.Units.largeSpacing + Kirigami.Units.smallSpacing
0063
0064     contentItem: RowLayout {
0065         id: rowLayout
0066         spacing: Kirigami.Units.largeSpacing
0067
0068         Kirigami.Heading {
0069             Layout.fillWidth: rowLayout.children.length === 1
0070             Layout.alignment: Qt.AlignVCenter
0071
0072             opacity: 0.7
0073             level: 5
0074             type: Kirigami.Heading.Primary
0075             text: listSection.text
0076             elide: Text.ElideRight
0077
0078             // we override the Primary type's font weight (DemiBold) for Bold for contrast with small text
0079             font.weight: Font.Bold
0080         }
0081
0082         Kirigami.Separator {
0083             Layout.fillWidth: true
0084             Layout.alignment: Qt.AlignVCenter
0085         }
0086     }
0087 }