Tuto Python & Tkinter : programmation événementielle
Table des matières
Exercice : Formulaire d’adresse
Exercice : Convertisseur de poids
Introduction
Bonjour et bienvenue dans un nouveau tutoriel Python ! Aujourd’hui, nous allons aborder une nouvelle notion, il s’agit de la programmation évènementielle avec le module Tkinter. Tkinter est un module de Python conçu spécialement pour des fins graphiques comme des fenêtres, des boutons...
À la fin de ce tutoriel, vous serez capable de coder votre première application graphique, manipuler les widgets tels que les boutons et les zones de texte, contrôler la disposition des caractéristiques de vos applications grâce à un gestionnaire géométrique et finalement rendre vos applications interactives en associant des clics de boutons aux fonctions Python.
Ce tutoriel sera riche en exemple d’application et exercices afin de vous permettre de bien pratiquer les notions découvertes le long de ce cours.
1. Tkinter , le module graphique
Tkinter est un module en Python qui permet de développer des interfaces graphiques (GUI) , c’est la bibliothèque standard pour Python. Lorsqu’il est combiné avec Tkinter , Python fournit un moyen rapide et facile de créer des applications GUI. Tkinter fournit une interface orientée objet puissante à la boîte à outils TK GUI. Créer une application GUI en utilisant Tkinter est une tâche facile. Tout ce que vous devez faire est de suivre les étapes suivantes :
- Importer le module Tkinter.
- Créer la fenêtre principale de l’application GUI.
- Ajoutez un ou plusieurs des widgets mentionnés ci-dessus à l’application GUI.
- Entrez la boucle d’événement principale pour prendre des mesures contre chaque événement déclenché par l’utilisateur.
Exemple :
Voici un exemple très basique de la création d’une application avec le module Tkinter.
Syntaxe :
import tkinter as tk
top = tk.Tk()
# partie ajout des widgets
top.mainloop ()
Nous avons exactement suivi les étapes suivies en dessus. D’abord , nous avons importé le module tkinter autant que tk . Ensuite, on a créé la fenêtre principale de notre application, ici nous n’avons ajouté aucun élément graphique. Finalement, nous avons lancé la boucle évènementielle.
Résultat de l’exécution :
2. Outils tinker
2.1. Button
Le widget Bouton est utilisé pour ajouter des boutons dans une application Python. Ces boutons peuvent afficher du texte ou des images qui transmettent le but des boutons. Vous pouvez attacher une fonction ou une méthode à un bouton qui est appelé automatiquement lorsque vous cliquez sur le bouton .
Syntaxe générale :
b= Button(master , option=value,…)
Paramètres:
- activeforeground: Couleur avant plan lorsque le bouton est sous le curseur.
- activebackground: Couleur d’arrière-plan lorsque le bouton se trouve sous le curseur.
- bd: Largeur de bordure en pixels. La valeur par défaut est 2.
- bg: Couleur de fond normale.
- font: Police de texte à utiliser pour l’étiquette du bouton.
- height: Hauteur du bouton en lignes de texte (pour les boutons textuels) ou en pixels (pour les images).
- highlightcolor: La couleur de la mise au point est mise en évidence lorsque le widget a la mise au point.
Exemple :
Voici un exemple de l’usage du widget button .
Syntaxe :
import tkinter
from tkinter import messagebox
view = tkinter.Tk()
def fonctionhello():
tkMessageBox.showinfo( "Hello Python", "Hello World")
B = tkinter.Button(view, text ="Hello", command = fonctionhello)
B.pack()
top.mainloop()
Résultat de l’exécution :
2.2. Check button
Le widget Checkbutton est utilisé pour afficher un certain nombre d’options comme cases à cocher. L’utilisateur peut sélectionner plusieurs options à la fois.
Syntaxe générale :
button = Checkbutton ( master, option, ...)
Paramètres :
- activebackground : Couleur d’arrière-plan lorsque le bouton de contrôle se trouve sous le curseur.
- activeforeground : Couleur avant plan lorsque le bouton de contrôle se trouve sous le curseur.
- bg : La couleur d’arrière-plan normale affichée derrière l’étiquette et l’indicateur.
- bitmap : permet d’afficher une image monochrome sur un bouton.
- bd : La taille de la bordure autour de l’indicateur. Par défaut est de 2 pixels.
Syntaxe :
from tkinter import *
from tkinter import messagebox
import tkinter
panel = tkinter.Tk()
Var1 = IntVar()
Var2 = IntVar()
button1= Checkbutton(panel, text = "Réponse 1", variable = Var1, \
onvalue = 1, offvalue = 0, height=5, \
width = 20)
button2 = Checkbutton(panel, text = "Réponse 2", variable = Var2, \
onvalue = 1, offvalue = 0, height=5, \
width = 20)
button1.pack()
button2.pack()
panel.mainloop()
Résultat de l’exécution :
2.3. Frame
Le widget Frame est très important pour le processus de regroupement et d’organisation d’autres widgets d’une manière en quelque sorte amicale. Il fonctionne comme un conteneur, qui est responsable de l’organisation de la position des autres widgets.??
Il utilise des zones rectangulaires dans l’écran pour organiser la mise en page et de fournir le remplissage de ces widgets. Un cadre peut également être utilisé comme classe de base pour implémenter des widgets complexes.
Syntaxe générale :
frame = Frame (master, option, ...)
Paramètres :
Voici quelques paramètres essentiels à connaître du widget frame :
- bg : La couleur d’arrière-plan normale affichée derrière l’étiquette et l’indicateur.
- bd : La taille de la bordure autour de l’indicateur.Par défaut est de 2 pixels.
- cursor : Si vous définissez cette option à un nom de curseur (flèche, point, etc.), le curseur de la souris va changer pour ce modèle quand il est sur le bouton de contrôle.
- width : La largeur par défaut d’un bouton de contrôle est déterminée par la taille de l’image ou du texte affiché. Vous pouvez définir cette option à un certain nombre de caractères et le bouton de contrôle aura toujours de la place pour ce nombre de caractères.
- height : La dimension verticale du nouveau cadre.
- highlightbackground : Couleur de la mise au point lorsque le cadre n’a pas de mise au point.
- highlightcolor : Couleur affichée dans la mise au point lorsque le cadre a la mise au point.
Exemple :
Syntaxe :
from tkinter import *
root = Tk()
frame = Frame(root)
frame.pack()
bframe = Frame(root)
bframe.pack( side = BOTTOM )
boutonrouge = Button(frame, text="Pomme", fg="red")
boutonrouge.pack( side = LEFT)
boutonvert = Button(frame, text="Banane", fg="yellow")
boutonvert.pack( side = LEFT )
boutonbleu = Button(frame, text="Prune", fg="blue")
boutonbleu.pack( side = LEFT )
boutonnoir = Button(bframe, text="Pêche", fg="black")
boutonnoir.pack( side = BOTTOM)
root.mainloop ()
Résultat de l’exécution :
2.4. Label
Ce widget implémente une zone d’affichage où vous pouvez placer du texte ou des images. Le texte affiché par ce widget peut être mis à jour à tout moment que vous voulez.Il est également possible de souligner une partie du texte (comme pour identifier un raccourci clavier) et de parcourir le texte sur plusieurs lignes.
Syntaxe générale :
label = Label ( master, option,.. )
Paramètres :
- anchor : Cette option contrôle où le texte est positionné si le widget a plus d’espace que le texte a besoin. La valeur par défaut est anchor=CENTER, qui centre le texte dans l’espace disponible.
- bitmap : Définissez cette option égale à un objet bitmap ou image et l’étiquette affichera ce graphique.
- bg : La couleur d’arrière-plan normale affichée derrière l’étiquette et l’indicateur.
- bd : La taille de la bordure autour de l’indicateur. Par défaut est de 2 pixels.
- cursor : Si vous définissez cette option à un nom de curseur (flèche, point, etc.), le curseur de la souris va changer pour ce modèle quand il est sur le bouton de contrôle.
- font : Si vous affichez du texte dans cette étiquette (avec l’option text ou textvariable, l’option font spécifie dans quelle police ce texte sera affiché.
Exemple :
Syntaxe :
from Tkinter import *
base = Tk()
variable = StringVar()
label = Label( base, textvariable=variable, relief=RAISED )
variable.set ("Bonjour! Comment-allez vous ? ")
label.pack()
base.mainloop()
Résultat de l’exécution :
2.5. Menu
Le but de ce widget est de nous permettre de créer toutes sortes de menus qui peuvent être utilisés par nos applications. La fonctionnalité de base permet de créer trois types de menus : toplevel ,pop-up et pull-down.Il est également possible d’utiliser d’autres widgets étendus pour implémenter de nouveaux types de menus, tels que le widget OptionMenu, qui implémente un type spécial qui génère une liste pop-up d’éléments dans une sélection.
Syntaxe générale :
menu = Menu (master, option)
Voici quelques paramètres du widget menu .
Paramètres :
- activebackground : La couleur de fond qui apparaîtra sur un choix quand il est sous la souris.
- activeforeground : La couleur de premier plan qui apparaîtra sur un choix quand il est sous la souris.
- activeborderwidth : Spécifie la largeur d’une bordure tracée autour d’un choix lorsqu’elle se trouve sous la souris. La valeur par défaut est 1 pixel.
- bg : couleur de fond sous la souris .
- bd : La largeur de la bordure autour de tous les choix.La valeur par défaut est 1.
- cursor : Le curseur qui apparaît lorsque la souris est sur les choix, mais seulement lorsque le menu a été sélectionné.
- font : La police par défaut pour les choix textuels.
Exemple :
Syntaxe :
from tkinter import *
def funct():
file = Toplevel (root)
bouton = Button (file, text="Ne rien faire")
bouton.pack()
base = Tk()
menub = Menu (base)
filemenu = Menu(menub, tearoff=0)
filemenu.add_command(label="Nouveau", command=funct)
filemenu.add_command(label="Ouvrir", command=funct)
filemenu.add_command(label="Enregistrer", command=funct)
filemenu.add_command(label="Enregistrer sous...", command=funct)
filemenu.add_command(label="Fermer", command=funct)
filemenu.add_separator()
filemenu.add_command(label="Quitter", command=base.quit)
menub.add_cascade(label="Fichier", menu=filemenu)
editmenu = Menu(menub, tearoff=0)
editmenu.add_command(label="Annuler", command=funct)
editmenu.add_separator()
editmenu.add_command(label="Couper", command=funct)
editmenu.add_command(label="Copier", command=funct)
editmenu.add_command(label="Coller", command=funct)
editmenu.add_command(label="supprimer ", command=funct)
editmenu.add_command(label="Tout selectionner", command=funct)
menub.add_cascade(label="Modifier", menu=editmenu)
helpmenu = Menu(menub, tearoff=0)
helpmenu.add_command(label=" Index", command=funct)
helpmenu.add_command(label="A propos...", command=funct)
menub.add_cascade(label="Aide", menu=helpmenu)
base.config(menu=menub)
base.mainloop()
Résultat de l’exécution :
Si vous cliquez sur les onglets fichier , modifier ou aide . Les menus apparaitront.
2.6. Message
Ce widget fournit un objet multiligne et non modifiable qui affiche des textes, brisant automatiquement les lignes et justifiant leur contenu.
Sa fonctionnalité est très similaire à celle fournie par le widget Label, sauf qu’il peut également envelopper automatiquement le texte, en maintenant une largeur ou un format donné auparavant.
Syntaxe générale :
message = Message ( master, option, ...)
Paramètres :
- anchor : Cette option contrôle où le texte est positionné si le widget a plus d’espace que dont le texte a besoin.La valeur par défaut est anchor=CENTER, qui centre le texte dans l’espace disponible.
- bitmap : Définissez cette option égale à un objet bitmap ou image et l’étiquette affichera ce graphique.
- bg : La couleur d’arrière-plan normale affichée derrière l’étiquette et l’indicateur.
- cursor : Si vous définissez cette option à un nom de curseur (flèche, point, etc.), le curseur de la souris va changer pour ce modèle quand il est sur le bouton de contrôle.
- font : Si vous affichez du texte dans cette étiquette (avec l’option text ou textvariable, l’option font spécifie dans quelle police ce texte sera affiché.
- bd : La taille de la bordure autour de l’indicateur. Par défaut est de 2 pixels.
Exemple :
Voici un exemple de l’utilisation du widget message .
Syntaxe :
from tkinter import *
base = Tk()
variable = StringVar()
message = Message( base, textvariable=variable, relief=RAISED )
variable.set("Bonjour! Comment allez vous ?")
message.pack ()
base.mainloop ()
Résultat de l’exécution :
Exercice : Formulaire d’adresse
Enoncé :
Dans cet exercice on veut créer un formulaire d’adresse qui contient les widgets suivants :
- Nom
- Prénom
- Adresse 1
- Adresse 2
- Ville
- État / province
- Code Postal
- Pays
Ainsi que deux boutons envoyer et annuler .
Solution :
Voici une proposition de solution :
Syntaxe :
import tkinter as tk
# Créer une nouvelle fenêtre avec le titre "Formulaire de saisie d’adresse"
fenetre = tk.Tk()
fenetre.title("Formulaire d'adresse")
# Créer un nouveau cadre « fr_form » pour contenir l’étiquette
fr_form = tk.Frame(relief=tk.SUNKEN, borderwidth=3)
# Emballer le cadre dans la fenêtre
fr_form.pack()
# créer les widgets Libellé et Entrée pour "Prénom"
lbl_first_name = tk.Label(master=fr_form, text="Nom:")
ent_first_name = tk.Entry(master=fr_form, width=50)
# Utilisez le gestionnaire de géométrie de grille pour placer l'étiquette et
# Widgets d'entrée dans les première et deuxième colonnes du premier rang
lbl_first_name.grid(row=0, column=0, sticky="e")
ent_first_name.grid(row=0, column=1)
#Créez les widgets Libellé et Entrée pour "Nom de famille"
lbl_last_name = tk.Label(master=fr_form, text="Prénom:")
ent_last_name = tk.Entry(master=fr_form, width=50)
# Placez les widgets dans la deuxième ligne de la grille
lbl_last_name.grid(row=1, column=0, sticky="e")
ent_last_name.grid(row=1, column=1)
# Créez les widgets Libellé et Entrée pour "Ligne d'adresse 1"
lbl_address1 = tk.Label(master=fr_form, text="Addresse 1:")
ent_address1 = tk.Entry(master=fr_form, width=50)
# Place the widgets in the third row of the grid
lbl_address1.grid(row=2, column=0, sticky="e")
ent_address1.grid(row=2, column=1)
# Créez les widgets Libellé et Entrée pour "Ligne d'adresse 2"
lbl_address2 = tk.Label(master=fr_form, text="Addresse 2:")
ent_address2 = tk.Entry(master=fr_form, width=5)
# Placez les widgets dans la quatrième ligne de la grille
lbl_address2.grid(row=3, column=0, sticky=tk.E)
ent_address2.grid(row=3, column=1)
#Créer les widgets Label et Entry pour "Ville"
lbl_city = tk.Label(master=fr_form, text="Ville:")
ent_city = tk.Entry(master=fr_form, width=50)
# Placez les widgets dans la cinquième rangée de la grille
lbl_city.grid(row=4, column=0, sticky=tk.E)
ent_city.grid(row=4, column=1)
# Créer les widgets Label et Entry pour "Etat/province"
lbl_state = tk.Label(master=fr_form, text="Etat/province:")
ent_state = tk.Entry(master=fr_form, width=50)
# Placez les widgets dans la sixième rangée de la grille
lbl_state.grid(row=5, column=0, sticky=tk.E)
ent_state.grid(row=5, column=1)
# Créer les widgets Label et Entry pour "Code postal"
lbl_postal_code = tk.Label(master=fr_form, text=" Code postal:")
ent_postal_code = tk.Entry(master=fr_form, width=50)
# Placez les widgets dans la septième rangée de la grille
lbl_postal_code.grid(row=6, column=0, sticky=tk.E)
ent_postal_code.grid(row=6, column=1)
# Créer les widgets Label et Entry pour "Pays"
lbl_country = tk.Label(master=fr_form, text="Pays:")
ent_country = tk.Entry(master=fr_form, width=50)
# Placez les widgets dans la huitième rangée de la grille
lbl_country.grid(row=7, column=0, sticky=tk.E)
ent_country.grid(row=7, column=1)
#Créer un nouveau cadre « frm_buttons » pour contenir
#les boutons envoyer et annuler. This frame fills the
frm_buttons = tk.Frame()
frm_buttons.pack(fill=tk.X, ipadx=5, ipady=5)
# Créer le bouton "envoyer"
btn_submit = tk.Button(master=frm_buttons, text="Envoyer")
btn_submit.pack(side=tk.RIGHT, padx=10, ipadx=10)
# Créer le bouton "annuler"
btn_clear = tk.Button(master=frm_buttons, text="Supprimer")
btn_clear.pack(side=tk.RIGHT, ipadx=10)
# lancer application
fenetre.mainloop()
Résultat de l’exécution :
Exercice : Convertisseur de poids
Enoncé :
Dans cet exemple, on veut créer un convertisseur de poids qui permet à l’utilisateur d’entrer le poids en kilogrammes et d’appuyer sur le bouton pour convertir ce poids en grammes.
Avant de commencer à coder, vous allez d’abord concevoir l’application. Vous avez besoin de trois éléments :
Un widget Entry appelé ent_poids pour saisir la valeur Kilogrammes .
Un widget Label appelé label_result pour afficher le résultat en grammes.
Un widget Button appelé bouton convertir qui lit la valeur du widget Entry, la convertit de Kilogrammes en grammes, et définit le texte du widget Label au résultat lorsque vous cliquez dessus .
Vous pouvez les disposer dans une grille avec une seule ligne et une colonne pour chaque widget. Cela vous donne une application qui fonctionne le moins bien, mais qui n’est pas très conviviale. Tout doit avoir des étiquettes.
Vous placerez un label directement à droite du widget ent_poids contenant le symbole Kilogramme( ) afin que l’utilisateur sache que la valeur ent_poids devrait être en Kilogrammes.
A vous de jouer !
Solution :
Syntaxe :
import tkinter as tk
def kilo_to_gramme():
"""Convertit la valeur du poids du kilogramme au gramme et insère le résultat obtenu dans label_result.
"""
kilogramme = ent_poids.get()
gramme = 1000 * float(kilogramme)
label_result["text"] = f"{round(gramme, 2)} g"
# Configuration de la fenêtre
fenetre = tk.Tk()
fenetre.title("Convertisseur de poids")
fenetre.resizable(width=False, height=False)
# Créer le cadre d’entrée Kilogramme avec une entrée
# widget et label
frm_entry = tk.Frame(master=fenetre)
ent_poids = tk.Entry(master=frm_entry, width=10)
lbl_temp = tk.Label(master=frm_entry, text="Kg")
# mettre en page l’entrée et l’étiquette du poids dans frm_entry
# utilisant le gestionnaire de géométrie .
ent_poids.grid(row=0, column=0, sticky="e")
lbl_temp.grid(row=0, column=1, sticky="w")
# Créer le bouton de conversion et afficher le résultat Étiquette
btn_convert = tk.Button(
master=fenetre,
text="\N{RIGHTWARDS BLACK ARROW}",
command=kilo_to_gramme
)
label_result = tk.Label(master=fenetre, text="g")
# Configurer la disposition à l’aide du gestionnaire de géométrie .
frm_entry.grid(row=0, column=0, padx=10)
btn_convert.grid(row=0, column=1, pady=10)
label_result.grid(row=0, column=2, padx=10)
# lancer l'application
fenetre.mainloop()
Résultat de l’exécution :
Conclusion
Nous sommes arrivés à la fin de ce tutoriel, maintenant vous savez comment démarrer avec la programmation GUI Python. Tkinter est un choix convaincant pour un framework GUI Python car il est intégré dans la bibliothèque standard Python, et il est relativement essentiel de faire des applications avec ce framework.
Maintenant que vous maîtrisez les bases de la programmation GUI Python avec Tkinter, la prochaine étape est de construire certaines de vos propres applications. Qu’allez-vous créer ? Partagez vos projets amusants dans les commentaires ci-dessous !
Finalement, Tkinter est un module très riche et contient d’autres fonctionnalités qu’on verra dans les prochains tutoriels.
Vous êtes sur la bonne route, continuez ainsi. Bon courage et à un prochain tutoriel chers lecteurs.
Article publié le 10 Novembre 2020par Mouna HAMIM