- Formations
- conversion_path Parcours & Formations
- science Projets
- data_object Exercices de code
- psychology Exercices IA
- quiz Quiz
- Articles
- rss_feed Blog
- sort_by_alpha Glossaire
- menu_book Guides
- help_center FAQ
- media_link Ressources
- Communauté
- groups La communauté
- forum Questions
- live_tv Mentorats
- science Projets mensuels
- Formations
- conversion_path Parcours & Formations
- science Projets
- data_object Exercices de code
- psychology Exercices IA
- quiz Quiz
- Articles
- rss_feed Blog
- sort_by_alpha Glossaire
- menu_book Guides
- help_center FAQ
- media_link Ressources
- Communauté
- groups La communauté
- forum Questions
- live_tv Mentorats
- science Projets mensuels
Deviens membre Premium magic_button
Débloque cette session en devenant Membre Premium 🚀
Inscris-toi
(c'est gratuit !)
Un compte est nécessaire pour participer aux discussions.
Créer un compte person00:00:00 :Avant de passer à l'ajout des items dans notre liste avec les icônes, on va modifier légèrement notre fichier main.pyJe dis légèrement mais en fait on va quand même pas mal le modifier puisque je vais vous montrer comment faire des images qui vont être générées dans le cache de notre application
00:00:17 :Puisque là on risque d'avoir potentiellement beaucoup d'items dans notre liste, si jamais vous voulez convertir 2000 images, ce qui est possible, vous allez avoir beaucoup d'icônes dans notre liste widgetsPour essayer d'avoir quelque chose qui reste le plus léger possible, on va passer par une propriété qui va nous permettre de cacher les icônes, de les garder en mémoire et d'avoir quelque chose de plus rapide
00:00:50 :Pour l'instant je vais juste mettre un passe ici et dans cette partie, plutôt que de créer un ApplicationContext, on va créer une instance à partir de notre AppContext, à partir de la classe qu'on vient de créer iciToute cette partie là je vais l'enlever, je vais couper ce code puisqu'on va le mettre à l'intérieur de notre classe directement
00:01:08 :Je vais également enlever les commentaires ici puisqu'ils me dérangent un peu, donc j'enlève ces commentaires làEt à la place du AppContext.App.Exec, ça aussi on va l'enlever, on va enlever ces deux lignes de code ici puisqu'on va passer directement par une méthode à l'intérieur de notre classe
00:01:34 :C'est dans cette méthode que l'on va finalement créer notre main window, qu'on va refaire le resize, le show, etcDonc je vais remettre le code que j'ai enlevé il y a quelques instants, les trois lignes de code on va les remettre iciDonc on va créer un main window qui va être une instance de notre main window, on va lui passer notre contexte puisqu'on va utiliser ces icônes à l'intérieur de notre main window
00:01:55 :Donc à l'intérieur ici de notre classe, donc on va devoir récupérer ici dans le init le contexteSi vous vous souvenez bien on l'avait passé déjà dans notre méthode init, donc on va devoir le repasser iciEt dans ce cas-ci notre contexte va être self, puisqu'on a créé une classe ici AppContext, donc on va dire que contexte est égal à self
00:02:13 :On va ensuite remettre le resize que j'avais mis, on avait fait un resize de la taille de mon écran divisé par 4 et de la hauteur divisée par 2Donc on remet le resize et pour finir on met le main window.show qui nous permet d'afficher la fenêtre
00:02:26 :On va retourner pour finir le self.app.exec, donc là encore c'est ce qu'on avait à l'intérieur de notre structure conditionnelle iciLà on va le retourner dans notre méthode run puisqu'on va entourer de 6.exit cette méthode run
00:02:41 :Donc ça c'est vraiment tout ce qu'on avait dans le script précédent que l'on remet sous une autre forme avec notre classe iciDonc ça, ça va retourner en fait l'exécution de notre application puisque là on crée notre applicationEnsuite on utilise la méthode run, dans la méthode run on va créer l'instance de notre fenêtre
00:02:57 :On va afficher notre fenêtre et ensuite on va exécuter l'applicationDonc ça, ça va nous retourner un code en fonction de quand on ferme la fenêtreOn va avoir un code d'erreur différent et tout ça on le retourne dans 6.exit
00:03:09 :Donc là si actuellement je lance mon application, normalement on devrait avoir exactement la même chose qu'auparavantDonc je vais cliquer sur la petite flèche ici pour lancer l'application et vous allez voir qu'on se retrouve avec exactement la même choseNotre fenêtre, avec tout qui marche de la même façon, avec nos widgets, notre layout, etc
00:03:26 :Donc pour l'instant il n'y a rien qui a changé, c'est juste qu'on a créé une classe iciQui va me permettre de créer des images qui vont être dans le cacheDonc pour ça je vais faire deux méthodes, je vais faire une méthode pour l'image checkedAlors je vais vous montrer, avant j'ai mis les images à l'intérieur de mon dossier ressources ici
00:03:41 :Donc dans ressources-base, j'ai fait un dossier images qui contient deux imagesDonc une image checked et une image uncheckedDonc ça va être les images qu'on va utiliser dans notre liste widget pour afficher les items qui correspondent aux images qu'on veut convertirDonc je vais faire une première méthode que je vais appeler image checked, comme ceci
00:03:59 :Et ça va retourner en fait l'icône de notre image, donc l'image qui est ici, l'image checked.pngDonc l'icône on va devoir la créer à partir du module QTGUIDonc on va devoir l'importer ici, on va faire from pieside2 import QTGUIAlors là c'est QTGUI, la classe QIcon en fait n'est pas contenue dans QtWidgets
00:04:19 :Donc ça fait partie des quelques rares classes qui ont été laissées à l'intérieur de QTGUILà encore je ne sais pas vraiment pourquoi ils ont laissé ça à l'intérieur de QTGUI et qu'ils n'ont pas bougé tout ça dans QtWidgetsDonc c'est un mystère, mais il faut le savoirDonc QTGUI.QIcon, ça va nous permettre de générer un QIcon qu'on va pouvoir utiliser par la suite dans notre liste widget item
00:04:40 :Je vais utiliser la méthode getResource, on l'avait utilisé si vous vous souvenez bien dans une autre applicationPour aller chercher la feuille de style, en fait on l'utilise même ici si on va voir à l'intérieur de notre main windowQuand on fait le modifyWidget, on utilise ce getResource pour aller chercher la feuille de style
00:04:55 :Donc on va utiliser self.getResource pour aller chercher cette fois-ci l'image qui se trouve dans le dossier image checkedDonc on va mettre en chaîne de caractère image.checked.png
00:05:08 :Donc à chaque fois en fait on part du dossier base iciDonc quand on a la feuille de style, on met juste style.css puisque le fichier style.css est directement dans le dossier base
00:05:18 :Mais là vu qu'on va chercher à l'intérieur d'un sous-dossier qui s'appelle nos imagesEh bien il faut mettre le chemin complet à partir du dossier de baseDonc là ça va être image.checked.png
00:05:29 :Ça on va le retourner, donc on va faire tout simplement un returnEt ça va retourner donc notre QIcon avec le chemin complet vers le fichier checked.png
00:05:37 :Au-dessus de cette méthode, on va mettre un décorateur qui va nous permettre d'indiquer qu'on veut garder cette image dans le cacheCe décorateur on va l'importer depuis notre FBS Runtime Application Context PySide 2Donc c'est quelque chose qui a été créé par les gens qui ont créé FBSDonc on va devoir l'importer directement ici après le Application Context
00:05:56 :Donc ce décorateur il s'appelle CachedProperty comme ceciEt on va le mettre au-dessus de notre méthode image checkedDonc on va mettre un arrow base puisque pour les décorateurs il faut mettre un arrow baseDonc arrow base CachedPropertyEt le fait de mettre ce décorateur en fait déjà ça va nous permettre d'accéder à notre méthode en tant que propriété
00:06:14 :Et en plus ça va être comme je vous disais donc dans le cache de notre ordinateurOn va faire exactement la même chose mais cette fois-ci avec l'image uncheckedDonc je vais tout simplement copier ces trois lignes de code et les coller juste en dessousEt donc on va juste remettre l'indentation comme il faut
00:06:28 :Donc je sélectionne tout je fais tab pour remettre l'indentation à l'intérieur de ma classeEt plutôt que image checked on va mettre image unchecked cette fois-ciEt on va changer le chemin également pour aller chercher l'image unchecked dans notre dossier de ressourcesDonc c'est parfait on a notre application avec la méthode run ici qui nous permet de créer notre application
00:06:47 :On a nos deux images ici checked et unchecked qu'on va pouvoir utiliser dans la prochaine partie à l'intérieur de notre main windowDonc vous allez voir quand on va ajouter les images on va ajouter des list widget item et on va leur assigner cette imageDonc par défaut ça va être une image unchecked quand on va ajouter les images par défaut elles auront la petite croix rouge
00:07:06 :Et une fois que la conversion aura réussi on va changer cette image de croix rouge pour la croix verteQui va nous indiquer que la conversion a bien réussiDonc on va s'assurer que tout fonctionne je relance le script pour m'assurer que tout se lance bienDonc c'est le cas encore et donc dans la prochaine partie on va gérer l'ajout des list widget item
Ce n'est pas fini...
✋
Tu as complété % du parcours 🔥
Termine l'intégralité de la formation pour pouvoir débloquer ton attestation de réussite.