[Exercice Qt] Color picker, deuxième partie lancée !

Version imprimable

Voir 40 message(s) de cette discussion en une page

24/08/2010, 23h57
dourouc05

Citation:

Envoyé par gbdivers

Bon, allez. Dernier screenshot...

Puisqu'on m'accusait de ne rien faire d'original, voici un colorpicker en 3d (différentes vues) !

Je m'amuse beaucoup avec cet exo :) (mais je vais me faire gronder par dourouc05 et johnlamericain si je retourne pas bosser sur les traductions et autres)

Mouais... Moins convaincu avec celui-là. J'aurais préféré des cônes plus visibles, où on peut vraiment voir que c'est en 3D et pas une vue 2D aplatie grossièrement (on est loin de Crysis, dit autrement). Je suppose que tu peux faire tourner les cônes pour afficher d'autres couleurs ? Selon les trois axes pour afficher tout le spectre rien qu'avec des rotations, non ?

(Bosse sur ce que tu veux, tant que tu bosses ; moi, j'y vois pas d'inconvénient !).
24/08/2010, 23h58
yan

C'est en Qml?

Tu sait si on peut créé une image avec JS et l'utiliser comme source dans qml?
25/08/2010, 00h06
gbdivers

Citation:

J'aurais préféré des cônes plus visibles, où on peut vraiment voir que c'est en 3D et pas une vue 2D aplatie grossièrement (on est loin de Crysis, dit autrement). Je suppose que tu peux faire tourner les cônes pour afficher d'autres couleurs ? Selon les trois axes pour afficher tout le spectre rien qu'avec des rotations, non ?

pfff, je me doutais qu'il y en aurait 1 qui allait me dire que c'est pas de la vrai 3D :)
Le problème est que si j'essaie de faire de la vrai 3D (un cône, avec des ombres, des textures, des super armes et qui conduit une Chevrolet dans New-York), on ne voit plus grand chose et le picking est un peu plus compliqué (là, je récupère simplement l'image 2D et je fais le picking dessus)

Citation:

C'est en Qml?
Tu sait si on peut créé une image avec JS et l'utiliser comme source dans qml?

Je viens juste de formater mon disque dur pour réinstallé Qt 1.0 et ne plus avoir du QML :aie:

Plus sérieusement, pour JS, je ne sais pas. Je n'ai pas encore abordé cette partie (j'ai fait que du QML interfacé avec C++)

Citation:

Envoyé par gbdivers

Plus sérieusement, pour JS, je ne sais pas. Je n'ai pas encore abordé cette partie (j'ai fait que du QML interfacé avec C++)

ok.
Moi je me suis amusé rapidement. J'ai réussi a faire une fenêtre avec le dégradé mais l'appli prend 1Go de mémoire :aie:
Créé des rectangle de 1x1 avec la couleur du pixel n'est pas une bonne idée du tous :whistle2:

Pour mon premier code QML je suis assez fière 8-) d'ailleurs je vous le donne
Code:

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 import Qt 4.7 Rectangle { id :screen width: 256 height: 256 function v() { for (var y = 0; y < 256 ; ++y) { for(var x = 0; x < 256 ; ++x) { var newObject = Qt.createQmlObject('import Qt 4.7; Rectangle {width: 1; height: 1; MouseArea { anchors.fill: parent; onClicked : console.log(parent.color); } }',screen); var h = .5; var s = x / 256.; var v = 1. - y / 256.; var hh = h; var ll = (2. - s) * v; var ss = s * v; ss /= (ll <= 1.) ? (ll) : 2. - (ll); ll /= 2.; newObject.color = Qt.hsla(hh ,ss ,ll, 1.); newObject.x = x; newObject.y = y; } } } Component.onCompleted: v() }
J'ai trouvé cette classe qui me permettrais de créé l'image de fond et de la donné à l'affichage, mais cela oblige à avoir un bout de code C++ :cry:
http://qt.developpez.com/doc/latest/...imageprovider/

25/08/2010, 01h13
redkite

J'ai essayé ton bout de code, 1024,8 M 8O
Moi je dis pas mal ! :ccool:
25/08/2010, 01h27
gbdivers

Citation:

Créé des rectangle de 1x1 avec la couleur du pixel n'est pas une bonne idée du tout

:) J'adore cette approche !

Tu nous fait la version redimensionnable pour faire un widget de 800x800 ?

Je n'avais pas encore vu cette possibilité de créer des objets QML dans du QML

Citation:

Tu sait si on peut créé une image avec JS et l'utiliser comme source dans qml?

Pour les images, je pense que le problème sera le même qu'avec QImage::pixel() : comme QImage (et équivalents) ne sont pas des QObjects, on ne peut pas accéder aux propriétés et fonctions, ni dans QML, ni dans les scripts. On peut juste les lire, les afficher et effectuer les modifications habituelles des item QML (rotation, effet, animation, etc.)

