Posts Tagged "json"
Ubuntu touch – Comment parser une API JSON dans un ListView
Bonjour à tous, Dans ce petit tutoriel rapide on va voir comment récupérer les données d’une API JSON et de les afficher dans un ListView. Voici un petit exemple du résultat final : Qt fournis déjà une petite feature l XMLListModel qui permet de paser aisément du XML. Malheureusement aucun component ne permet de le faire en JSON. Un peut partout sur le net on trouve des petites bidouilles pour le faire via du javascript. L’utilisation du javascript pure est simple et efficace. Le seul bémol c’est lorsqu’on commence à avoir une API un petit peut compliqué, le code deviens très vite désorganisé. Heureusement, la nature ayant horreur du vide. Un grand merci à Romain Pokrzywka qui nous à préparer un petit component pour parser du JSON : JSONListModel. C’est beaucoup plus propre que d’utiliser du javascript pure. Il suffit de télécharger les fichier JSONListModel.qml et jsonpath.js. Insérer les dans votre projet et le tour est joué. Voici une petite démo d’utilisation: JavaScript import QtQuick 2.0 import Ubuntu.Components 1.1 import Ubuntu.Components.ListItems 1.0 as ListItem /*! \brief MainView with a Label and Button elements. */ MainView { // objectName for functional testing purposes (autopilot-qt5) objectName: "mainView" // Note! applicationName needs to match the "name" field of the click manifest applicationName: "com.ubuntu.developer.username.newapp" /* This property enables the application to change orientation when the device is rotated. The default is false. */ //automaticOrientation: true // Removes the old toolbar and enables new features of the new header. useDeprecatedToolbar: false width: units.gu(100) height: units.gu(75) Page { title: i18n.tr("Morgan Blog - demo") ListView { id: redditList anchors.fill: parent JSONListModel { id: redditFeed source: "http://www.reddit.com/r/Ubuntufr/hot.json" query: "$.data.children[*]" } model: redditFeed.model delegate: ListItem.Subtitled { Component.onCompleted: console.log(model.data.title+"\n"); iconSource: model.data.thumbnail Text { width: parent.width horizontalAlignment: Text.AlignLeft font.pixelSize: 12 color: "black" text: model.data.title } } } } } 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253 import QtQuick 2.0import Ubuntu.Components 1.1import Ubuntu.Components.ListItems 1.0 as ListItem/*! \brief MainView with a Label and Button elements.*/ MainView { // objectName for functional testing purposes (autopilot-qt5) objectName: "mainView" // Note! applicationName needs to match the "name" field of the click manifest applicationName: "com.ubuntu.developer.username.newapp" /* This property enables the application to change orientation when the device is rotated. The default is false. */ //automaticOrientation: true // Removes the old toolbar and enables new features of the new header. useDeprecatedToolbar: false width: units.gu(100) height: units.gu(75) Page { title: i18n.tr("Morgan Blog - demo") ListView { id: redditList anchors.fill: parent JSONListModel { id: redditFeed source: "http://www.reddit.com/r/Ubuntufr/hot.json" query: "$.data.children[*]" } model: redditFeed.model delegate: ListItem.Subtitled { Component.onCompleted: console.log(model.data.title+"\n"); iconSource: model.data.thumbnail Text { width: parent.width horizontalAlignment: Text.AlignLeft font.pixelSize: 12 color: "black" text: model.data.title } } } }} ...
Read MoreComment parser une chaine JSON en ligne de commande
Pour pouvoir parser du JSON avec sont terminal, il vous faudra un petit logiciel bien sympa (qui n’est pas présent dans les dépôts), j’ai nommé : jq Shell wget http://stedolan.github.io/jq/download/linux32/jq (32-bit) wget http://stedolan.github.io/jq/download/linux64/jq (64-bit) chmod +x ./jq sudo cp jq /usr/bin 1234 wget http://stedolan.github.io/jq/download/linux32/jq (32-bit)wget http://stedolan.github.io/jq/download/linux64/jq (64-bit)chmod +x ./jqsudo cp jq /usr/bin Les fichiers binaires de jq sont aussi disponible pour windows et OS X. Le code source est disponible sous licence MIT. Voici une liste d’exemple pour illustré le fonctionnement de jq : $ cat json.txt { "name": "Google", "location": { "street": "1600 Amphitheatre Parkway", "city": "Mountain View", "state": "California", "country": "US" }, "employees": [ { "name": "Michael", "division": "Engineering" }, { "name": "Laura", "division": "HR" }, { "name": "Elise", "division": "Marketing" } ] } 12345678910111213141516171819202122232425 { "name": "Google", "location": { "street": "1600 Amphitheatre Parkway", "city": "Mountain View", "state": "California", "country": "US" }, "employees": [ { "name": "Michael", "division": "Engineering" }, { "name": "Laura", "division": "HR" }, { "name": "Elise", "division": "Marketing" } ]} Pour parser l’objet : cat json.txt | jq '.name' retour : "Google" Pour récupérer un attribut de l’objet : cat json.txt | jq '.location.city' retour Shell "Mountain View" 1 "Mountain View" Pour parser une array : cat json.txt | jq '.employees[0].name' retour : Shell "Michael" 1 "Michael" Pour extraire des champs spécifique : cat json.txt | jq '.location | {street, city}' Shell { "city": "Mountain View", "street": "1600 Amphitheatre Parkway" } 1234 { "city": "Mountain View", "street": "1600 Amphitheatre Parkway"} Voir l’article...
Read More