src/qml/HeaderSearchBar.qml

0001 /*
0002  * SPDX-FileCopyrightText: 2021 Devin Lin <devin@kde.org>
0003  * SPDX-License-Identifier: GPL-2.0-or-later
0004 */
0005
0006 import QtQuick 2.15
0007 import QtQuick.Layouts 1.2
0008 import QtQuick.Controls 2.15 as Controls
0009 import org.kde.kirigami 2.19 as Kirigami
0010
0011 Controls.Control {
0012     property var model
0013     property bool show: false
0014
0015     onShowChanged: {
0016         if (show) {
0017             searchField.forceActiveFocus();
0018         } else {
0019             searchField.text = "";
0020         }
0021     }
0022
0023     Kirigami.Theme.colorSet: Kirigami.Theme.Window
0024     Kirigami.Theme.inherit: false
0025
0026     background: Rectangle { color: Kirigami.Theme.backgroundColor }
0027
0028     Layout.preferredHeight: height
0029     height: show ? implicitHeight : 0
0030     opacity: show ? 1 : 0
0031
0032     Behavior on height {
0033         NumberAnimation {
0034             duration: Kirigami.Units.longDuration
0035             easing.type: Easing.InOutQuad
0036         }
0037     }
0038     Behavior on opacity {
0039         NumberAnimation {
0040             duration: Kirigami.Units.longDuration
0041             easing.type: Easing.InOutQuad
0042         }
0043     }
0044
0045     leftPadding: Kirigami.Units.largeSpacing
0046     rightPadding: Kirigami.Units.largeSpacing
0047     topPadding: Kirigami.Units.largeSpacing
0048     bottomPadding: Kirigami.Units.largeSpacing
0049
0050     contentItem: Kirigami.SearchField {
0051         id: searchField
0052         autoAccept: true
0053         onAccepted: model.filterString = searchField.text
0054     }
0055
0056     Kirigami.Separator {
0057         anchors.left: parent.left
0058         anchors.right: parent.right
0059         anchors.bottom: parent.bottom
0060     }
0061 }