Outils pour utilisateurs

Outils du site


issue58:tuto_python

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentesRévision précédente
Prochaine révision
Révision précédente
issue58:tuto_python [2012/03/16 11:31] – [to do] frangiissue58:tuto_python [2012/03/25 15:18] (Version actuelle) fredphil91
Ligne 1: Ligne 1:
-===== done =====+
 ** **
 This month, we'll explore yet another GUI designer, this time for Tkinter. Many people have an issue with Tkinter because it doesn't offer a built-in designer. While I've shown you how to easily design your applications without a designer, we will examine one now. It's called Page. Basically it's a version of Visual TCL with Python support on top. The current version is 3.2 and can be found at http://sourceforge.net/projects/page/files/latest/download. This month, we'll explore yet another GUI designer, this time for Tkinter. Many people have an issue with Tkinter because it doesn't offer a built-in designer. While I've shown you how to easily design your applications without a designer, we will examine one now. It's called Page. Basically it's a version of Visual TCL with Python support on top. The current version is 3.2 and can be found at http://sourceforge.net/projects/page/files/latest/download.
Ligne 8: Ligne 8:
 ** **
  
-Ce mois-ci, nous allons explorer encore un autre concepteur graphique, cette fois c'est Tkinter. Beaucoup de gens ont un problème avec Tkinter, car il n'offre pas un designer intégré. Alors que je vous ai montré comment concevoir facilement vos applications sans concepteur, nous allons en examiner un maintenant. Il s'appelle Page.  Fondamentalement, il s'agit d'une version de Visual TCL avec un couche de Python par dessus. La version actuelle est la 3.2 et peut être trouvé à http://sourceforge.net/projects/page/files/latest/download.+Ce mois-ci, nous allons explorer encore un autre concepteur graphique, cette fois c'est pour Tkinter. Beaucoup de gens ont un problème avec Tkinter, car il n'offre pas un designer intégré. Alors que je vous ai montré comment concevoir facilement vos applications sans concepteur, nous allons en examiner un maintenant. Il s'appelle Page.  Fondamentalement, il s'agit d'une version de Visual TCL avec une couche de Python par dessus. La version actuelle est la 3.2 et peut être trouvée à http://sourceforge.net/projects/page/files/latest/download.
  
 Pré-requis Pré-requis
  
