271568 Des Widgets en 3d Avec Qt

  • View
    14

  • Download
    4

Embed Size (px)

Text of 271568 Des Widgets en 3d Avec Qt

  • Des widgets en 3Davec Qt

    Par Midnight Falcon

    www.openclassrooms.com

    Licence Creative Commons 6 2.0Dernire mise jour le 9/07/2010

  • Sommaire 2Sommaire ........................................................................................................................................... 3 Des widgets en 3D avec Qt ............................................................................................................... 3Insrer des widgets dans une scne ................................................................................................................................ 3Quelques classes utiles .............................................................................................................................................................................................. 4Dplacer les objets dans la scne .............................................................................................................................................................................. 7Les transformations avec QTransform .............................................................................................................................. 7Utiliser un QTransform avec un QGraphicsItem ......................................................................................................................................................... 9Composer les matrices ...............................................................................................................................................................................................

    10Des widgets en 3D ! ........................................................................................................................................................ 10Que la rotation soit .................................................................................................................................................................................................... 12Et que a bouge ! ...................................................................................................................................................................................................... 13Grer plusieurs transformations diffrentes ..............................................................................................................................................................

    15Pour aller plus loin : gestion de la camra ...................................................................................................................... 15La camra : reprenons l'envers ! ............................................................................................................................................................................ 15Crer une camra ..................................................................................................................................................................................................... 17Partager .....................................................................................................................................................................................................................

    2/18

    www.openclassrooms.com

  • Des widgets en 3D avec Qt

    Par Midnight Falcon

    Mise jour : 09/07/2010Difficult : Intermdiaire Dure d'tude : 3 heures

    Vous utilisez Qt pour raliser des interfaces graphiques et vous vous tes dj demand s'il tait possible d'afficher des formesou des widgets en leur donnant un aspect 3D sans l'aide d'une bibliothque extrieure ? Ce tutoriel est fait pour vous.

    En effet, je vais vous expliquer comment utiliser la classe QGraphicsItem, qui permet de faon gnrale d'intgrer des objets dansune scne 2D mais aussi de leur donner un aspect 3D, moyennant quelques astuces. Attention toutefois, je ne parlerai pas de lamthode permettant de se promener dans la scne comme dans un jeu vido : Qt n'est pas vraiment conu pour a, mme s'il estpossible de le faire avec de bonnes connaissances (voir le lien la fin de ce tutoriel).

    J'aborderai donc l'intgration d'objets dans une scne en deux dimensions grce Qt, avant de vous montrer comment simuler laprofondeur afin de donner une impression de 3D ces objets.

    Dans ce tutoriel, le mot objet dsignera toute instance d'une classe drive de QGraphicsItem. Qt fournit en effetsuffisamment de classes pour pouvoir reprsenter toutes sortes de choses dans une scne, et je ne voulais pas utiliserde terme trop spcifique justement pour ne pas oublier ce dtail.

    Sommaire du tutoriel :

    Insrer des widgets dans une scneLes transformations avec QTransformDes widgets en 3D !Pour aller plus loin : gestion de la camra

    Insrer des widgets dans une scneQuelques classes utiles

    Afin de visualiser des widgets (et plus gnralement des objets graphiques) dans une scne, il faut commencer par en crer unequi va contenir tout ce beau monde. La classe fournie par Qt s'appelle sobrement QGraphicsScene et permet d'insrer desQGraphicsItem. La classe abstraite QGraphicsItem, assez gnrique, reprsente tout ce qui est affichable dans uneQGraphicsScene. On trouve notamment un nombre important de classes permettant de grer des polygones, des textes, desQPixmap et... des widgets !

    En effet, la classe hrite QGraphicsProxyWidget est particulirement adapte l'insertion des widgets dans uneQGraphicsScene. Il suffit de crer votre QGraphicsProxyWidget, de lui attacher le widget que vous dsirez intgrer la scnepuis de l'y intgrer en tant qu'objet. Vous manipulez donc votre widget travers le proxy, tout ceci tant transparent une fois quele proxy et le widget sont attachs. Il est de plus tout fait possible d'intgrer des widgets complexes, comme une QTabWidget,qui contient lui-mme d'autres widgets...

    Dans les exemples, j'appliquerai les notions de ce tutoriel des widgets car c'est leur intgration qui m'a pouss utiliser ces classes. Cependant, les mthodes utilises sont pour la plupart hrites de QGraphicsItem, vous pourrezdonc les adapter d'autres objets que des widgets.

    Enfin, comme la scne n'est pas un widget, il faut aussi crer une vue avec la classe QGraphicsView, qui permet d'afficher le

    Sommaire 3/18

    www.openclassrooms.com

  • contenu de notre scne.Sans plus attendre, commenons par crer notre premire scne, avec un bouton au milieu.

    Code : C++

    #include #include

    int main(int argc, char *argv[]){ QApplication app(argc, argv);

    QPushButton *bouton = new QPushButton("Mon bouton entre en scne!"); QGraphicsScene scene; QGraphicsProxyWidget *proxy = new QGraphicsProxyWidget(); proxy->setWidget(bouton); scene.addItem(proxy);

    QGraphicsView view(&scene); view.show();

    return app.exec();}

    Ce code devrait vous afficher un joli bouton au milieu d'un cran blanc. Vous venez d'intgrer votre premier widget dans unescne ! Avouez-le, ce n'tait pas si difficile !

    Dplacer les objets dans la scne

    Une fois le widget intgr la scne travers notre proxy, Qt nous offre un grand nombre de mthodes pour modifier sonpositionnement.

    Les coordonnes

    Si les systmes de coordonnes 2D ne vous sont pas familiers, sachez que l'axe X est l'axe horizontal orient vers la droite, et quel'axe Y est l'axe vertical orient vers le bas. A priori, si vous avez dj un peu manipul Qt ou la SDL par exemple, vous devriezvous y retrouver.

    TranslationLa fonction setPos() de QGraphicsItem prend deux paramtres, dx et dy, qui sont les dplacements relatifs respectivement surl'axe X et l'axe Y de la scne, paramtres qui deviendront alors les nouvelles coordonnes de notre objet. savoir qu'unemthode surcharge existe, prenant en paramtre un QPointF. vous de voir laquelle vous prfrez. Il est aussi possibled'appeler la fonction move(), qui ajoute le dplacement sur les deux axes la position actuelle de l'objet. Essayons tout de suitede dplacer notre objet dans la scne :

    Des widgets en 3D avec Qt 4/18

    www.openclassrooms.com

  • Code : C++

    #include #include

    int main(int argc, char *argv[]){ QApplication app(argc, argv);

    QPushButton *bouton = new QPushButton("Mon bouton entre en scne!"); QGraphicsScene scene; QGraphicsProxyWidget *proxy = new QGraphicsProxyWidget(); proxy->setWidget(bouton); scene.addItem(proxy);

    proxy->setPos(150, 200);

    QGraphicsView view(&scene); view.show();

    return app.exec();}

    Eh, mon widget n'a pas boug d'un iota par rapport tout l'heure !

    En effet, c'est une des particularits de la QGraphicsScene qui m'a un peu perturb au dbut. En fait, par dfaut, la scnes'arrange toujours pour placer vos objets au milieu de la vue. C'est un peu embtant si l'on veut voir du mouvement l-dedans.

    Heureusement, il est possible de dfinir la zone de la scne que l'on dsire voir l'cran. Ajoutez cette ligne aprs la cration de lascne :

    Code : C++

    scene.setSceneRect(-150, -150, 300, 300)

    Les deux premiers nombres sont les coordonnes du point qui doit tre plac dans le coin suprieur gauche de la vue (ici, (-150, -150)). Les deux nombres suivants sont la largeur et la hauteur de la scne que je dsire afficher. Ainsi, comme le point (-150, -150)est le coin suprieur gauche de ma fentre, je vais retrouver l'origine de la scne au centre de l'cran. Si vous relancez votre codeavec et sans le dplacement du bouton, vous devriez voir cette fois-ci une diffrence de position.

    Des widgets en 3D avec Qt 5/18

    www.openclassrooms.com

  • RotationAfin d'appliquer une rotation l'objet, il suffit d'utiliser la mthode setRotation(), pour laquelle vous devrez fournir l'angle derotation en degrs. Un angle positif tourne l'objet dans le sens des aiguilles d'une montre, un angle ngatif