JSONListModel

From Qt Wiki
Revision as of 08:56, 25 February 2015 by Maintenance script (talk | contribs)
Jump to navigation Jump to search
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

JSONListModel is a pure-QML component that allows using JSON data as datasource for a QML ListView.

Code

The JSONListModel code is Open Source and available under the MIT license at:

"github.com/kromain/qml-utils":https://github.com/kromain/qml-utils

Features

  • mimics the XMLListModel component by providing similar API and properties
  • supports both source-based and string-based JSON data
  • support complex JSON documents and queries via JSONPath (XPath for JSON)

Example

With a file jsonData.txt containing:

{ "store": {
 "book": [
 { "category": "reference",
 "author": "Nigel Rees",
 "title": "Sayings of the Century",
 "price": 8.95
 },
 { "category": "fiction",
 "author": "Evelyn Waugh",
 "title": "Sword of Honour",
 "price": 12.99
 },
 { "category": "fiction",
 "author": "Herman Melville",
 "title": "Moby Dick",
 "isbn": "0-553-21311-3",
 "price": 8.99
 },
 { "category": "fiction",
 "author": "J. R. R. Tolkien",
 "title": "The Lord of the Rings",
 "isbn": "0-395-19395-8",
 "price": 22.99
 }
 ],
 "bicycle": {
 "color": "red",
 "price": 19.95
 }
 }
}

We can write:

 JSONListModel {
 id: jsonModel1
 source: "jsonData.txt"
 // All books in the store object
 query: "$.store.book[*]"
 }

JSONListModel {
 id: jsonModel2
 source: "jsonData.txt"
 // Books less than $10
 query: "$..book[?(@.price<10)]"
 }

JSONListModel {
 id: jsonModel3
 json: '[  {"label": "Answer", "value": "42"},  {"label": "Pastis", "value": "51"},  {"label": "Alsace", "value": "67"},  {"label": "Alsace", "value": "68"}  ]'
 // Labels starting with 'A'
 query: "$[?(@.label.charAt(0)==='A')]"
 }

And use it in views and delegates like this:

 ListView {
 model: jsonModel1.model

delegate: Component {
 Text {
 // Can be any of the JSON properties: model.author, model.price, etc.
 text: model.title
 }
 }