Archives de la catégorie QML trick
Ubuntu touch – Comment parser une API JSON dans un ListView
Posté par morgan dans QML trick, smartphone, ubuntu touch le 18 décembre 2014
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é.
Comment mettre un background à un TextField
Posté par morgan dans QML trick, ubuntu touch le 21 novembre 2014
Bonjour à tous,
aujourd’hui je vous fais découvrir une petite astuce, toute simple pour pouvoir mettre un background à un TextField. Ce petit trick ne casse pas des briques mais ça fais un bon petit aide mémoire.
Il faut préférer l’utilisation d’un « TextField » plutôt qu’un « TextInput« , grâce à cela vous pourrez utiliser « TextFieldStyle » qui permet de personnalisé le TextField.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 |
import QtQuick 2.0 import Ubuntu.Components 1.1 import QtQuick.Controls 1.1 import QtQuick.Controls.Styles 1.1 MainView { id: main width: 400 height: 300 Column { spacing: units.gu(2) anchors.centerIn: parent TextInput { text: "TextInput par defaut" cursorVisible: false width: main.width - units.gu(25) } TextField { placeholderText: "TextField par defaut" width: main.width - units.gu(25) } TextField { placeholderText: "TextField avec background" width: main.width - units.gu(25) text: "TextField avec background" style: TextFieldStyle { textColor: "black" background: Rectangle { radius: 5 color: "orange" implicitWidth: 100 implicitHeight: 24 border.color: "#333" border.width: 1 } } } } } |
Et voici le rendu :
Comment utiliser le système de notification avec qml et unity
Posté par morgan dans Developement, QML trick, Qt, ubuntu le 12 novembre 2014
Comment utiliser le système de notification d’ubuntu (et d’autres distribution) depuis QML ?
Autant que je le sache, il n’existe pas d’API QML pour accéder au système de notification.
Pour éviter d’avoir à créer un plugin C++ pour avoir les notifications sur une application desktop, il est plus simple d’utiliser pyotherside et d’appeler un petit module python pour effectuer le travail.
Pré-requis :
Vous l’aurez compris, il suffit de s’assurer que pyotherside est installé.
D’abbord, assuré vous d’avoir les bon ppa
|
1 2 3 |
sudo add-apt-repository ppa:ubuntu-sdk-team/ppa sudo add-apt-repository ppa:checkbox-dev/ppa sudo apt-get update |
puis lancer l’installation
|
1 |
sudo ap-get install pyotherside |