Discussion :

[yan]

L'export en QML depuis Photoshop et GIMP devient possible
Grâce à des scripts de Nokia

Mise à jour du 19/10/2010, par yan et dourouc05


C'est bien connu, les graphistes n'aiment que Photoshop. Alors, comment va-t-on simplifier le travail avec eux ?

Nokia a la réponse : l'export en QML depuis Photoshop et le GIMP.

Il ne s'agit que de scripts à ajouter aux applications pour transformer des images en fichiers QML avec des images ou du texte pour chaque calque d'origine.

En pratique, cela fonctionne de cette manière :

Vous pouvez obtenir le code pour Photoshop et pour le GIMP, pour ceux qui n'ont pas accès à Photoshop mais seulement à son alternative libre. Ce n'est pas encore parfait mais déjà utilisable.

Source : http://labs.qt.nokia.com/2010/10/19/...shop-and-gimp/

Que pensez-vous que cela pourrait apporter aux designers d'interfaces graphiques ?



MAJ : 7 mai 2010

La première bêta de Qt 4.7 de QtCreator 2.0 viens de sortir
http://www.developpez.net/forums/d82...ator-2-0-beta/
Les nouveautés majeusr est toujours l'intégration de Qt QUick dans la 4.7, mais aussi un editeur graphic de qml dans QtCreator pour exploiter cette nouvelle technologie

http://labs.trolltech.com/blogs/2010...-beyond-quick/

Une petite vidéo de Qt QUick, ça fait longtemps

et une avec l'éditeur dans QtCreator

