widgets/krunner/KRunnerScreen.qml

0001 /*
0002  *   SPDX-FileCopyrightText: 2014 Aaron Seigo <aseigo@kde.org>
0003  *   SPDX-FileCopyrightText: 2015 Marco Martin <notmart@gmail.com>
0004  *   SPDX-FileCopyrightText: 2021-2023 Devin Lin <devin@kde.org>
0005  *
0006  *   SPDX-License-Identifier: LGPL-2.0-or-later
0007  */
0008
0009 import QtQuick
0010 import QtQuick.Effects
0011 import QtQuick.Controls as Controls
0012 import QtQuick.Layouts
0013
0014 import org.kde.plasma.core as PlasmaCore
0015 import org.kde.plasma.components 3.0 as PlasmaComponents
0016 import org.kde.plasma.extras 2.0 as PlasmaExtras
0017
0018 import org.kde.milou as Milou
0019 import org.kde.kirigami 2.19 as Kirigami
0020
0021 Item {
0022     id: root
0023
0024     function requestFocus() {
0025         queryField.forceActiveFocus();
0026     }
0027
0028     function clearField() {
0029         queryField.text = "";
0030     }
0031
0032     signal requestedClose()
0033
0034     ColumnLayout {
0035         id: column
0036         anchors.fill: parent
0037
0038         Controls.Control {
0039             Layout.fillWidth: true
0040             Layout.maximumWidth: Kirigami.Units.gridUnit * 30
0041             Layout.alignment: Qt.AlignHCenter
0042             Layout.topMargin: Kirigami.Units.gridUnit
0043             Layout.leftMargin: Kirigami.Units.gridUnit
0044             Layout.rightMargin: Kirigami.Units.gridUnit
0045
0046             leftPadding: Kirigami.Units.smallSpacing
0047             rightPadding: Kirigami.Units.smallSpacing
0048             topPadding: Kirigami.Units.smallSpacing
0049             bottomPadding: Kirigami.Units.smallSpacing
0050
0051             background: Item {
0052
0053                 // shadow for search window
0054                 MultiEffect {
0055                     anchors.fill: parent
0056                     source: rectBackground
0057                     blurMax: 16
0058                     shadowEnabled: true
0059                     shadowVerticalOffset: 1
0060                     shadowOpacity: 0.15
0061                 }
0062
0063                 Rectangle {
0064                     id: rectBackground
0065                     anchors.fill: parent
0066                     color: Kirigami.Theme.backgroundColor
0067                     radius: Kirigami.Units.smallSpacing
0068                 }
0069             }
0070
0071             contentItem: RowLayout {
0072                 Item {
0073                     implicitHeight: queryField.height
0074                     implicitWidth: height
0075                     Kirigami.Icon {
0076                         anchors.fill: parent
0077                         anchors.margins: Math.round(Kirigami.Units.smallSpacing)
0078                         source: "start-here-symbolic"
0079                     }
0080                 }
0081                 PlasmaComponents.TextField {
0082                     id: queryField
0083                     Layout.fillWidth: true
0084                     placeholderText: i18n("Search…")
0085                     inputMethodHints: Qt.ImhNoPredictiveText // don't need to press "enter" to update text
0086                 }
0087             }
0088         }
0089
0090         Controls.ScrollView {
0091             Layout.fillWidth: true
0092             Layout.fillHeight: listView.contentHeight > availableHeight
0093
0094             Milou.ResultsListView {
0095                 id: listView
0096                 queryString: queryField.text
0097                 clip: true
0098                 Kirigami.Theme.colorSet: Kirigami.Theme.Window
0099
0100                 highlight: activeFocus ? highlightComponent : null
0101                 Component {
0102                     id: highlightComponent
0103
0104                     PlasmaExtras.Highlight {}
0105                 }
0106
0107                 onActivated: {
0108                     root.requestedClose();
0109                 }
0110                 onUpdateQueryString: {
0111                     queryField.text = text
0112                     queryField.cursorPosition = cursorPosition
0113                 }
0114
0115                 delegate: MouseArea {
0116                     id: delegate
0117                     height: rowLayout.height
0118                     width: listView.width
0119
0120                     onClicked: {
0121                         listView.currentIndex = model.index;
0122                         listView.runCurrentIndex();
0123
0124                         root.requestedClose();
0125                     }
0126                     hoverEnabled: true
0127
0128                     function activateNextAction() {
0129                         queryField.forceActiveFocus();
0130                         queryField.selectAll();
0131                         listView.currentIndex = -1;
0132                     }
0133
0134                     Rectangle {
0135                         anchors.fill: parent
0136                         color: delegate.pressed ? Qt.rgba(255, 255, 255, 0.2) : (delegate.containsMouse ? Qt.rgba(255, 255, 255, 0.05) : "transparent")
0137                         Behavior on color {
0138                             ColorAnimation { duration: Kirigami.Units.shortDuration }
0139                         }
0140                     }
0141
0142                     RowLayout {
0143                         id: rowLayout
0144                         height: Kirigami.Units.gridUnit * 3
0145                         anchors {
0146                             top: parent.top
0147                             left: parent.left
0148                             right: parent.right
0149                             leftMargin: Kirigami.Units.gridUnit
0150                             rightMargin: Kirigami.Units.gridUnit
0151                         }
0152
0153                         Kirigami.Icon {
0154                             Layout.alignment: Qt.AlignVCenter
0155                             source: model.decoration
0156                             implicitWidth: Kirigami.Units.iconSizes.medium
0157                             implicitHeight: Kirigami.Units.iconSizes.medium
0158                         }
0159
0160                         ColumnLayout {
0161                             Layout.fillWidth: true
0162                             Layout.alignment: Qt.AlignVCenter
0163                             spacing: Kirigami.Units.smallSpacing
0164
0165                             PlasmaComponents.Label {
0166                                 id: title
0167                                 Layout.fillWidth: true
0168                                 Layout.leftMargin: Kirigami.Units.smallSpacing * 2
0169                                 Layout.rightMargin: Kirigami.Units.gridUnit
0170
0171                                 maximumLineCount: 1
0172                                 elide: Text.ElideRight
0173                                 text: typeof modelData !== "undefined" ? modelData : model.display
0174                                 color: "white"
0175
0176                                 font.pointSize: Kirigami.Theme.defaultFont.pointSize
0177                             }
0178                             PlasmaComponents.Label {
0179                                 id: subtitle
0180                                 Layout.fillWidth: true
0181                                 Layout.leftMargin: Kirigami.Units.smallSpacing * 2
0182                                 Layout.rightMargin: Kirigami.Units.gridUnit
0183
0184                                 maximumLineCount: 1
0185                                 elide: Text.ElideRight
0186                                 text: model.subtext || ""
0187                                 color: "white"
0188                                 opacity: 0.8
0189
0190                                 font.pointSize: Math.round(Kirigami.Theme.defaultFont.pointSize * 0.8)
0191                             }
0192                         }
0193
0194                         Repeater {
0195                             id: actionsRepeater
0196                             model: typeof actions !== "undefined" ? actions : []
0197
0198                             Controls.ToolButton {
0199                                 icon: modelData.icon || ""
0200                                 visible: modelData.visible || true
0201                                 enabled: modelData.enabled || true
0202
0203                                 Accessible.role: Accessible.Button
0204                                 Accessible.name: modelData.text
0205                                 checkable: checked
0206                                 checked: delegate.activeAction === index
0207                                 focus: delegate.activeAction === index
0208                                 onClicked: delegate.ListView.view.runAction(index)
0209                             }
0210                         }
0211                     }
0212                 }
0213             }
0214         }
0215
0216         MouseArea {
0217             Layout.fillWidth: true
0218             Layout.fillHeight: true
0219
0220             onClicked: root.requestedClose()
0221         }
0222     }
0223 }