Uploaded image for project: 'Qt'
  1. Qt
  2. QTBUG-126188

Add SearchField for Qt Quick Controls

    XMLWordPrintable

Details

    • Task
    • Resolution: Unresolved
    • P3: Somewhat important
    • None
    • None
    • Quick: Controls 2
    • None

    Description

      Add a QQuickSearchField to the list of Qt Quick Controls to make it easier to search from a list of items.

      Suggestion

      The search field would derive QQuickTextField, and have an API that supports searching from a list.

      A potential API could look like this: 

      // This implements a QSortFilterProxyModel internally and exposes relevant properties
      // logic
      Q_PROPERTY(QVariant sourceModel READ sourceModel WRITE setSourceModel NOTIFY sourceModelChanged)
      Q_PROPERTY(QVariant filteredModel READ filteredModel WRITE setFilteredModel NOTIFY filteredModelChanged)
      Q_PROPERTY(int filterRole READ filterRole WRITE setFilterRole NOTIFY filterRoleChanged)
      Q_PROPERTY(int sortRole READ sortRole WRIT setSortRole NOTIFY sortRoleChanged) //optional, default to filter role
      Q_PROPERTY(Qt::CaseSensitivity filterCaseSensitivity WRITE setFilterCaseSensitivity NOTIFY filterCaseSensitivityChanged)
      Q_PROPERTY(Qt::CaseSensitivity sortCaseSensitivity WRITE setSortCaseSensitivity NOTIFY sortCaseSensitivityChanged)
      // if auto completion/suggestion should be enabled
      Q_PROPERTY(bool autoSuggest READ autoSuggest WRITE setAutoSuggest NOTIFY autoSuggestChanged FINAL)
      // if the search happens while you type or not
      Q_PROPERTY(bool live READ live WRITE setLive NOTIFY liveChanged)
      
      //visual
      Q_PROPERTY(QQuickItem *searchIndicator READ searchIndicator WRITE setSearchIndicator NOTIFY searchIndicatorChanged FINAL)
      Q_PROPERTY(QQuickItem *clearIndicator READ clearIndicator WRITE setClearIndicator NOTIFY ClearIndicatorChanged FINAL)
      
      Q_SIGNALS:
      void searchTriggered();
      void cleared();
      
      

       

      References

      NSSearchField: https://developer.apple.com/documentation/appkit/nssearchfield
      AutoSuggestBox: https://learn.microsoft.com/en-us/uwp/api/windows.ui.xaml.controls.autosuggestbox?view=winrt-26100

      SearchBox: https://learn.microsoft.com/en-us/uwp/api/windows.ui.xaml.controls.searchbox?view=winrt-26100

      Gtk SearchBar: https://docs.gtk.org/gtk4/class.SearchBar.html

      QCompleter: https://doc.qt.io/qt-6/qcompleter.html
      QComboBox

       

      Plan for PoC

      Try to implement a SearchField with QML

      1. User needs to create a source model (will be in C++ most likely)
      2. Filtering mechanism needs to be applied (e.g. QSFPM). Remains to be seen if QSFPM should be public, but atm it doesn't exist in QML (but is planned).
      3. Visualization of the filtering can be done either by a built-in popup window (with a ListView), or the application can choose to visualize the filtered content themselves in a separate ListView that has its model bound to the SearchField.proxyModel (e.g. SearchField on macOS settings does filtering). Whether the search field should automatically popup a window, can be controlled by a property on search field.
      4. Icons: Search + cancel Icon

       

      Other things to consider:

      1. Can visualization also be inline? (e.g. QCompleter::InlineCompletion)
      2. Keyboard navigation: Does focus need to be transferred from the SearchField to the ListView if e.g. pressing arrow down?

       

      Attachments

        Issue Links

          For Gerrit Dashboard: QTBUG-126188
          # Subject Branch Project Status CR V

          Activity

            People

              dilek Dilek Akcay
              dorisverria Doris Verria
              Votes:
              1 Vote for this issue
              Watchers:
              3 Start watching this issue

              Dates

                Created:
                Updated:

                Gerrit Reviews

                  There is 1 open Gerrit change