-Vous devez avoir TCK/TK 8.5.4 ou plus, Python 2.6 ou pluset pyttk, que vous pouvez obtenir (si vous ne l'avez pas encore) à partir de http://pypi.python.org/pypi/pyttk. Vous avez probablement tous ceux-ci à l'exception possible de pyttk.+Vous devez avoir TCK/TK 8.5.4 ou plus, Python 2.6 ou plus et pyttk, que vous pouvez obtenir (si vous ne l'avez pas encore) à partir de http://pypi.python.org/pypi/pyttk. Vous avez probablement tous ceux-ci à l'exception possible de pyttk.
  
 ** **
Ligne 34: Ligne 34:
 Installation Installation
  
-Vous ne pouvez pas vraiment demander une procédure d'installation plus facile. Il suffit de décompresser le fichier de distribution dans un dossier de votre choix. Exécutez le script appelé «configure» à partir du dossier où vous venez de tout déballer. Cela va créer votre script de lancement appelé «page» que vous utiliserez pour obtenir tout le reste. C'est tout.+Vous ne pouvez vraiment pas demander une procédure d'installation plus facile. Il suffit de décompresser le fichier de distribution dans un dossier de votre choix. Exécutez le script appelé « configure » à partir du dossier où vous venez de tout déballer. Cela va créer votre script de lancement appelé « page » que vous utiliserez pour obtenir tout le reste. C'est tout.
  
 Apprentissage de Page Apprentissage de Page
  
-Lorsque vous démarrez Page, vous aurez trois fenêtres (formulaires). L'une est une «piste de lancement»une est une boîte à outilset une montre l'éditeur d'attributs.+Lorsque vous démarrez Page, vous aurez trois fenêtres (formulaires). L'une est une « piste de lancement »l'autre est une boîte à outils et la dernière montre l'éditeur d'attributs.
  
 Pour démarrer un nouveau projet, cliquez sur le bouton du haut dans la boîte à outils. Pour démarrer un nouveau projet, cliquez sur le bouton du haut dans la boîte à outils.
Ligne 44: Ligne 44:
 Cela crée votre formulaire principal. Vous pouvez le déplacer où vous le souhaitez sur votre écran. Ensuite, et à partir de maintenant, cliquez sur un widget dans la boîte à outils, puis cliquez sur l'endroit où vous le voulez sur le formulaire principal. Cela crée votre formulaire principal. Vous pouvez le déplacer où vous le souhaitez sur votre écran. Ensuite, et à partir de maintenant, cliquez sur un widget dans la boîte à outils, puis cliquez sur l'endroit où vous le voulez sur le formulaire principal.
  
-Pour l'instant, nous allons faire un bouton. Cliquez sur le bouton Button sur la boîte à outils, puis cliquez quelque part sur le formulaire principal.+Pour l'instant, nous allons faire un bouton. Cliquez sur le bouton Button dans la boîte à outils, puis cliquez quelque part sur le formulaire principal.
  
-Ensuite, dans le formulaire de lancement, cliquez sur la fenêtre et sélectionnez  l'éditeur d'attribut (s'il n'est pas déjà affiché). Votre bouton unique devrait être déjà mis en évidence, déplacez le dans la forme et lorsque vous relâchez le bouton de la souris, vous devriez voir le changement de position dans le formulaire éditeur d'attributs sous 'x positionet 'y position'.+Ensuite, dans le formulaire de lancement, cliquez sur Fenêtre (Window) et sélectionnez l'Éditeur d'attributs (s'il n'est pas déjà affiché). Votre bouton unique devrait être déjà mis en surbrillance ; déplacez-le dans le formulaire et lorsque vous relâchez le bouton de la souris, vous devrez voir le changement de position dans le formulaire éditeur d'attributs sous « x position » et « y position ».
  
 ** **
Ligne 54: Ligne 54:
 ** **
  
-Ici, nous pouvons définir d'autres attributs tels que le texte sur le bouton (ou la plupart des autres widgets), l'alias pour le widget (le nom auquel nous allons nous référer dans notre code), la couleur, le nom par lequel nous l'appellerons et plus. Près du bas de l'éditeur d'attributs se trouve le champ de texte. Ceci est le texte qui apparaît à l'utilisateur pour, dans ce cas, le widget bouton. Changeons le de «Button» à «Exit»Notez que maintenant le bouton affiche «Exit». Maintenant redimensionnez le formulaire pour montrer seulement le bouton et recentrez le bouton dans le formulaire.+Ici, nous pouvons définir d'autres attributs tels que le texte sur le bouton (ou la plupart des autres widgets), l'alias pour le widget (le nom auquel nous allons nous référer dans notre code), la couleur, le nom par lequel nous l'appellerons et plus. Près du bas de l'éditeur d'attributs se trouve le champ de texte. Ceci est le texte qui l'utilisateur voit pour, dans ce cas, le widget bouton. Changeons-le de « Button » à « Exit »Remarquez que maintenant le bouton affiche « Exit ». Maintenant redimensionnez le formulaire pour montrer seulement le bouton et recentrez le bouton dans le formulaire.
  
-Ensuite, cliquez quelque part dans le formulaire principaloù le bouton n'est pas. Le formulaire éditeur d'attributs affiche maintenant les attributs de la forme principale.  Trouvez le champ «title» et changez le de «New Toplevel 1» à «Test Form».+Ensuite, cliquez quelque part dans le formulaire principal où le bouton n'est pas. Le formulaire éditeur d'attributs affiche maintenant les attributs du formulaire principal.  Trouvez le champ « Title » et changez-le de « New Toplevel 1 » à « Test Form ».
  
  
Ligne 69: Ligne 69:
 ** **
  
-Maintenant, avant de sauvegarder notre projet, nous avons besoin de créer un dossier pour contenir nos fichiers de projet. Créez un dossier quelque part sur votre disque appelé «PageProjects».  Puis, dans la fenêtre de lancement, sélectionnez File puis sur Save As. Allez dans votre dossier PageProjectset, dans la boîte de dialogue, tapez TestForm.tcl, et cliquez sur le bouton Save. Noter que cela est enregistré dans un fichier TCL, pas un fichier Python. Ensuite, nous allons créer le fichier python.+Maintenant, avant de sauvegarder notre projet, nous avons besoin de créer un dossier pour contenir nos fichiers de projet. Créez un dossier quelque part sur votre disque appelé « PageProjects ».  Puis, dans la fenêtre de lancement, sélectionnez File puis Save As. Allez dans votre dossier PageProjects et, dans la boîte de dialogue, tapez TestForm.tclet et cliquez sur le bouton Save. Noter que cela est enregistré comme fichier TCL, pas comme fichier Python. Ensuite, nous allons créer le fichier python.
  
-Dans la fenêtre de lancement, de trouver le menu Gen_Python et cliquez dessus. Sélectionnez Generate Python et un nouveau formulaire apparaît.+Dans la fenêtre de lancement, cherchez le menu Gen_Python et cliquez dessus. Sélectionnez Generate Python et un nouveau formulaire apparaît.
  
-Page a généré (comme son nom l'indique) le code Python à notre place et l'a placé dans une fenêtre pour qu'on puisse le voir. Au bas de ce formulaire, il y a trois boutons ... Save, Runet Close.+Page a généré (comme son nom l'indique) le code Python à notre place et l'a placé dans une fenêtre pour qu'on puisse le voir. Au bas de ce formulaire, il y a trois boutons... Save, Run et Close.
  
-Cliquez sur Save. Si, à ce stade, vous deviez regarder dans votre dossier PageProjects, vous verriez le fichier python (TestForm.py). Maintenant, cliquez sur le bouton Run. En quelques secondes, vous verrez le projet démarrer. Le bouton n'est pas connecté à quoi que ce soit encore, il ne fera donc rien si vous cliquez dessus. Il suffit de fermer le formulaire avec le «X» dans le coin de la fenêtre. Maintenant, fermez la fenêtre de console Python avec le bouton de fermeture en bas à droite.+Cliquez sur Save. Si, à ce stade, vous deviez regarder dans votre dossier PageProjects, vous verriez le fichier python (TestForm.py). Maintenant, cliquez sur le bouton Run. En quelques secondes, vous verrez le projet démarrer. Le bouton n'est pas connecté à quoi que ce soit encore, il ne fera donc rien si vous cliquez dessus. Il suffit de fermer le formulaire avec le « X » dans le coin de la fenêtre. Maintenant, fermez la fenêtre de console Python avec le bouton de fermeture en bas à droite.
  
 ** **
Ligne 89: Ligne 89:
 ** **
  
-De retour à notre formulaire principal, sélectionnez le bouton Exit et faites un clic droit dessus. Sélectionnez «Bindings...».  Dans le menu se trouve un ensemble de boutons.+De retour à notre formulaire principal, sélectionnez le bouton Exit et faites un clic droit dessus. Sélectionnez « Bindings... ». Dans le menu se trouve un ensemble de boutons.
  
-Le premier sur la gauche vous permet de créer une nouvelle liaison.  Cliquez sur «Bouton-. Cela nous permet de paramétrer la liaison pour le bouton gauche de la souris.  Dans la fenêtre sur la droite, tapez «Button1Click».+Le premier sur la gauche vous permet de créer une nouvelle liaison. Cliquez sur « Bouton-1 ». Cela nous permet de paramétrer la liaison pour le bouton gauche de la souris.  Dans la fenêtre sur la droite, tapez « Button1Click ».
  
-Enregistrez et générez le code python à nouveau. Faites défiler le code dans la console Python jusqu'à la fin du fichier. Au-dessus du code de la «class Test_Form» est la fonction que nous avons juste demandé de créer. Notez que à ce stade, il est simplement transmis. Voyez plus loin vers le bas et vous verrez le code qui crée et contrôle notre bouton. Tout est fait pour nous déjà. Toutefois, nous avons encore à dire au bouton ce qu'il faut faire.  Fermez la console Python et continuons.+Enregistrez et générez le code python à nouveau. Faites défiler le code dans la console Python jusqu'à la fin du fichier. Au-dessus du code de la « class Test_Form » est la fonction dont nous venons de demander la création. Notez qu'à ce stade, il est simplement transmis. Regardez plus loin vers le bas et vous verrez le code qui crée et contrôle notre bouton. Tout est fait pour nous déjà. Toutefois, nous devons encore dire au bouton ce qu'il faut faire. Fermez la console Python et continuons.
  
 Sur la fenêtre de lancement, cliquez sur Window puis sélectionnez Function List. Ici, nous allons écrire notre méthode pour fermer la fenêtre. Sur la fenêtre de lancement, cliquez sur Window puis sélectionnez Function List. Ici, nous allons écrire notre méthode pour fermer la fenêtre.
  
-Le premier bouton à gauche est le bouton Add. Cliquez le. Dans la zone Function, tapez «py:Button1Click» et, dans la zone Arguments, tapez «p1», et modifiez le texte dans la zone inférieure ...+Le premier bouton à gauche est le bouton Add. Cliquez dessus. Dans la zone Function, tapez « py:Button1Click » et, dans la zone Arguments, tapez « p1 » et modifiez le texte dans la zone inférieure à ...
  
 ** **
Ligne 110: Ligne 110:
  
 def Button1Click(p1): def Button1Click(p1):
- +        sys.exit()
-sys.exit()+
                  
 Cliquez sur la coche et nous avons terminé avec cela. Cliquez sur la coche et nous avons terminé avec cela.
  
-Ensuite, nous devons lier cette routine au bouton. Sélectionnez le bouton dans le formulaire, faites un clic droit et sélectionnez «Bindings...».  Comme précédemment, cliquez sur le bouton le plus à gauche sur la barre d'outils et sélectionnez le Button-1. C'est l'évènement correspondant au clic gauche de la souris. Dans la boîte de texte à droite, entrez «Button1Click». Assurez-vous d'utiliser la même casse que vous l'avez fait pour la fonction que nous venons de créer. Cliquez sur la coche sur le côté droit.+Ensuite, nous devons lier cette routine au bouton. Sélectionnez le bouton dans le formulaire, faites un clic droit dessus et sélectionnez « Bindings... ».  Comme précédemment, cliquez sur le bouton le plus à gauche sur la barre d'outils et sélectionnez le Button-1. C'est l'événement correspondant au clic gauche de la souris. Dans la boîte de texte à droite, entrez « Button1Click ». Assurez-vous d'utiliser la même casse que pour la fonction que nous venons de créer. Cliquez sur la coche sur le côté droit.
 Maintenant, sauvegardez et générez votre code python. Maintenant, sauvegardez et générez votre code python.
  
Ligne 130: Ligne 129:
  
 Now, if you run your code and click on the Exit button, the form should close properly. Now, if you run your code and click on the Exit button, the form should close properly.
-**+ **
  
-Vous devriez voir le code suivant à proximité du fond, mais en dehors de la classe Test_Form ...+Vous devriez voir le code suivant vers le bas, mais en dehors de la classe Test_Form...
  
 def Button1Click(p1): def Button1Click(p1):
Ligne 138: Ligne 137:
 sys.exit() sys.exit()
  
-Et la dernière ligne de la classe devrait être ...+Et la dernière ligne de la classe devrait être...
  
 self.Button1.bind('<Button-1>',Button1Click) self.Button1.bind('<Button-1>',Button1Click)
Ligne 155: Ligne 154:
 Pour aller plus loin Pour aller plus loin
  
-Maintenant, nous allons faire quelque chose de plus compliqué. Nous allons créer une démo montrant quelques-uns des widgets qui sont disponibles.  D'abord fermez Page et redémarrez-le. Ensuite, créez un nouveau formulaire Toplevel. Ajouter deux cadres, l'un au-dessus de l'autre et étirez les à prendre à peu près toute la largeur du formulaire. Dans le cadre du haut, placez une étiquette de texteet, en utilisant l'éditeur attributs, modifier le texte à «Buttons:». Ensuite, ajoutez deux boutons dans le plan horizontal. Modifier le texte de celui de gauche en «Normal», et celui de droite en «Sunken» [NDT: en creux].  Alors que le bouton Sunken est sélectionné, changer le relief de «Sunken» et nommez-le btnSunken. Nommez le bouton «Normal» «btnNormal». Enregistrez ce projet avec le nom «Demos.tcl».+Maintenant, nous allons faire quelque chose de plus compliqué. Nous allons créer une démo montrant quelques-uns des widgets qui sont disponibles. D'abord fermez Page et redémarrez-le. Ensuite, créez un nouveau formulaire Toplevel. Ajoutez deux cadres, l'un au-dessus de l'autre et étirez-les pour prendre à peu près toute la largeur du formulaire. Dans le cadre du haut, placez une étiquette de texte et, en utilisant l'éditeur attributs, modifiez le texte à « Buttons: ». Ensuite, ajoutez deux boutons dans le plan horizontal. Modifiez le texte de celui de gauche en « Normal » et celui de droite en « Sunken » [Ndt : en creux].  Alors que le bouton Sunken est sélectionné, changez le relief de « Sunken » et nommez-le btnSunken. Nommez le bouton « Normal » « btnNormal ». Enregistrez ce projet avec le nom « Demos.tcl ».
  
-Ensuite, placez dans le cadre inférieur une étiquette de texte «Radio Buttons» et quatre boutons radio comme dans l'image ci-dessous. Enfin, placez un bouton Exit en dessous du cadre inférieur.+Ensuite, placez dans le cadre inférieur une étiquette de texte « Radio Buttons » et quatre boutons radio comme dans l'image ci-dessous. Enfin, placez un bouton Exit en dessous du cadre inférieur.
  
  
Ligne 174: Ligne 173:
 ** **
  
-Avant de travailler sur les liaisons, nous allons créer nos fonctions de clic. Ouvrez la liste de fonctions et créez deux fonctions. Le premier devrait être appelé btnNormalClicked et l'autre btnSunkenClicked. Assurez-vous d'inclure p1 dans la boîte d'arguments. Voici le code que vous devez avoir pour eux ...+Avant de travailler sur les liaisons, nous allons créer nos fonctions de clic. Ouvrez la liste de fonctions et créez deux fonctions. Le premier devrait être appelé btnNormalClicked et l'autre btnSunkenClicked. Assurez-vous d'inclure p1 dans la boîte d'arguments. Voici le code que vous devez avoir pour eux...
  
 def btnNormalClicked(p1): def btnNormalClicked(p1):
Ligne 184: Ligne 183:
 print "Sunken Button Clicked" print "Sunken Button Clicked"
  
-Ajoutons nos liaisons aux boutons. Pour chaque bouton, faites un clic droit dessus, sélectionnez «Bindings...»et ajoutez, comme avant, une liaison aux fonctions que nous avons créées. Pour la touche normale, çà serait «btnNormalClicked», et pour le bouton creux çà serait «btnSunkenClicked». Enregistrez et générez votre code.  Maintenant, si vous testiez le programme avec l'option «Run» de la console Pythonet cliquiez sur un des boutons, vous ne verriez rien se produire. Toutefois, lorsque vous fermerez l'application, vous devriez voir les réponses écrites. Ceci est normal pour Page et si vous l'aviez simplement exécuté à partir de la ligne de commande comme vous le feriez normalement, les choses devraient fonctionner comme prévu.+Ajoutons nos liaisons aux boutons. Pour chaque bouton, faites un clic droit dessus, sélectionnez « Bindings... » et ajoutez, comme avant, une liaison aux fonctions que nous avons créées. Pour le bouton normalcela sera « btnNormalClicked » et pour le bouton creux cela sera « btnSunkenClicked ». Enregistrez et générez votre code.  Maintenant, si vous testiez le programme avec l'option « Run » de la console Python et cliquiez sur un des boutons, vous ne verriez rien se produire. Toutefois, lorsque vous fermerez l'application, vous devriez voir les réponses écrites. Ceci est normal pour Page et si vous l'aviez simplement exécuté à partir de la ligne de commande comme vous le feriez normalement, les choses devraient fonctionner comme prévu. 
  
-===== to do ===== 
 ** **
 Now for our radio buttons. We have grouped them in two “clusters”. The first two (Radio 1 and Radio 2) will be cluster 1 and the other two will be cluster 2. Click on Radio1 and in the Attribute Editor, set the value to 0 and the variable to “rbc1”. Set the variable for Radio 2 to “rbc1” and the value to 1. Do the same thing for Radio 3 and Radio 4 but for both of these set the variable to “rbc2”. If you want, you can deal with the click of the radiobuttons and print something to the terminal, but for now, the important thing is that the clusters work. Clicking Radio1 will deselect Radio2 and not influence Radio3 or Radio4, and the same for Radio2 and so on. Now for our radio buttons. We have grouped them in two “clusters”. The first two (Radio 1 and Radio 2) will be cluster 1 and the other two will be cluster 2. Click on Radio1 and in the Attribute Editor, set the value to 0 and the variable to “rbc1”. Set the variable for Radio 2 to “rbc1” and the value to 1. Do the same thing for Radio 3 and Radio 4 but for both of these set the variable to “rbc2”. If you want, you can deal with the click of the radiobuttons and print something to the terminal, but for now, the important thing is that the clusters work. Clicking Radio1 will deselect Radio2 and not influence Radio3 or Radio4, and the same for Radio2 and so on.
Ligne 198: Ligne 197:
 The python code can be found on pastebin at http://pastebin.com/qq0YVgTb. The python code can be found on pastebin at http://pastebin.com/qq0YVgTb.
 ** **
 +
 +Maintenant, passons à nos boutons radio. Nous les avons regroupés en deux groupes « clusters ». Les deux premiers (Radio 1 et Radio 2) formeront le groupe 1 et les deux autres seront le groupe 2. Cliquez sur Radio 1 et dans l'éditeur d'attributs, définissez la valeur à 0 et la variable à « rbc1 ». Définissez la variable pour Radio 2 à « rbc1 » et la valeur à 1. Faites la même chose pour Radio 3 et Radio 4, mais pour les deux réglez la variable à « rbc2 ». Si vous voulez, vous pouvez améliorer le clic des boutons radio et imprimer quelque chose dans le terminal, mais pour l'instant, la chose importante est que les groupes fonctionnent. Cliquer sur Radio1 dé-sélectionnera Radio2 et n'aura pas d'influence sur Radio3 ou Radio4, et de même pour Radio2 et ainsi de suite.
 +
 +Enfin, vous devez créer une fonction pour le bouton Exit et la lier au bouton, comme nous l'avons fait dans le premier exemple.
 +
 +Si vous avez suivi depuis le début nos autres applications Tkinter, vous devriez être en mesure de comprendre le code montré ci-dessus à droite. Sinon, merci de retourner dans quelques numéros précédents pour lire une présentation complète de ce code.
 +
 +Vous pouvez voir qu'utiliser Page rend le processus de conception de base beaucoup plus facile que de le faire vous-même. Nous avons seulement commencé à examiner ce que peut faire Page et nous allons faire quelque chose de beaucoup plus réaliste la prochaine fois.
 +
 +Le code python peut être trouvé sur pastebin à http://pastebin.com/ts3MKyCZ.
  
 ** **
Ligne 204: Ligne 213:
 See you next time. See you next time.
 ** **
 +
 +Une note avant de terminer pour ce mois-ci. Vous avez sans doute remarqué que j'ai manqué quelques numéros. Cela est dû au fait que ma femme a été diagnostiquée avec un cancer l'an dernier. Même si j'ai vraiment essayé d'empêcher les choses de tomber à travers les mailles du filet, un certain nombre de choses y sont passées. Une de ces choses est mon ancien domaine/site web www.thedesignatedgeek.com. J'ai fait une grossière erreur et en ai raté le renouvellement. Pour cette raison, le domaine a été vendu sans mon consentement. J'ai mis en place www.thedesignatedgeek.net avec tous les vieux trucs. Je vais travailler dur le mois prochain pour mettre tout cela à jour.
 +
 +Rendez-vous la prochaine fois.
issue58/tuto_python.1331893893.txt.gz · Dernière modification : 2012/03/16 11:31 de frangi