Interface tkinter

Question

Bonjour, dans le cadre du bac avec la spécialité ISN, nous devons créer un projet de fin d'année. Nous avons choisi de réaliser une calculatrice avec l'interface graphique tkinter et le logiciel, amiens python. 
Nous rencontrons certaines difficultés notamment de mise en page. Est-ce possible d'étirer une zone de saisie sur plusieurs colonnes afin que tous les autres boutons soient de la même taille ? 


Voici la photo de notre interface tkinter. Merci d'avance

Mints · Answer

Salut, pour obtenir ce genre de résultat par exemple :

from Tkinter import *

f = Tk()
f.resizable(0,0)
f.title('Calculatrice')

textLabel = StringVar()
textLabel.set("0")

label = Label(f,textvariable=textLabel,font="Century 16 normal ",bg='black',fg='white',anchor="e")
label.pack(fill=X,ipady=5)

frame = Frame(f)
#1ere ligne
b = Button(frame,text="(",font="Century 12 normal ",width=3)
b.grid(row=0,column=0,padx=3,pady=3)
b = Button(frame,text="cos",font="Century 12 normal ",width=3)
b.grid(row=0,column=1,padx=3,pady=3)
b = Button(frame,text="sin",font="Century 12 normal ",width=3)
b.grid(row=0,column=2,padx=3,pady=3)
b = Button(frame,text="tan",font="Century 12 normal ",width=3)
b.grid(row=0,column=3,padx=3,pady=3)

#2eme ligne
b = Button(frame,text=")",font="Century 12 normal ",width=3)
b.grid(row=1,column=0,padx=3,pady=3)
b = Button(frame,text="7",font="Century 12 normal ",width=3)
b.grid(row=1,column=1,padx=3,pady=3)
b = Button(frame,text="8",font="Century 12 normal ",width=3)
b.grid(row=1,column=2,padx=3,pady=3)
b = Button(frame,text="9",font="Century 12 normal ",width=3)
b.grid(row=1,column=3,padx=3,pady=3)
b = Button(frame,text="+",font="Century 12 normal ",width=3)
b.grid(row=1,column=4,padx=3,pady=3)
b = Button(frame,text="eff",font="Century 12 normal ",width=3)
b.grid(row=1,column=5,padx=3,pady=3)

#3eme ligne
b = Button(frame,text="x²",font="Century 12 normal ",width=3)
b.grid(row=2,column=0,padx=3,pady=3)
b = Button(frame,text="4",font="Century 12 normal ",width=3)
b.grid(row=2,column=1,padx=3,pady=3)
b = Button(frame,text="5",font="Century 12 normal ",width=3)
b.grid(row=2,column=2,padx=3,pady=3)
b = Button(frame,text="6",font="Century 12 normal ",width=3)
b.grid(row=2,column=3,padx=3,pady=3)
b = Button(frame,text="-",font="Century 12 normal ",width=3)
b.grid(row=2,column=4,padx=3,pady=3)
b = Button(frame,text="ann",font="Century 12 normal ",width=3)
b.grid(row=2,column=5,padx=3,pady=3)

#4eme ligne
b = Button(frame,text="   _
V",font="Century 7 normal ",width=3)
b.grid(row=3,column=0,padx=3,pady=3,ipadx=4)
b = Button(frame,text="1",font="Century 12 normal ",width=3)
b.grid(row=3,column=1,padx=3,pady=3)
b = Button(frame,text="2",font="Century 12 normal ",width=3)
b.grid(row=3,column=2,padx=3,pady=3)
b = Button(frame,text="3",font="Century 12 normal ",width=3)
b.grid(row=3,column=3,padx=3,pady=3)
b = Button(frame,text="x",font="Century 12 normal ",width=3)
b.grid(row=3,column=4,padx=3,pady=3)
b = Button(frame,text="=",font="Century 12 normal ",width=3,height=3)
b.grid(row=3,column=5,rowspan=2,padx=3,pady=3,ipady=1)

#5eme ligne
b = Button(frame,text="^",font="Century 12 normal ",width=3)
b.grid(row=4,column=0,padx=3,pady=3)
b = Button(frame,text="0",font="Century 12 normal",width=8)
b.grid(row=4,column=1,columnspan=2,padx=3,pady=3)
b = Button(frame,text=".",font="Century 12 normal ",width=3)
b.grid(row=4,column=3,padx=3,pady=3)
b = Button(frame,text="/",font="Century 12 normal ",width=3)
b.grid(row=4,column=4,padx=3,pady=3)

frame.pack()
           
f.mainloop()

 
Il faut créer un widget Label que l'on va packer dans la fenêtre en utilisant l'option 'fill=X' qui aura pour action d'adapter la largeur du label à son conteneur ici la fenêtre mais ça aurait pu être une frame.
Ensuite on crée une frame dans laquelle on va utiliser la méthode de placement de widgets : grid. Celle-ci permet de placer les widgets en ligne et en colonne les uns par rapport aux autres comme une grille ou une matrice.Fort pratique dans la création d'une calculatrice.
Par contre pour s'assurer que toutes les touches est la même dimension il faudra que tous les boutons est une largeur commune en caractères (ici j'ai mis 3) , tout en sachant  que les textes sont centrés dans les boutons.
Pour étendre un bouton sur 2 colonnes (ex du zero),on rajoutera l'option 'columnspan' quand on le grid ce qui aura pour effet de le placer à cheval entre sa colonne et la suivante.Pour que ce soit harmonieux il faudra augmenter sa largeur(ici j'ai mis 8)
Pour étendre un bouton sur 2 lignes (ex du =),on rajoutera 'rowspan' ce qui aura pour effet de le placer à cheval entre sa ligne et la ligne du dessous.Là aussi il faudra jouer sur la hauteur pour que ce soit harmonieux(ici j'ai mis 3).
Avec tout ceci on peut jouer aussi sur les options 'padx','pady',ipadx','ipady' de grid. 'padx' et 'pady' sont en pixels et influent sur l'écart entre le bouton et ses voivins. 'ipadx' et 'ipady' (i pour internal) influent sur l'écart entre le texte et les bords du boutons ce qui a pour effet d'augmenter sa taille afin de l'ajuster.

Enfin qu'on on packera notre frame contenant nos boutons, tkinter va adapter la taille de la fenêtre à la frame, et le label créé plus haut s'adaptera à la nouvelle largeur de la fenêtre grâce à l'option fill=X.

C'est un peu technique ça demande un peu d'expérience, avoir fait un peu de pygame ça aide à comprendre la mécanique interne mais il y a quand même le site effbot.org avec la doc tkinter et quelques exemples qui peuvent éclairer.
pour grid :
http://effbot.org/tkinterbook/grid.htm
pour pack:
http://effbot.org/tkinterbook/pack.htm

En espérant avoir été assez clair, cordialement.Mints

Interface tkinter

1 réponse

Votre réponse

Discussions similaires