December 1, 2010

SimonJudge SimonJudge
Lab Rat
70 posts

QML and JSON

Page  
1

I want to create a QML model from (downloaded) JSON data. I notice there’s a XMLListModel but no similar mechanism for JSON data. How can I do this?

Thanks

Simon

22 replies

December 1, 2010

Tobias Hunger Tobias Hunger
Mad Scientist
3155 posts

There are several 3rd party JSON libraries that play nicely with Qt. Could using one of those be an option?

December 1, 2010

SimonJudge SimonJudge
Lab Rat
70 posts

I assume you mean Javascript libraries. Is there one you know works ok with Qt?

Thanks

Simon

December 1, 2010

Tobias Hunger Tobias Hunger
Mad Scientist
3155 posts

Actually I was referring to C++ libraries:-)

December 1, 2010

fcrochik fcrochik
Lab Rat
517 posts

I assume there is (or will be) a better way to do all with javascript but if not you can’t find out or wait you can always use the script module on c++ to parse the json output and expose the result to qml as a model.

 Signature 

Certified Specialist & Qt Ambassador Maemo, Meego, Symbian, Playbook, RaspberryPi, Desktop… Qt everywhere!

December 1, 2010

Tobias Hunger Tobias Hunger
Mad Scientist
3155 posts

I am not convinced “all Javascript” is a better way! Javascript is much slower than C++ and with a animation running at 60 frames per second you do not have all that much time to update your state…

December 1, 2010

fcrochik fcrochik
Lab Rat
517 posts

I agree that is will not be the most efficient way but one of the goals for QML must be to make easier for the web developers to start writing qml code.

In theory all that we need is to make a http request that will give us a string and an “evaluateJavascript” function :)

Kidding apart, I would just try to create a qml extension in c++ that would return a “generic” model for any URI. I can only imagine that soon or later “qt” will have to provide a standard implementation for this.

 Signature 

Certified Specialist & Qt Ambassador Maemo, Meego, Symbian, Playbook, RaspberryPi, Desktop… Qt everywhere!

December 1, 2010

Denis Kormalev Denis Kormalev
Lab Rat
1654 posts

I’m agreed with Tobias. I think that I will prefer QAbstractItemModel that will parse JSON (with one of libraries Tobias told about) and use it as model for QML ListView instead of doing all work in JS.

December 1, 2010

Cezary Tomczak Cezary Tomczak
Lab Rat
16 posts

Parsing JSON is easy and no additional libraries are required, you can just use eval(), JSON structure is a valid javascript code, right?

December 1, 2010

Denis Kormalev Denis Kormalev
Lab Rat
1654 posts

Cezary Tomczak, yes, but you need to build model from object you will receive after eval, it will take processor time, not JSON parsing.

December 1, 2010

SimonJudge SimonJudge
Lab Rat
70 posts

Having done some more research, Cezary is correct. While it would be nice to have a JSONListModel, something similar can be achieved using the sample shown at http://bugreports.qt.nokia.com/browse/QTBUG-12117

After other comments it would be useful to know the performance implications of doing this vs doing it in Qt c++

Simon Judge

December 1, 2010

Denis Kormalev Denis Kormalev
Lab Rat
1654 posts

SimonJudge, all depends on your JSON size. If it is not big, than JS way is ok for you. But if it contains a lot of elements, then using c++ will be better.

December 4, 2010

luizpaulo luizpaulo
Lab Rat
2 posts

Hey a good Qt/C++ JSON parser is avaliable with a LGPL licence: http://qjson.sourceforge.net/
Might be what you need.

December 4, 2010

fcrochik fcrochik
Lab Rat
517 posts
luizpaulo wrote:
Hey a good Qt/C++ JSON parser is avaliable with a LGPL licence: http://qjson.sourceforge.net/ Might be what you need.

I saw it when I was working on a simple json parser but decided against it. Depending on the task you can get the same result w/o any additional dependencies – just using the script module.

 Signature 

Certified Specialist & Qt Ambassador Maemo, Meego, Symbian, Playbook, RaspberryPi, Desktop… Qt everywhere!

June 21, 2011

dridk dridk
Lab Rat
48 posts

Hello here is my point of view! I tested everything! XMLModel, javascript XML parser, C++ side parser etc…

  1. Do Not use C++ Json parser : Because exchange data between c++ and QML is slow
  2. Make a Javascript parser ! It’s more easy with eval ! Here is an example :

Json data

  1. {"index":["all"],"flux":{"all":[{"data":{"title":"boris","icon":"icon.png"}]}}

QML side : main.qml

  1. import QtQuick 1.0
  2. import "parser.js" as JS
  3.  
  4. Item {
  5.     id:root
  6.     width: 360
  7.     height: 640
  8.  
  9.     Component.onCompleted: JS.load()
  10.    
  11.  
  12.     ListModel {  id:listModel }
  13.  
  14.     ListView {
  15.         id:view
  16.         anchors.fill:parent
  17.         model : listModel
  18.         delegate: Rectangle {
  19.              width:parent.width
  20.              height:80
  21.              Text {
  22.              anchors.center:parent
  23.              text: title
  24.              }
  25.            
  26.         }
  27.     }
  28.  
  29. }

javascript side : parser.js

  1. function load() {
  2.  
  3.     listModel.clear();
  4.     var xhr = new XMLHttpRequest();
  5.    xhr.open("GET","http://data.json",true);
  6.     xhr.onreadystatechange = function()
  7.     {
  8.         if ( xhr.readyState == xhr.DONE)
  9.         {
  10.             if ( xhr.status == 200)
  11.             {
  12.                 var jsonObject = eval('(' + xhr.responseText + ')');
  13.                 loaded(jsonObject)
  14.             }
  15.         }
  16.     }
  17.     xhr.send();
  18. }
  19.  
  20.  
  21.  
  22. function loaded(jsonObject)
  23. {
  24.     for ( var index in jsonObject.flux.all   )
  25.     {
  26.         listModel.append({
  27.                          "title" : jsonObject.flux.all[index].data["title"],
  28.                          "icon" : jsonObject.flux.all[index].data["icon"]});
  29.     }
  30.  
  31. // get directly the json object. Should work but not tested
  32. //listModel.append({jsonObject.flux.all});
  33.  
  34.  
  35. }

 Signature 

Nothing in Biology Makes Sense Except in the Light of Evolution

June 21, 2011

fcrochik fcrochik
Lab Rat
517 posts

It is a little surprising to me that you found that exchanging data between C++ and QML to be slow.

I can imagine that maybe the C++ xml parser you tried is slow but I can’t imagine creating the model in c++ can be any slower than creating it using Javascript.

Another scenario I can imagine it would slow things is if you are adding elements to a model that is already in use.

I am just curious of the why…

 Signature 

Certified Specialist & Qt Ambassador Maemo, Meego, Symbian, Playbook, RaspberryPi, Desktop… Qt everywhere!

Page  
1

  ‹‹ [bug] Component id cannot start with underscore      QML and Localization ››

You must log in to post a reply. Not a member yet? Register here!