Qt wiki will be updated on October 12th 2023 starting at 11:30 AM (EEST) and the maintenance will last around 2-3 hours. During the maintenance the site will be unavailable.
JSONListModel: Difference between revisions
Jump to navigation
Jump to search
AutoSpider (talk | contribs) (Convert ExpressionEngine links) |
mNo edit summary |
||
(5 intermediate revisions by 3 users not shown) | |||
Line 1: | Line 1: | ||
{{ | {{LangSwitch}} | ||
[[Category:Snippets::QML]] | |||
[[Category:Developing with Qt::Qt Quick::QML]] | |||
JSONListModel is a pure-QML component that allows using JSON data as datasource for a QML ListView. | |||
See [https://wiki.qt.io/index.php?title=QJsonModel QJsonModel] for a pure Qt/C++ class based on QAbstractItemModel. | |||
== Code == | == Code == | ||
Line 20: | Line 23: | ||
<code> | <code> | ||
{ "store": { | { "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 | |||
} | |||
} | |||
} | } | ||
</code> | </code> | ||
Line 55: | Line 58: | ||
<code> | <code> | ||
JSONListModel { | |||
id: jsonModel1 | |||
source: "jsonData.txt" | |||
// All books in the store object | |||
query: "$.store.book[*]" | |||
} | |||
JSONListModel { | JSONListModel { | ||
id: jsonModel2 | |||
source: "jsonData.txt" | |||
// Books less than $10 | |||
query: "$..book[?(@.price<10)]" | |||
} | |||
JSONListModel { | 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')]" | |||
} | |||
</code> | </code> | ||
Line 80: | Line 88: | ||
<code> | <code> | ||
ListView { | |||
model: jsonModel1.model | |||
delegate: Component { | delegate: Component { | ||
Text { | |||
// Can be any of the JSON properties: model.author, model.price, etc. | |||
text: model.title | |||
} | |||
} | |||
</code> | </code> | ||
Latest revision as of 21:43, 4 April 2017
En Ar Bg De El Es Fa Fi Fr Hi Hu It Ja Kn Ko Ms Nl Pl Pt Ru Sq Th Tr Uk Zh
JSONListModel is a pure-QML component that allows using JSON data as datasource for a QML ListView.
See QJsonModel for a pure Qt/C++ class based on QAbstractItemModel.
Code
The JSONListModel code is Open Source and available under the MIT license at:
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
}
}