contents/ui/Header.qml

0001 /*
0002  * SPDX-FileCopyrightText: 2019 Fabian Riethmayer <fabian@web2.0-apps.de>
0003  *
0004  * SPDX-License-Identifier: GPL-2.0-only OR GPL-3.0-only OR LicenseRef-KDE-Accepted-GPL
0005  */
0006
0007 import QtQuick 2.15
0008 import QtQuick.Controls 2.15
0009 import QtQuick.Layouts 1.15
0010
0011 import org.kde.plasma.extras 2.0 as PlasmaExtras
0012 import org.kde.plasma.components 3.0 as PlasmaComponents3
0013 import org.kde.kirigami as Kirigami
0014 import Qt5Compat.GraphicalEffects
0015
0016 Control {
0017     id: root
0018     clip: true
0019     default property alias contentItems: content.children
0020
0021     property var source
0022     property var backgroundSource
0023
0024     background: Item {
0025         // Background image
0026         Image {
0027             id: bg
0028             width: root.width
0029             height: root.height
0030             source: root.backgroundSource
0031         }
0032
0033         FastBlur {
0034             id: blur
0035             source: bg
0036             radius: 48
0037             width: root.width
0038             height: root.height
0039         }
0040         ColorOverlay {
0041             width: root.width
0042             height: root.height
0043             source: blur
0044             color: "#66808080"
0045         }
0046         Rectangle {
0047             id: strip
0048             color: "#66F0F0F0"
0049             anchors.bottom: parent.bottom;
0050             height: 2 * Kirigami.Units.gridUnit
0051             width: parent.width
0052             visible: children.length > 0
0053         }
0054     }
0055     bottomPadding: strip.children.length > 0 ? strip.height : 0
0056
0057     // Container for the content of the header
0058     contentItem: Kirigami.FlexColumn {
0059         id: contentContainer
0060
0061         maximumWidth: Kirigami.Units.gridUnit * 30
0062
0063         RowLayout {
0064             Layout.fillHeight: true
0065             Layout.topMargin: Kirigami.Units.gridUnit
0066             Layout.bottomMargin: Kirigami.Units.gridUnit
0067
0068             Kirigami.Icon {
0069                 id: img
0070                 source: root.source
0071                 Layout.fillHeight: true
0072                 Layout.preferredWidth: height
0073             }
0074             ColumnLayout {
0075                 id: content
0076                 Layout.alignment: Qt.AlignBottom
0077                 Layout.leftMargin: Kirigami.Units.gridUnit
0078             }
0079         }
0080     }
0081 }