Il faudrait créer une classe ImageObject, qui hériterait de QObject, et de rendre accessible les propriétés (avec Q_PROPERTY) et les fonctions (avec Q_INVOKABLE)
25/08/2010, 11h16
gbdivers

Effectivement, en 3D c'est pas génial. Pas moyen d'améliorer le rendu.
De plus, toutes les couleurs ne sont pas accessibles : sur la surface du cône, on a accès au valeurs HSV (h=0 à 1, s=1, v=0 à 1) et sur la base, on a les valeurs HSV (h=0 à 1, s=0 à 1, v=0). Pour les valeurs s!=1 et v!=1 en même temps, il faut accéder à l'intérieur du cône, ce qui n'est pas possible comme j'ai fait (notamment, on n'a pas les différentes valeurs de gris)

Bref, je laisse tomber cette approche
25/08/2010, 12h13
yan

Citation:

Envoyé par gbdivers

:) J'adore cette approche !

Je me suis demandé à quel point Qml était puissant. Vue que j'ai pas trouvé comment faire un image en JS, j'ai essayé cela pour voir. J'était surpris que ca passe :aie:

Citation:

Envoyé par gbdivers

Il faudrait créer une classe ImageObject, qui hériterait de QObject, et de rendre accessible les propriétés (avec Q_PROPERTY) et les fonctions (avec Q_INVOKABLE)

C'est marrant qu'ils n'ont pas pensés à un canvas pour faire du dessin. J'utilise qml avec QtCreator 2.1-béta. J'ai pas installé Qt 4.7 car elle devrais sortir trés bientôt il me semble donc je peut pas encore testé. En tous cas, j'ai l'impression de commencer à comprend la philosophie de la bête.

Citation:

Envoyé par gbdivers

Bref, je laisse tomber cette approche

surtout que HSV et HSL sont des espaces cylindrique :P
Perso, je n'ai pas trouvé de super idée d'editeur de couleur :cry:

[edit]
tien y as un webview dans QML. J'ai peut être une piste :mouarf:
26/08/2010, 02h01
yan

Citation:

Envoyé par yan

[edit]
tien y as un webview dans QML. J'ai peut être une piste :mouarf:

Faut avoir une compilation récente des sources de Qt, mais ca semble intéressant.
Avec le webview je peut charger un bout de hmtl en y ajoutant un canvas et utiliser evaluateJavaScript
http://qt.developpez.com/doc/latest/...ascript-method

pour lui injecté du code js et lui faire dessiner sur le canva :mrgreen:

J'ai réussi à faire mon gradiant 8-)
Je sais pas si c'est une bonne solution :aie:

Sinon y as ce plugin qml :
http://gitorious.org/qml-painterplugin
27/08/2010, 00h21
kaymak

1 pièce(s) jointe(s)

Voilà une première version, on peut piquer la couleur et changer de couleur de fond.

C'est du c++, et ce n'était pas gagné vu mon incompétence notoire dans ce langage !
Le langage mis à part, Qt, pour le framework est vraiment sympa pour une première approche.
C'était de loin bien plus simple que de me farcir les particularités du langage.

allez hop je retourne debugger, il parait que mon bout d'appli supporte pas bien le redimensionnement (entre autres) :o

http://www.developpez.net/forums/att...e-1.png/?stc=1

En tout cas ça à l'air sympa le qml avec le JS, bien plus simple à écrire.
27/08/2010, 00h27
gbdivers

Citation:

Voilà une première version, on peut piquer la couleur et changer de couleur de fond.

Félicitation ! Ça a l'air pas mal.

Citation:

En tout cas ça à l'air sympa le qml avec le JS, bien plus simple à écrire.

:arf:

Tu verras le code et les explications vendredi de la semaine prochaine pour le QML. Tu verras que ce n'est pas si simple
27/08/2010, 23h32
dourouc05

Pour vous aider dans l'exercice Qt n°1, voici la description d'une méthode possible (il y a en d'autres) pour résoudre ce problème. Si vous n'en avez pas besoin, vous pouvez vous en passer.

Cette solution se base sur la création d'un nouveau widget, héritant directement de QWidget. Ce widget pourra recevoir la couleur principale via un slot et emettre la couleur sélectionnée via un signal.

Pour créer les nuances de gris, on va dessiner dans une QImage grâce à deux QLinearGradient. La fonction paintEvent sera utilisée pour dessiner la QImage représentant les nuances de gris et le curseur.

Donc, au final, vous devrez utiliser au moins les classes : QWidget, QImage et QLinearGradient.

Bon courage !

PS : si vous avez besoin de plus d'aide que ce qui est disponible ici en haut, n'hésitez pas à nous contacter par MP.
29/08/2010, 12h57
myzu69

Arf, je n'ai découvert l'exercice Qt qu'hier soir, pourtant c'est pas faute qu'il soit en gros sur la page d'accueil :aie:

Je vais essayer de faire quelque chose ... personnellement j'aime bien celui de photoshop (enfin pour le peu que je l'aie utilisé), il est peut-être simple et tout carré mais bon au moins c'est fonctionnel (oui je sais, je n'ai pas l'âme d'un artiste mais je n'y peux rien, ça a toujours été comme ça :mrgreen:)
30/08/2010, 01h35
myzu69

