teaching:progappchim:tkinter_gui_simple

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édentes Révision précédente
Prochaine révision
Révision précédente
Prochaine révisionLes deux révisions suivantes
teaching:progappchim:tkinter_gui_simple [2013/11/21 15:30] villersdteaching:progappchim:tkinter_gui_simple [2020/02/03 03:19] – [Insérer une image (photoimage)] villersd
Ligne 2: Ligne 2:
  
 ===== Quelques références de base pour utiliser Tkinter ===== ===== Quelques références de base pour utiliser Tkinter =====
 +  * Documentation officielle :
 +    * [[https://docs.python.org/3/library/tk.html|Les interfaces graphiques TK]]
 +      * [[https://docs.python.org/3/library/tkinter.html|tkinter — interface Python à Tcl/Tk]], reprenant quelques références recommandées
 +      * Python 3 avec Tk intègre également les extensions [[https://docs.python.org/3/library/tkinter.ttk.html|ttk]] et [[https://docs.python.org/3/library/tkinter.tix.html|tix]], ainsi que l'IDE [[https://docs.python.org/3/library/idle.html|Idle]]
   * [[http://inforef.be/swi/download/apprendre_python.pdf|Chapitre 8 du livre ”apprendre à programmer avec Python”, de Gérard Swinnen]]   * [[http://inforef.be/swi/download/apprendre_python.pdf|Chapitre 8 du livre ”apprendre à programmer avec Python”, de Gérard Swinnen]]
     * [[http://fr.wikibooks.org/wiki/Apprendre_%C3%A0_programmer_avec_Python/Utilisation_de_fen%C3%AAtres_et_de_graphismes|version en wiki]]     * [[http://fr.wikibooks.org/wiki/Apprendre_%C3%A0_programmer_avec_Python/Utilisation_de_fen%C3%AAtres_et_de_graphismes|version en wiki]]
Ligne 7: Ligne 11:
   * [[http://www.pythonware.com/library/tkinter/introduction/index.htm|An Introduction to Tkinter, de Fredrik Lundh]] (tutoriel Tk)   * [[http://www.pythonware.com/library/tkinter/introduction/index.htm|An Introduction to Tkinter, de Fredrik Lundh]] (tutoriel Tk)
   * [[http://effbot.org/tkinterbook/|An Introduction to Tkinter, sur effbot.org]]   * [[http://effbot.org/tkinterbook/|An Introduction to Tkinter, sur effbot.org]]
 +  * [[http://www.python-course.eu/python_tkinter.php|Tkinter tutorial]], sur python-course.eu
 +  * [[http://cs.mcgill.ca/~hv/classes/MS/TkinterPres/]]
  
-===== Un Label affichant "Bonjour !" ===== +<note warning>Entre Python 2 et Python 3, le nom de la librairie "Tkinter" est passé à tkinter ! (première lettre en bas de casse). L'utilisation sous Python 3 des exemples ci-dessous nécessite aussi de transformer les instructions print en print().</note> 
-<sxh python; title : Tk-00.py>+ 
 +===== Une étiquette (Labelaffichant "Bonjour !" ===== 
 +<code python tk-00.py>
 #!/usr/bin/env python #!/usr/bin/env python
 # -*- coding: utf-8 -*- # -*- coding: utf-8 -*-
  
-from Tkinter import *+from tkinter import *
  
-root=Tk()+root = Tk()
 w=Label(root, text="Bonjour !") w=Label(root, text="Bonjour !")
 w.pack() w.pack()
  
 root.mainloop() root.mainloop()
-</sxh>+</code>
  
-===== Un bouton avec une action pour écrire ======+===== Un bouton (Button) avec une action pour écrire ======
 L'écriture va s'effectuer sur la console ! L'écriture va s'effectuer sur la console !
-<sxh python; title : Tk-01.py>+<code python tk-01.py>
 #!/usr/bin/env python #!/usr/bin/env python
 # -*- coding: utf-8 -*- # -*- coding: utf-8 -*-
  
-from Tkinter import *+from tkinter import *
  
 def action(): def action():
-    print "Yes, we can !"+    print("Yes, we can !")
  
-root=Tk() +root = Tk() 
-#w=Label(root, text="Bonjour!")+#w = Label(root, text="Bonjour!")
 #w.pack() #w.pack()
  
-b=Button(root,text="Click here !",command=action)+b = Button(root,text="Click here !",command=action)
 b.pack() b.pack()
  
 root.mainloop() root.mainloop()
-</sxh>+</code>
  
-===== Champ d'entrée =====+<note tip>Voyez à décommenter les deux lignes concernant l'étiquette "W" !</note> 
 + 
 +Pour le placement des composants dans la fenêtre, Tkinter utilise 3 méthodes (pack, grid, place) décrites [[http://www.python-course.eu/tkinter_layout_management.php|ici]], ou sur eefbot ([[http://effbot.org/tkinterbook/grid.htm|grid]], [[http://effbot.org/tkinterbook/pack.htm|pack]], et [[http://effbot.org/tkinterbook/place.htm|place]]). 
 + 
 +===== Champ d'entrée (Entry) =====
 On peut mettre un champ d'entrée et y introduire du texte On peut mettre un champ d'entrée et y introduire du texte
-<sxh python; title : Tk-02.py>+<code python tk-02.py>
 #!/usr/bin/env python #!/usr/bin/env python
 # -*- coding: utf-8 -*- # -*- coding: utf-8 -*-
  
-from Tkinter import *+from tkinter import *
  
 def action(): def action():
-    print "Yes, we can !"+    print("Yes, we can !")
  
-root=Tk() +root = Tk() 
-#w=Label(root, text="Bonjour!"+#w = Label(root, text="Bonjour!"
-#w.pack()+#w.grid(row=?)
  
-champ=Entry(root)+champ = Entry(root)
 champ.grid(row=0) champ.grid(row=0)
  
-b=Button(root,text="Click here !",command=action)+b = Button(root,text="Click here !",command=action)
 b.grid(row=1) b.grid(row=1)
 root.mainloop() root.mainloop()
-</sxh>+</code> 
 +<note warning>Si on à décommente les deux lignes concernant l'étiquette "W", comment actualiser les "numéros" de row pour afficher l'étiquette, le champ d'entrée et le bouton ?!</note>
  
 ===== Utiliser le texte rentré ===== ===== Utiliser le texte rentré =====
-En cliquant, on quitte et on écrit le texte rentré +En cliquant, on quitte et on écrit le texte rentré (on n'utilise pas la fonction "action") 
-<sxh python; title : Tk-03.py>+<code python tk-03.py>
 #!/usr/bin/env python #!/usr/bin/env python
 # -*- coding: utf-8 -*- # -*- coding: utf-8 -*-
  
-from Tkinter import *+from tkinter import *
  
 def action(): def action():
-    print "Yes, we can !"+    print("Yes, we can !"
 +    # impression de la valeur du champ 
 +    abcdef = champ.get() 
 +    print(abcdef)
  
-root=Tk() +root = Tk() 
-#w=Label(root, text="Bonjour!")+w = Label(root, text="Bonjour!"
 +w.grid(row=0)
  
-champ=Entry(root) +champ = Entry(root) 
-champ.grid(row=0)+champ.grid(row=1) 
 + 
 +b = Button(root,text="Click here !",command=action) 
 +b.grid(row=2) 
 +c = Button(root,text="Quit",command=root.quit) 
 +c.grid(row=3)
  
-b=Button(root,text="Click here !",command=root.quit) 
-b.grid(row=1) 
 root.mainloop() root.mainloop()
  
-# lecture de la valeur du champ 
-abcdef=champ.get() 
-print abcdef 
 # éliminer la fenêtre : # éliminer la fenêtre :
 root.destroy() root.destroy()
-</sxh>+ 
 +</code>
  
 ===== Valeurs numériques et calcul ===== ===== Valeurs numériques et calcul =====
 On fait un calcul avec la valeur rentrée, on quitte et on écrit  On fait un calcul avec la valeur rentrée, on quitte et on écrit 
-<sxh python; title : Tk-04.py>+<code python tk-04.py>
 #!/usr/bin/env python #!/usr/bin/env python
 # -*- coding: utf-8 -*- # -*- coding: utf-8 -*-
  
-from Tkinter import *+from tkinter import *
  
 def factorielle(argu): def factorielle(argu):
     # calcul de la factorielle de argu     # calcul de la factorielle de argu
-    a=1  # a contient une valeur qui va être incrémentée d'une unité à la fois +    a = 1  # a contient une valeur qui va être incrémentée d'une unité à la fois 
-    b=1  # contient la factorielle de a-1 +    b = 1  # contient la factorielle de a-1 
-    while a<=argu:  # on arrêtera lorsque a sera > argu +    while a <= argu:  # on arrêtera lorsque a sera > argu 
-        b=b * a +        b = b * a 
-        a=a+1+        a = a + 1
     return b     return b
  
 def action(): def action():
-    print "Yes, we can !"+    print("Yes, we can !")
  
 root=Tk() root=Tk()
 #w=Label(root, text="Bonjour!") #w=Label(root, text="Bonjour!")
  
-champ=Entry(root)+champ = Entry(root)
 champ.grid(row=0) champ.grid(row=0)
  
-b=Button(root,text="Click here !",command=root.quit)+b = Button(root,text="Click here !",command=root.quit)
 b.grid(row=1) b.grid(row=1)
 root.mainloop() root.mainloop()
Ligne 126: Ligne 144:
 # lecture de la valeur du champ # lecture de la valeur du champ
 texte_n=champ.get() texte_n=champ.get()
-n=int(texte_n) +n = int(texte_n) 
-print n, factorielle(n)+print(n, factorielle(n))
 # éliminer la fenêtre : # éliminer la fenêtre :
 root.destroy() root.destroy()
-</sxh>+</code>
  
 ===== Tout faire dans interface graphique ===== ===== Tout faire dans interface graphique =====
 Ce programme utilise un Label pour afficher le résultat, on ne quitte plus et on peut recalculer sur d'autres valeurs entrées. Il y a un bouton pour terminer. Ce programme utilise un Label pour afficher le résultat, on ne quitte plus et on peut recalculer sur d'autres valeurs entrées. Il y a un bouton pour terminer.
-<sxh python; title : Tk-05.py>+<code python tk-05.py>
 #!/usr/bin/env python #!/usr/bin/env python
 # -*- coding: utf-8 -*- # -*- coding: utf-8 -*-
  
-from Tkinter import *+from tkinter import *
  
 def factorielle(argu): def factorielle(argu):
     # calcul de la factorielle de argu     # calcul de la factorielle de argu
-    a=1  # a contient une valeur qui va être incrémentée d'une unité à la fois +    a = 1  # a contient une valeur qui va être incrémentée d'une unité à la fois 
-    b=1  # contient la factorielle de a-1+    b = 1  # contient la factorielle de a-1
     while a<=argu:  # on arrêtera lorsque a sera > argu     while a<=argu:  # on arrêtera lorsque a sera > argu
-        b=b * a +        b = b * a 
-        a=a+1+        a = a + 1
     return b     return b
  
 def action(): def action():
-    texte_n=champ.get() +    texte_n = champ.get() 
-    n=int(texte_n)+    n = int(texte_n)
     affichefacto.configure(text =str(factorielle(n)))     affichefacto.configure(text =str(factorielle(n)))
  
 root=Tk() root=Tk()
  
-champ=Entry(root)+champ = Entry(root)
 champ.grid(row=0) champ.grid(row=0)
  
-b=Button(root,text="Calcule la factorielle",command=action)+b = Button(root,text="Calcule la factorielle",command=action)
 b.grid(row=1) b.grid(row=1)
  
-affichefacto=Label(root)+affichefacto = Label(root)
 affichefacto.grid(row=2) affichefacto.grid(row=2)
  
-bfin=Button(root,text="Terminer",command=root.quit)+bfin = Button(root,text="Terminer",command=root.quit)
 bfin.grid(row=3) bfin.grid(row=3)
  
 root.mainloop() root.mainloop()
  
-# éliminer la fenêtre :+# éliminer la fenêtre après avoir quitté :
 root.destroy() root.destroy()
-</sxh>+</code> 
 + 
 +Pour d'autres exemples, voir par exemple : 
 +  * [[http://www.python-course.eu/tkinter_entry_widgets.php]]
  
 ===== Canvas : des rectangles et des mouvements ===== ===== Canvas : des rectangles et des mouvements =====
-<sxh python; title : Tk_canvas_rectangles_move.py>+<code python tk_canvas_rectangles_move.py>
 #! /usr/bin/env python #! /usr/bin/env python
 # -*- coding: utf-8 -*- # -*- coding: utf-8 -*-
 # Exemple utilisation du Canvas Tk pour gérer une boite avec couvercle mobile # Exemple utilisation du Canvas Tk pour gérer une boite avec couvercle mobile
  
-from Tkinter import *+from tkinter import *
  
 def move(): def move():
Ligne 207: Ligne 228:
  
 can.mainloop() can.mainloop()
-</sxh>+</code> 
 + 
 +Pour d'autres exemples, voir par exemple :  
 +  * [[http://www.python-course.eu/tkinter_canvas.php]] 
 + 
 +===== Une étiquette dynamique ===== 
 +<code python compteur-01.py> 
 +#! /usr/bin/env python 
 +# -*- coding: utf-8 -*- 
 +# Exemple d'une étiquette dynamique par récursion 
 + 
 +import tkinter as tk 
 + 
 +def compteur_label(lab): 
 +    def compte(): 
 +        global compteur 
 +        compteur += 1 
 +        lab.config(text=str(compteur)) 
 +        lab.after(1000, compte) 
 +    compte() 
 +  
 +  
 +root = tk.Tk() 
 +root.title("Comptage en secondes"
 +label = tk.Label(root, fg="dark green"
 +label.pack() 
 +compteur = -1  
 +compteur_label(label) 
 +button = tk.Button(root, text='Arrêtez !', width=25, command=root.destroy) 
 +button.pack() 
 +root.mainloop() 
 +</code> 
 + 
 +===== Créer des points avec la souris ===== 
 +<code python points_souris-02.py> 
 +#!/usr/bin/env python 
 +# -*- coding: utf-8 -*- 
 +# créer des points à l'aide de la souris 
 +# refs :  
 +# http://effbot.org/tkinterbook/tkinter-events-and-bindings.htm 
 + 
 +from tkinter import * 
 + 
 +def point(event): 
 + can.create_oval(event.x-4, event.y-4, event.x+4, event.y+4, outline="black", fill="red"
 + points.append([event.x,event.y]) 
 + return 
 + 
 +root = Tk() 
 +root.title("Créer des points !") 
 +points = [] 
 +can = Canvas(root, bg="grey", width=640, height= 480) 
 +can.configure(cursor="crosshair"
 +can.grid(row=0) 
 +can.bind("<Button-1>", point) 
 +b = Button(root,text="Quitter",command=root.destroy) 
 +b.grid(row=1) 
 +root.mainloop() 
 +print(points) 
 +</code> 
 + 
 +Pour la gestion des événements, leur déclenchement, voir par exemple [[http://www.python-course.eu/tkinter_events_binds.php|cette page]]. 
 + 
 +===== Utiliser des boutons radio (radiobuttons) ===== 
 +<code python radiobuttons.py> 
 +#! /usr/bin/env python 
 +# -*- coding: utf-8 -*- 
 +# Exemple d'utilisation des boutons radio 
 + 
 +import tkinter as tk 
 + 
 +def affiche_choix(): 
 +    i = v.get() 
 +    print(i, positions[i-1][0]) 
 + 
 +root = tk.Tk() 
 +v = tk.IntVar() 
 +v.set(1)  # choix par défaut 
 + 
 +positions = [("ortho",1),("meta",2),("para",3)] 
 + 
 +lab = tk.Label(root, text="Choix de la position", fg="dark blue"
 +lab.pack() 
 + 
 +for txt, val in positions: 
 +    b = tk.Radiobutton(root, text=txt, padx = 10, variable=v, command=affiche_choix, value=val) 
 +    b.pack() 
 + 
 +tk.mainloop() 
 +</code> 
 + 
 +===== Utiliser des cases à cocher (checkbuttons) ===== 
 +<code python checkbuttons-03.py> 
 +#! /usr/bin/env python 
 +# -*- coding: utf-8 -*- 
 +# Exemple d'utilisation des cases à cocher 
 + 
 +import tkinter as tk 
 + 
 +def affiche_choix(): 
 +    print(zip(elements, [etats[i].get() for i in range(len(elements))])) 
 +    print(elements, [etats[i].get() for i in range(len(elements))]) 
 + 
 +root = tk.Tk() 
 +lab = tk.Label(root, text="Cochez les éléments présents", bg="red", fg="dark blue"
 +lab.grid(row = 0) 
 + 
 +elements = ['C','H','O','N','P','S',u'éléments métalliques',u'halogénures',u'autres'
 +etats = [] 
 +nelem = len(elements) 
 + 
 +for i in range(nelem): 
 +    etat = tk.IntVar() 
 +    caco = tk.Checkbutton(root, text=elements[i], variable=etat,width = 20,padx=50,anchor = tk.W) 
 +    caco.grid(row = i+1) 
 +    etats.append(etat) 
 + 
 +button = tk.Button(root, text='Affichez !', width=25, command=affiche_choix) 
 +button.grid(row = nelem+1) 
 + 
 +tk.mainloop() 
 +</code> 
 + 
 +===== Les listes de choix (spinbox, listbox) ===== 
 +FIXME (à écrire) 
 + 
 +===== Insérer une image (photoimage) ===== 
 +Télécharger l'image exemple au format png dans le même répertoire que le programme python 
 +<code python image_import-01.py> 
 +#!/usr/bin/env python 
 +# -*- coding: utf-8 -*- 
 +""" 
 +insert a PNG image into a python tkinter window 
 +image png : https://upload.wikimedia.org/wikipedia/commons/c/c0/Wikipedia-sipi-image-db-mandrill-4.2.03-quantize-only-CCC.png 
 +cf. https://commons.wikimedia.org/wiki/File:Wikipedia-sipi-image-db-mandrill-4.2.03-quantize-only-CCC.png 
 +""" 
 + 
 +import tkinter as tk 
 + 
 +root = tk.Tk() 
 +img = tk.PhotoImage(file = "mandrill.png"
 +label = tk.Label(root, image = img) 
 +#label.pack() 
 +label.grid() 
 +root.mainloop() 
 +</code> 
 + 
 +  * Image utilisée historiquement fréquemment en traitement d'images : [[https://en.wikipedia.org/wiki/Lenna]] 
 +    * [[https://campaignbrief.com/creatable-code-like-a-girl-partner-with-clemenger-sydney-finch-kamber-and-facebook-to-launch-losing-lena-removing-one-image-to-make-millions-of-women-feel-welcome-in-tech/|Campagne de modification de cet usage]] + [[https://www.losinglena.com/]] 
 +  * Base d'images pour test : [[http://sipi.usc.edu/database/]] - exemple : 
 +    * [[http://sipi.usc.edu/database/database.php?volume=misc&image=10#top]] 
 +    * [[https://commons.wikimedia.org/wiki/File:Wikipedia-sipi-image-db-mandrill-4.2.03-quantize-only-CCC.png]] 
 + 
 +{{  https://upload.wikimedia.org/wikipedia/commons/c/c0/Wikipedia-sipi-image-db-mandrill-4.2.03-quantize-only-CCC.png?256x256  }} 
 + 
 +===== Autres composants logiciels (widgets) de Tkinter ===== 
 +Voici une liste et des liens vers des exemples pour d'autres widgets : 
 + 
 +^Widgets ^ Exemples ^   
 +|Sliders (curseur de défilement) |[[http://www.python-course.eu/tkinter_sliders.php]] | 
 +|Texte |[[http://www.python-course.eu/tkinter_text_widget.php]]| 
 +|Boites de dialogue |[[http://www.python-course.eu/tkinter_dialogs.php]]| 
 +|Menus |[[http://www.python-course.eu/tkinter_menus.php]]| 
 +|Barres de progression (progressbar) | | 
 +|Échelles (scale) | | 
 + 
 +Références et démonstrations : 
 +  * [[http://www.shido.info/py/python6_e.html]] 
 +  * [[http://pythonfacile.free.fr/python/demotkinter.html]] 
 +  * [[http://tkinter.unpythonic.net/wiki/A_tour_of_Tkinter_widgets]] 
 +  * [[http://pyinmyeye.blogspot.be/2012/07/tkinter-demos.html]] 
 +  *  
 +===== Des exemples d'application ===== 
 +  * [[http://www.python-course.eu/tkinter_mastermind.php|Mastermind]]
  
  • teaching/progappchim/tkinter_gui_simple.txt
  • Dernière modification : 2023/01/19 15:46
  • de villersd