Google Suggest Example¶
Obtains the list of search recommendations by the Google search engine.
The example uses the QNetworkAccessManager
to obtain the list of search recommendations by Google as the user types into a QLineEdit
.
The application makes use of the get
function in QNetworkAccessManager
to post a request and obtain the result of the search query sent to the Google search engine. The results returned are listed as clickable links appearing below the search box as a drop-down menu.
The widget is built up by a QLineEdit
as the search box, and a QTreeView
used as a popup menu below the search box.
GSuggestCompletion Class Declaration¶
This class implements an event filter and a number of functions to display the search results and to determent when and how to perform the search.
class GSuggestCompletion(QObject): Q_OBJECT # public GSuggestCompletion = explicit(QLineEdit parent = None) ~GSuggestCompletion() eventFilter = bool(QObject obj, QEvent ev) def showCompletion(choices): slots: = public() def doneCompletion(): def preventSuggest(): def autoSuggest(): def handleNetworkData(networkReply): # private editor = None() popup = None() timer = QTimer() networkManager = QNetworkAccessManager()
The class connects to a QLineEdit
and uses a QTreeWidget
to display the results. A QTimer
controls the start of the network requests that are executed using a QNetworkAccessManager
.
GSuggestCompletion Class Implementation¶
We start by defining a constant containing the URL to be used in the Google queries. This is the basis for the query. The letters typed into the search box will be added to the query to perform the search itself.
gsuggestUrl = QString(QStringLiteral("http://google.com/complete/search?output=toolbarq=%1"))
In the constructor, we set the parent of this GSuggestCompletion instance to be the QLineEdit
passed in. For simplicity, the QLineEdit
is also stored in the explicit editor
member variable.
We then create a QTreeWidget
as a toplevel widget and configure the various properties to give it the look of a popup widget. The widget is populated with the results by Google Suggest API request.
Furthermore, we install the GSuggestCompletion instance as an event filter on the QTreeWidget
, and connect the itemClicked()
signal with the doneCompletion()
slot.
A single-shot QTimer
is used to start the request when the user has stopped typing for 500 ms.
Finally, we connect the networkManagers finished()
signal with the handleNetworkData()
slot to handle the incoming data.
def __init__(self, QObject(parent), editor(parent): popup = QTreeWidget popup.setWindowFlags(Qt.Popup) popup.setFocusPolicy(Qt.NoFocus) popup.setFocusProxy(parent) popup.setMouseTracking(True) popup.setColumnCount(1) popup.setUniformRowHeights(True) popup.setRootIsDecorated(False) popup.setEditTriggers(QTreeWidget.NoEditTriggers) popup.setSelectionBehavior(QTreeWidget.SelectRows) popup.setFrameStyle(QFrame.Box | QFrame.Plain) popup.setHorizontalScrollBarPolicy(Qt.ScrollBarAlwaysOff) popup.header().hide() popup.installEventFilter(self) connect(popup, QTreeWidget.itemClicked, self, GSuggestCompletion::doneCompletion) timer.setSingleShot(True) timer.setInterval(500) connect(timer, QTimer.timeout, self, GSuggestCompletion::autoSuggest) connect(editor, QLineEdit.textEdited, timer, QOverload<>.of(QTimer.start)) connect(networkManager, QNetworkAccessManager.finished, self, GSuggestCompletion::handleNetworkData)
Since the QTreeWidget
popup has been instantiated as a toplevel widget, the destructor has to delete it explicitly from memory to avoid a memory leak.
GSuggestCompletion::~GSuggestCompletion() del popup
The event filter handles mouse press and key press events that are delivered to the popup. For mouse press events we just hide the popup and return focus to the editor widget, and then return true to prevent further event processing.
Key event handling is implemented so that Enter and Return execute the selected link, while the Escape key hides the popup. Since we want to be able to navigate the list of suggestions using the different navigation keys on the keyboard we let Qt continue regular event processing for those by returning false from the eventFilter reimplementation.
For all other keys, the event will be passed on to the editor widget and the popup is hidden. This way the user’s typing will not be interrupted by the popping up of the completion list.
def eventFilter(self, QObject obj, QEvent ev): if (obj != popup) return False if (ev.type() == QEvent.MouseButtonPress) { popup.hide() editor.setFocus() return True if (ev.type() == QEvent.KeyPress) { consumed = False() key = QKeyEvent(ev).key() switch (key) { Qt.Key_Enter: = case() Qt.Key_Return: = case() doneCompletion() consumed = True break Qt.Key_Escape: = case() editor.setFocus() popup.hide() consumed = True break Qt.Key_Up: = case() Qt.Key_Down: = case() Qt.Key_Home: = case() Qt.Key_End: = case() Qt.Key_PageUp: = case() Qt.Key_PageDown: = case() break default: editor.setFocus() editor.event(ev) popup.hide() break return consumed return False
The showCompletion()
function populates the QTreeWidget
with the results returned from the query. It takes a QStringList
of the suggested search terms.
def showCompletion(self, choices): if (choices.isEmpty()) return QPalette pal = editor.palette() color = pal.color(QPalette.Disabled, QPalette.WindowText) popup.setUpdatesEnabled(False) popup.clear() for choice in choices: item = QTreeWidgetItem(popup) item.setText(0, choice) item.setForeground(0, color) popup.setCurrentItem(popup.topLevelItem(0)) popup.resizeColumnToContents(0) popup.setUpdatesEnabled(True) popup.move(editor.mapToGlobal(QPoint(0, editor.height()))) popup.setFocus() popup.show()
A QTreeWidgetItem
is created for each index in the list and inserted into the QTreeWidget
. Finally, we adjust position and size of the popup to make sure that it pops up in the correct position below the editor, and show it.
The doneCompletion()
function, which is called by the event filter when either Enter or Return keys are pressed, stops the timer to prevent further requests and passes the text of the selected item to the editor. We then make the editor
QLineEdit
emit the returnPressed() signal, to which the application can connect to open the respective web page.
def doneCompletion(self): timer.stop() popup.hide() editor.setFocus() item = popup.currentItem() if (item) { editor.setText(item.text(0)) QMetaObject.invokeMethod(editor, "returnPressed")
The autoSuggest()
slot is called when the timer times out, and uses the text in the editor to build the complete search query. The query is then passed to the QNetworkAccessManager
‘s get()
function to start the request.
def autoSuggest(self): str = editor.text() url = gsuggestUrl.arg(str) networkManager.get(QNetworkRequest(url))
The function preventSuggest()
stops the timer to prevent further requests from being started.
def preventSuggest(self): timer.stop()
When the network request is finished, the QNetworkAccessManager
delivers the data received from the server through the networkReply object.
def handleNetworkData(self, networkReply): url = networkReply.url() if (networkReply.error() == QNetworkReply.NoError) { choices = QList() response = QByteArray(networkReply.readAll()) xml = QXmlStreamReader(response) while (not xml.atEnd()) { xml.readNext() if (xml.tokenType() == QXmlStreamReader.StartElement) if (xml.name() == u"suggestion") { str = xml.attributes().value("data") choices << str.toString() showCompletion(choices) networkReply.deleteLater()
To extract the data from the reply we use the readAll()
function, which is inherited from QIODevice
and returns a QByteArray
. Since this data is encoded in XML we can use a QXmlStreamReader
to traverse the data and extract the search result as QStrings, which we can stream into two QStringLists used to populate the popup.
Finally, we schedule the QNetworkReply
object for deletion using the deleteLater
function.
SearchBox Class Declaration¶
The SearchBox class inherits QLineEdit
and adds the protected slot doSearch()
.
A GSuggestCompletion
member provides the SearchBox with the request functionality and the suggestions returned from the Google search engine.
from PySide6.QtWidgets import QLineEdit class GSuggestCompletion(): class SearchBox(QLineEdit): Q_OBJECT # public SearchBox = explicit(QWidget parent = None) slots: = protected() def doSearch(): # private completer = None()
SearchBox Class Implementation¶
The search box constructor instantiates the GSuggestCompletion object and connects the returnPressed() signal to the doSearch() slot.
def __init__(self, parent): QLineEdit.__init__(self, parent) , completer(GSuggestCompletion(self)) connect(self, SearchBox::returnPressed, self, SearchBox::doSearch) setWindowTitle("Search with Google") adjustSize() resize(400, height()) setFocus()
The function doSearch()
stops the completer from sending any further queries to the search engine.
Further, the function extracts the selected search phrase and opens it in the default web browser using QDesktopServices
.
def doSearch(self): completer.preventSuggest() url = gsearchUrl.arg(text()) QDesktopServices.openUrl(url)
© 2022 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.