2 pièce(s) jointe(s)

Je suis décidément vraiment mauvais ...

Déjà que j'ai passé une heure à déboguer mon programme alors que j'avais juste oublié le #include <QPainter> et ensuite pas moyen d'avoir un rendu correct :aie:

J'ai un widget carré de 256*256 mais je n'arrive pas à dessiner les deux dégradés. J'ai bien les deux QLinearGradient, un sur les axes des x et l'autre sur y mais je ne comprends pas comment mélanger les deux résultats. J'ai essayé avec le paramètre alpha (j'utilise le système RGB) mais on dirait bien que ce n'est pas comme ça qu'il faut faire :
http://www.developpez.net/forums/att...1&d=1283120541

J'ai eu beau chercher dans la doc là je sèche un peu ... quelqu'un pourrait me donner une piste ?

Sinon il y a toujours la méthode de la double boucle for en définissant tout à la main mais bon, ça me semble pas très élégant :roll:

EDIT : ha j'ai trouvé la fonction permettant de mixer les couleurs, reste à trouver les bons paramètres et c'est pas encore gagné :aie:
http://www.developpez.net/forums/att...1&d=1283123661
31/08/2010, 16h33
gbdivers

Petit rappel pour tous les participants :

Il reste que 3 jours pour poster ici vos réponses à cet exercice. Vous pouvez poster directement ici ou rédiger votre réponse dans un document et le mettre en pièce jointe.

Jouer le jeu : si quelqu'un pose une réponse, éviter de modifier la votre en fonction de ce que vous pourriez lire dedans.
31/08/2010, 23h20
kaymak

2 pièce(s) jointe(s)

Voilà pour moi

Hello,

voilà ma version.
Il n'y à pas beaucoup d'option, quelques bugs de dessin (hum hum :whistle2:), mais j'ai pu voir quelques un des aspects graphiques de Qt et ai réussi à me dépatouiller du c++ donc je suis content !

Un screen :
Pièce jointe 66709

et les sources !
Pièce jointe 66710

Citation:

Déjà que j'ai passé une heure à déboguer mon programme alors que j'avais juste oublié le #include <QPainter> et ensuite pas moyen d'avoir un rendu correct

C'est clair, les messages d'erreurs d'includes c'est l'horreur ! Tellement l'horreur que la prochaine fois j'essaierais de le faire en py ou un autre langage !!
... Peut être QML qui sait ^^

A plus
01/09/2010, 01h18
gbdivers

2 pièce(s) jointe(s)

Voici mon code pour la version QML, avec la doc en pdf.
C'est très perfectible :
* la couleur principale par défaut est affichée mais aucune couleur sélectionnée par défaut.
* le widget n'est redimensionnable

Vous me direz si la version QML est plus simple que la version C++ :aie:
01/09/2010, 11h05
kaymak

En tout cas tu as fais une super pres ! Ma copie à l'air pauvrette à côté.... J'avoue avoir même fais l'impasse de la doc du code : /

Ceci dit je regarderais ce soir, là je n'ai pas bien saisis ta méthode de détermination de la couleur pickée :aie:

a plus
01/09/2010, 14h48
gbdivers

@kaymak
Ne t'inquiète pas, tu as encore le temps de rédiger un petit quelque chose pour expliquer tes choix et faciliter la compréhension de ton code.

@autres
Vous avez eu le temps de préparer votre réponse à ce premier exercice Qt ?
Il vous reste encore un peu de temps, donc n'hésitez pas à peaufiner si vous voulez.

J'attends encore avant de poster mon code Qt/C++, pour ne pas vous influencer.
02/09/2010, 20h25
johnlamericain

Bonsoir à tous,

Il ne vous reste qu'un peu plus d'une journée avant le rendu de la première partie du ColorPicker. Il est temps de paufiner votre code et de rendre celui-ci avant demain soir minuit.

Parce que je suis prince et que j'habite en Angleterre, ça fera 1h du matin pour les français (minuit heure de greenwich) ;)

N'oubliais pas de mettre les explications qui vont avec votre, je vous rappel qu'il s'agit d'un exercice de présentation.

Le résultat sera annoncé dans 1 semaine jour pour jour et la 2ème partie lancé en même temps ;)

Bon courage pour la dernière ligne droite !

Voir 40 message(s) de cette discussion en une page