[Mise à jour :La première version Tech-preview est sortie qui intègre Qt Quick
http://www.developpez.net/forums/d82...tor-2-0-alpha/
un binaire pour visual 208 est disponible :
http://www.developpez.net/forums/d80...n/#post5059594

Mise à jour : une version des Declarative UI est sortie pour Qt 4.6, son API est considérée comme stable. [/B]

[B]Plus de détails : sur les Qt Labs ou sur le forum.

Je pense que la plupart d'entre vous ont entendu parler de QML ou de declarative UI, mais sans vraiment trop savoir de quoi ça parle.

Je vais essayer de résumer.

L'architecture "widget" est une architecture robuste et structurée qui a fait ses preuves. Mais cette architecture est peu flexible, peu adaptée aux composants non rectangulaires et aux animations. Qui fournit donc des IHM très statiques.

Seulement, le besoin change. Et à quoi devrait ressembler une IHM dans le futur pour vous ? Sûrement à des IHM vivantes avec une plus grande interaction avec l'utilisateur avec des petits effets visuels. Le meilleur exemple son les téléphones mobiles et leurs interfaces de plus en plus attractives.

Il suffit de regarder l'interface de l'iPhone, Androïd, HTC et compagnie. Rien à voir avec les logiciels d'aujourd'hui. Tout est en mouvement : on zoome, on fait des rotations... On exploite le stylet, le doigt, la luminosité ambiante, l'orientation de l'appareil...
L'application de visualisation de photo de l'iPhone est un très bon exemple.
Et bien sûr, la mode commence à s'étendre sur les PC.

En gros voilà declarative UI est un projet R&D de Nokia sur le développement de ces IHM, et QML un langage pour exprimer de manière lisible (par un humain) ces IHM.

Voici deux vidéos très intéressantes :

• La première est sur leur moteur de rendu QGraphics :

Advanced Graphics Programming with Qt

• La deuxième sur les futures interfaces sur mobile (mais ça reste valide pour un PC) :

New user interface paradigms on mobile devices


Pour être plus clair, voici quelques vidéos en plus :

• Deux démonstrations utilisant QGraphics et QtAnimation. Et donc ce qui sera déjà possible avec Qt 4.6 :

YouTube- Qt Kinetic Animated Tiles Example

YouTube- TubeWiz: Unleashing the power of Qt for S60

• Deux démonstrations utilisant QML et du javascript. Montrant ses premières possibilités

YouTube- QML Same Game Demo
YouTube- QML flickr browser demo

De plus, Developpez.com met des binaires précompilés de Qt à votre disposition. Dans les quel vous trouverez une version compilée pour visual 2008 SP1 de la branche kinetic-declarative-ui et donc voir à quoi cela va ressembler et bien sûr de jouer avec

Des binaires Qt à disposition !

Et vous que pensez-vous de tout cela ? Vous êtes pour ? Contre ? Des remarques positives ou négatives?

Voir aussi : Le forum Qt, les cours et tutoriels Qt, et la FAQ Qt.

[LittleWhite]

Cela à l'air super bien ( vu les videos ), mais est ce que ce sera si facile à mettre en place, je veux dire, est ce que c'est facile de faire des trucs très beaux, très rapidement très simplement :p

[yan]

Cela à l'air super bien ( vu les videos ), mais est ce que ce sera si facile à mettre en place, je veux dire, est ce que c'est facile de faire des trucs très beaux, très rapidement très simplement :p

Je trouve que c'est prometteur. Par exemple, la démo SameGame est composé de 127 lignes de QML et 207 lignes de Javascript pour la partie logique du jeux.
http://labs.trolltech.com/blogs/2009...e-ui-samegame/

Après, je pense qu'il y as un temps d'adaptation. C'est une nouvelle philosophie et faut voir comment elle va évoluer vers sa version finale. Mais n"hésite pas a regarder les binaire que l'on fournie. Pour jouer avec qml, tu n'as pas besoin de faire de compilation. Tu trouvera l'outils qmlviewer dans le répertoire bin, qui te permet de lancer les démo et les exemples.

[Niak74]

Vivement que la 4.6 arrive, je sens que mes applications vont prendre un bon coup de jeune.

[yan]

La seule chose qui me gêne, c'est que je ne comprend pas trop comment les layout pourront coexister... Pourtant y as déjà une démo :

[entreprise38]

Salut,

ce que je trouve dommage, c'est de mettre en avant des animations facilement réalisables avec pas mal de technologies actuelles, genre Java, Flash, dès lors que l'on maîtrise le langage et que l'on a pondu son premier Tetris .

S'il doit y avoir révolution, ce sera plutôt grâce à ce fameux langage QML.
Des infos là dessus ? Y'aura t-il moyen d'avoir des ponts QML>=>Java, <=>.Net, etc, hormis QT (bon en même temps c'est Nokia hein... ^^) ?

[yan]

S'il doit y avoir révolution, ce sera plutôt grâce à ce fameux langage QML.
Des infos là dessus ?

Y a déjà plein d'exemple et une doc. Tu peux soit télécharger les binaire que l'on propose soit sur les sources sur le git http://qt.gitorious.org/+qt-kinetic-...-declarativeui

Y'aura t-il moyen d'avoir des ponts QML>=>Java, <=>.Net, etc, hormis QT (bon en même temps c'est Nokia hein... ^^) ?

Je sais pas.

[eclesia]

Juste une nouveauté flashy, rien de nouveau et peu d'avenir a mon avis.

[yan]

Juste une nouveauté flashy, rien de nouveau et peu d'avenir a mon avis.

Pourquoi peut d'avenir? Tu pense que la structure widget est la meilleur? ou tu n'en voie pas l'utilité?

[yan]

Pour info, Plasma commence l'intégration de QML pour simplifier le développement des plasmoïdes
source

Juste pour dire, que cela avance à grand pas

[MenshaKaine]

Bonjour,

Je me posais une question est-ce que QML est une technologie concurrente de javafx et wpf ?

[yan]

je me posais une question est-ce que QML est une technologie concurrente de javafx et wpf ?

QML serait plutôt un équivalent à XAML de .net
javafx et wpf correspondrais plutôt à QGraphics (il me semble)

[superjaja]

qml serait plutôt un équivalent à xaml de .net
javafx et wpf correspondrais plutôt à QGraphics (il me semble)

Je comprends pas bien car si je ne me trompe pas le XAML sert à décrire l'interface d'un programme WPF.

[yan]

Je comprends pas bien car si je ne me trompe pas le XAML sert à décrire l'interface d'un programme WPF.

Tout comme QML pour Qt. Tu y décrit des objets de l'interface est des animations.

[MenshaKaine]

ok merci,

Ce sont bien des technologies en concurrences.

Je voulais me mettre à regarder ce que pouvais faire javafx mais je vais peut être rester dans le cadre QT, c++ avec QML ...

Je crois que QML est en cours de finalisation non ? il ne doit pas exister de document ou de tutoriel sur le sujet encore ?

[yan]

ok merci,

Ce sont bien des technologies en concurrences.

Je voulais me mettre à regarder ce que pouvais faire javafx mais je vais peut être rester dans le cadre QT, c++ avec QML ...

Je crois que QML est en cours de finalisation non ? il ne doit pas exister de document ou de tutoriel sur le sujet encore ?

Si tu télécharges la version git, y a des examples et peut être que le tutoriel est déjà ajouté.Pour la docs associé, il te suffit de la générer.

[souviron34]

pour info, non seulement des outils comme ça existe depuis longtemps (par exemple tcl/tk : http://www.uppp.free.fr/Tcltk.htm), mais, en ce qui concerne un langage direct d'UI, Motif avait développé un langage (UIL http://linux.die.net/man/5/uil) permettant également ceci il y a presque 20 ans...


Un exemple :

Code UIL :

Sélectionner tout - Visualiser dans une fenêtre à part

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
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
 
 
Module FENETRE_CHOIX_VISUALISATION
 
/*
***********************************************************************
 
----------------- DEFINITION DE CE QU'ON VA VISUALISER --------------
		  ( DERNIERE ACQUISITION OU UNE AUTRE)
 
***********************************************************************
*/
 
	version = 'Version 2.0'
	names = case_sensitive
	objects = {
		   separator	 = gadget ; 
		   label	 = gadget ; 
		   push_button	 = gadget ; 
		  }
 
	include file 'decw$include:DwtAppl.Uil';
 
 
/*
-----------------   PROCEDURES UTILISEES -----------------
*/
 
	procedure
 
		CALLBACKS_CREE_IDENT_OBJET  	( integer ) ;
		CALLBACKS_SELECTION_VISU	( integer ) ;
 
/*
-----------------  VALEURS IMPORTEES ---------------------
*/
 
	value
 
		X_Choix_Visualisation	: imported integer ;
		Y_Choix_Visualisation	: imported integer ;
 
		Y_Titre			: imported integer ;
 
		Titre_Choix_Texte	: imported compound_string ;
		Derniere_Texte		: imported compound_string ;
		Autre_Texte		: imported compound_string ;
 
		Police_Des_Boutons	: imported font ;
 
		Fond_Des_Menus		: imported color ;
		Texte_Des_Menus		: imported color ;
		Fond_Des_Titres		: imported color ;
		Texte_Des_Titres	: imported color ;
		Bord_Des_Boutons	: imported color ;
		Fond_Des_Boutons	: imported color ;
		Eclairage_Des_Boutons	: imported color ;
		Texte_Des_Boutons	: imported color ;
 
/*
-----------------  VALEURS ASSIGNEES AU LANCEMENT --------
*/
 
	identifier
 
		K_Fenetre_Choix_Visualisation ;
		K_Derniere_Acquisition	  ;
		K_Autre_Acquisition ;
 
/*
-----------------  VALEURS LOCALES -----------------------
*/
 
	value
 
		Depart_Col1	: 20 ;
		Largeur_Col1	: 80 ;
		Depart_Y	: 45 ;
		Espace_Ligne	: 25 ;
 
/*
***********************************************************************
 
------------ DEFINITION FENETRE DE SELECTION DERNIERE ACQUISITION -----
		OU NON
 
***********************************************************************
*/
 
	object
 
		FENETRE_DE_CHOIX_VISUALISATION : popup_dialog_box widget {
 
			arguments  {
					x = X_Choix_Visualisation ;
					y = Y_Choix_Visualisation ;
					title = Titre_Choix_Texte ;
					background_color = Fond_Des_Menus ;
					width = 100 ;
					height = 60 ;
					border_width = 1 ;
					units = DwtPixelUnits ;
					style = DwtModal ;
					auto_unmanage = false ;
				   };
 
			controls   {
					label		TITRE_CHOIX_ACQUISITION;
					push_button	DERNIERE ;
					push_button	AUTRE ;
				   };
 
			callbacks  {
	create = procedure CALLBACKS_CREE_IDENT_OBJET (K_Fenetre_Choix_Visualisation);
				   };
 
					    };
 
/*
--------------- DEFINITION TITRE --------------
*/
 
	object
 
		TITRE_CHOIX_ACQUISITION : label widget {
 
			arguments {
					x = 2 ;
					y = Y_Titre ;
					label_label = Titre_Choix_Texte ;
					background_color = Fond_Des_Titres  ;
					foreground_color = Texte_Des_Titres ;
				   };
 
					   };
 
 
/*
------------- DEFINITION BOUTON "DERNIERE ACQUISITION" -----------
*/
 
	object
 
		DERNIERE : push_button widget {
 
			arguments   {
				      x = 2 ;
				      y = Depart_Y  ;
				      label_label = Derniere_Texte ;
				      foreground_color = Texte_Des_Menus ;
				      background_color = Fond_Des_Menus ;
				      highlight_color  = Eclairage_Des_Boutons ;
				      border_width     = 0 ;
				      border_color = Fond_Des_Menus ;
				      shadow = false ;
				    };
 
			callbacks   {
  activate = procedure CALLBACKS_SELECTION_VISU (K_Derniere_Acquisition) ;
				    };
 
				       	     };
 
/*
------------- DEFINITION BOUTON "AUTRE" -----------
*/
 
	object
 
		AUTRE : push_button widget {
 
			arguments   {
				      x = 2 ;
				      y = Depart_Y +  Espace_Ligne ;
				      label_label = Autre_Texte ;
				      foreground_color = Texte_Des_Menus ;
				      background_color = Fond_Des_Menus ;
				      highlight_color  = Eclairage_Des_Boutons ;
				      border_width     = 0 ;
				      border_color = Fond_Des_Menus ;
				      shadow = false ;
				    };
 
			callbacks   {
     activate = procedure CALLBACKS_SELECTION_VISU(K_Autre_Acquisition) ;
				    };
 
				       	     };
 
end module ;

[MenshaKaine]

J'imagine mais j'ai l'impression que ce type de script devient à la mode, peut être à cause des téléphones portables !?

Dans l'industrie, j'ai déjà vu plusieurs projets où l'on gère tout une architecture logicielle à partir de fichier XML et de factories. Je pense que XAML repose la dessus ... ou utilise une "sorte de compilation".

Sinon merci pour la réponse sur git, faut que je m'installe cygwin ...

[Alp]

Il y a probablement un tuto qui sera publié ici sur DVP, mais pas tout de suite, sur QML et son QML Script.

Sinon, en fait, ce dont c'est le plus proche à mes yeux, c'est JavaFX.

[spidermario]

pour info, non seulement des outils comme ça existe depuis longtemps (par exemple tcl/tk : http://www.uppp.free.fr/Tcltk.htm), mais, en ce qui concerne un langage direct d'UI, Motif avait développé un langage (UIL http://linux.die.net/man/5/uil) permettant également ceci il y a presque 20 ans...

Il ne s'agit pas uniquement de langage descriptif d'IHM (les actuels fichiers .ui de Qt se débrouillent), mais avec QML, au vu des démonstrations il ne s'agit pas du tout du même type d'IHM.
Enfin j'imagine que c'est cela, la différence.

Quelle est-elle, en fait ?