Kirigami2

SearchField.qml
1 /*
2  * SPDX-FileCopyrightText: 2019 Carl-Lucien Schwan <[email protected]>
3  * SPDX-FileCopyrightText: 2022 Felipe Kinoshita <[email protected]>
4  *
5  * SPDX-License-Identifier: LGPL-2.0-or-later
6  */
7 
8 import QtQuick 2.15
9 import org.kde.kirigami 2.20 as Kirigami
10 
11 /**
12  * @brief This is a standard QtQuick.Controls.TextField following the KDE HIG,
13  * which, by default, uses Ctrl+F as the focus keyboard shortcut
14  * and "Search…" as a placeholder text.
15  *
16  * Example usage:
17  * @code{.qml}
18  * import org.kde.kirigami 2.20 as Kirigami
19  *
20  * Kirigami.SearchField {
21  * id: searchField
22  * onAccepted: console.log("Search text is " + searchField.text)
23  * }
24  * @endcode
25  * @inherit kirigami::ActionTextField
26  */
27 Kirigami.ActionTextField {
28  id: root
29  /**
30  * @brief This property sets whether the accepted signal is fired automatically
31  * when the text is changed.
32  *
33  * Setting this to @c false will require that the user presses return or enter
34  * (similarly to QtQuick.TextInput).
35  *
36  * default: ``true``
37  *
38  * @since KDE Frameworks 5.81
39  * @since org.kde.kirigami 2.16
40  */
41  property bool autoAccept: true
42 
43  /**
44  * @brief This property sets whether to delay automatic acceptance of the search input.
45  *
46  * Set this to @c true if your search is expensive (such as for online
47  * operations or in exceptionally slow data sets) and want to delay it
48  * for 2.5 seconds.
49  *
50  * @note If you must have immediate feedback (filter-style), use the
51  * text property directly instead of accepted()
52  *
53  * default: ``false``
54  *
55  * @since KDE Frameworks 5.81
56  * @since org.kde.kirigami 2.16
57  */
58  property bool delaySearch: false
59 
60  // padding to accommodate search icon nicely
61  leftPadding: if (effectiveHorizontalAlignment === TextInput.AlignRight) {
62  return _rightActionsRow.width + Kirigami.Units.smallSpacing
63  } else {
64  return (activeFocus || root.text.length > 0 ? 0 : (searchIcon.width + Kirigami.Units.smallSpacing)) + Kirigami.Units.smallSpacing * 2
65  }
66  rightPadding: if (effectiveHorizontalAlignment === TextInput.AlignRight) {
67  return (activeFocus || root.text.length > 0 ? 0 : (searchIcon.width + Kirigami.Units.smallSpacing)) + Kirigami.Units.smallSpacing * 2
68  } else {
69  return _rightActionsRow.width + Kirigami.Units.smallSpacing
70  }
71 
72  Kirigami.Icon {
73  id: searchIcon
74  opacity: root.activeFocus || text.length > 0 ? 0 : 1
75  LayoutMirroring.enabled: root.effectiveHorizontalAlignment === TextInput.AlignRight
76  anchors.left: root.left
77  anchors.leftMargin: Kirigami.Units.smallSpacing * 2
78  anchors.verticalCenter: root.verticalCenter
79  anchors.verticalCenterOffset: Math.round((root.topPadding - root.bottomPadding) / 2)
80  implicitHeight: Kirigami.Units.iconSizes.sizeForLabels
81  implicitWidth: Kirigami.Units.iconSizes.sizeForLabels
82  color: root.placeholderTextColor
83 
84  source: "search"
85 
86  Behavior on opacity {
87  NumberAnimation {
88  duration: Kirigami.Units.longDuration
89  easing.type: Easing.InOutQuad
90  }
91  }
92  }
93 
94  placeholderText: qsTr("Search…")
95 
96  Accessible.name: qsTr("Search")
97  Accessible.searchEdit: true
98 
99  focusSequence: StandardKey.Find
100  inputMethodHints: Qt.ImhNoPredictiveText
101  EnterKey.type: Qt.EnterKeySearch
102  rightActions: [
103  Kirigami.Action {
104  //ltr confusingly refers to the direction of the arrow in the icon, not the text direction which it should be used in
105  icon.name: root.effectiveHorizontalAlignment === TextInput.AlignRight ? "edit-clear-locationbar-ltr" : "edit-clear-locationbar-rtl"
106  visible: root.text.length > 0
107  text: qsTr("Clear search")
108  onTriggered: {
109  root.clear();
110  // Since we are always sending the accepted signal here (whether or not the user has requested
111  // that the accepted signal be delayed), stop the delay timer that gets started by the text changing
112  // above, so that we don't end up sending two of those in rapid succession.
113  fireSearchDelay.stop();
114  root.accepted();
115  }
116  }
117  ]
118 
119  Timer {
120  id: fireSearchDelay
121  interval: root.delaySearch ? Kirigami.Units.humanMoment : Kirigami.Units.shortDuration
122  running: false; repeat: false;
123  onTriggered: {
124  if (root.acceptableInput) {
125  root.accepted();
126  }
127  }
128  }
129  onAccepted: {
130  fireSearchDelay.running = false
131  }
132  onTextChanged: {
133  if (root.autoAccept) {
134  fireSearchDelay.restart();
135  } else {
136  fireSearchDelay.stop();
137  }
138  }
139 }
QAction * repeat(const QObject *recvr, const char *slot, QObject *parent)
An item that represents an abstract Action.
Definition: Action.qml:14
This file is part of the KDE documentation.
Documentation copyright © 1996-2023 The KDE developers.
Generated on Tue Sep 26 2023 04:05:31 by doxygen 1.8.17 written by Dimitri van Heesch, © 1997-2006

KDE's Doxygen guidelines are available online.