Qt Weekly #6: Sorting and filtering a TableView
April 16, 2014 by J-P Nurmi | Comments
The QtQuick Controls TableView offers a variety of ways to provide data. Supported data model types include the traditional QAbstractItemModel derivative models, QObjectList, JS arrays, and even plain numbers. This flexibility imposes an unfortunate limitation that TableView doesn't know how to sort arbitrary data models. TableView merely offers a visual enabler, a sort indicator, and the actual sorting is left to the application. In this blog post, we'll present an example of sorting and filtering a TableView.
The example is based on a QSortFilterProxyModel derivative model. The source model can be any QAbstractItemModel subclass, but the proxy model has been specifically tweaked to be used with QML data models such as ListModel and XmlListModel. The example uses an XmlListModel that loads images from Flickr.
TableView {
id: tableViewsortIndicatorVisible: true
model: SortFilterProxyModel {
id: proxyModel
source: sourceModel.count > 0 ? sourceModel : nullsortOrder: tableView.sortIndicatorOrder
sortCaseSensitivity: Qt.CaseInsensitive
sortRole: sourceModel.count > 0 ?
tableView.getColumn(tableView.sortIndicatorColumn).role : ""filterString: "*" + searchBox.text + "*"
filterSyntax: SortFilterProxyModel.Wildcard
filterCaseSensitivity: Qt.CaseInsensitive
}
}
The above code snippet presents the most relevant parts of the attached example. In order to enable sorting and filtering, it makes the sort indicator visible and sets up property bindings to the appropriate UI elements, and SortFilterProxyModel handles the rest.
Full source code for the example: tablesortfilter.zip.
Qt Weekly is a new blog post series that aims to give your daily Qt usage a boost. Stay tuned for next week's post!
Blog Topics:
Comments
Subscribe to our newsletter
Subscribe Newsletter
Try Qt 6.5 Now!
Download the latest release here: www.qt.io/download.
Qt 6.5 is the latest Long-Term-Support release with all you need for C++ cross-platform app development.
Explore Qt World
Check our Qt demos and case studies in the virtual Qt World
We're Hiring
Check out all our open positions here and follow us on Instagram to see what it's like to be #QtPeople.
Näytä tämä julkaisu Instagramissa.Henkilön Qt (@theqtcompany) jakama julkaisu