Discussion :

[Benjamy]

Bonjour tout le monde ! Je suis depuis quelques temps sur un projet qui nécessite d'utiliser tkinter. Étant plutôt nul en programmation, et particulièrement en ce qui concerne les interfaces graphiques, je suis venu vous demander, que dis-je, vous implorer de m'aider. Quelques explications s'imposent: je cherche pour l'instant à afficher une simple fenêtre avec sur la gauche un canvas et sur la droite un menu, qui n'est en fait qu'une frame. La création du canvas n'a posé aucun soucis. Celle de la frame, en revanche, me donne du fil à retordre. J'ai réussi à créer la dite frame mais je n'arrive pas à créer un widget correct contenu dans cette frame. Je 'explique: j'ai essayé de créer dans un premier temps une simple ligne de texte (Label) contenue dans la frame et positionnée tout en haut de celle-ci. Problème, lorsque j'effectue le code, le texte apparaît en plein milieu sur la gauche de la frame. Pour éclaircir la situation, j'ai changé le fond de la frame pour voir si elle apparaissait toujours à l'écran et surprise elle n'apparaissait pas. Mes questions sont donc les suivantes: Y a t-il un problème de propagation du label dans la frame qui fasse que celui-ci recouvre toute la frame? Comment régler ce problème?

Voici le code:Le code.py

Merci d'avance pour votre aide plus que précieuse! À plus!

[bistouille]

Salut,

Tu as besoin d'user d'un columnconfigure sur le parent de ta frame, et d'un sticky dans le grid de ta frame.

En gros (j'ai modifié la dimension)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
from tkinter import *
 
Fenetre = Tk()
Fenetre.title("Fenetre")
Fenetre.geometry('%dx%d+%d+%d' %(850,600,-10,0))
 
Fenetre.columnconfigure(1, weight=1)
Menu_droite = Frame(Fenetre, bg="darkblue", relief=GROOVE, width=350,height=600)
Menu_droite.grid(row = 0,column = 1, sticky=NSEW)
 
command = Label(Menu_droite, text = "Commandes")
command.grid(row = 0,column = 0)
 
zone_graphique = Canvas(Fenetre,bg='white',width=500,height=600)
zone_graphique.grid(row = 0, column = 0)
 
Fenetre.mainloop()

NSEW est une constante tkinter.

[Benjamy]

Merci infiniment pour ta réponse! J'ai juste une petite question: à quoi sert le columnconfigure et que représentent les deux paramètres qu'il contient? J'imagine que le weight correspond au nombre de colonne dans la fenêtre, mais je ne vois pas à quoi correspond le premier 1. J'ai déjà entendu parlé de sticky également avec les lettres, N, S, W, E qui permettent d'aligner les objets soit par le haut, le bas ou par rapport à la gauche ou la droite. Mais pourquoi faut-il mettre les quatre lettres dans ce cas précis?

[bistouille]

Les 4 lettres sont les points cardinaux, donc pour indiquer qu'on souhaite qu'il occupe tout l'espace (enfin en gros résumé), le columnconfigure, euh la doc l'expliquera mieux que moi, mais en très simple, c'est pour indiquer de donner plus de « poids » à la colonne 1, ce qui induit ce comportement.

Table 2. Column and row configuration options for the .grid() geometry manager
minsize The column or row's minimum size in pixels. If there is nothing in the given column or
row, it will not appear, even if you use this option.
pad A number of pixels that will be added to the given column or row, over and above the
largest cell in the column or row.
weight To make a column or row stretchable, use this option and supply a value that gives the
relative weight of this column or row when distributing the extra space. For example, if
a widget w contains a grid layout, these lines will distribute three-fourths of the extra
space to the first column and one-fourth to the second column:
w.columnconfigure(0, weight=3)
w.columnconfigure(1, weight=1)
If this option is not used, the column or row will not stretch.

[Benjamy]

Merci bien!

[Benjamy]

Je sais que je commence à devenir barbant, mais j'ai tenté de refaire le programme en plaçant cette fois-ci la frame non pas à droite comme précédemment mais en bas. J'ai voulu ensuite créer une autre frame de taille définie à l'intérieur de la première. Dans cette nouvelle frame j'ai ensuite voulu mettre deux boutons qui occupent tout l'espace selon les x mais sans modifier la taille de la frame, i.e. sans qu'elle s'adapte à la taille des deux boutons. Problème, elle s'adapte. Comment faire?

Voici le nouveau programme:Le code.py

[bistouille]

J'ai pas bien compris.

Je ne sais pas si tu veux que ton bouton occupe toute la largeur de la fenêtre ou être centré dans la fenêtre, pour le 1er cas ce n'est pas possible en spécifiant le width des boutons, car la largeur est exprimée en caractères.

Donc il faut jouer avec les column/rowconfigure, ce qui provoque parfois des maux de tête

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
from tkinter import *
 
Fenetre = Tk()
Fenetre.title("Fenetre")
Fenetre.geometry('%dx%d+%d+%d' %(800, 600,-10,0))
 
Fenetre.rowconfigure(1, weight=1)
 
zone_graphique = Canvas(Fenetre,bg='white',width=800, height=500)
zone_graphique.grid(row = 0, column = 0)
 
frameBas = Frame(Fenetre, bg="darkblue", relief=GROOVE, width=800,height=100)
frameBas.grid(row = 1,column = 0, sticky = NSEW)
 
frameBas.columnconfigure(0, weight=1)
frameBas.rowconfigure(0, weight=1)
 
frameBoutons = Frame(frameBas, bg="red2")
frameBoutons.grid(row = 0, column = 0, sticky = NSEW)
 
frameBoutons.columnconfigure(0, weight=1)
frameBoutons.rowconfigure(0, weight=1)
frameBoutons.rowconfigure(1, weight=1)
 
bouton1 = Button(frameBoutons,text="com1",bg="whitesmoke", padx=50, command=Fenetre.destroy)
bouton1.grid(row=0, column=0, sticky = NS) 
 
bouton2 = Button(frameBoutons,text="com2",bg="whitesmoke",command=Fenetre.destroy)
bouton2.grid(row=1, column=0, sticky = NSEW)
 
Fenetre.mainloop()

[Benjamy]

En fait ce que je veux faire c'est afficher deux boutons en haut à gauche de la frameBas. Je ne veux pas que les boutons soient petits mais qu'ils soient de taille raisonnable. C'est pour ça que j'ai intégré une autre frame (frameBouton) dans la frameBas. En dimensionnant la frame on devrait pouvoir élargir horizontalement les boutons pour qu'ils remplissent toutes la largeur de la frame et ainsi être de bonne taille. Je sais pas si je suis clair, ni même si ce que je propose est bon mais j'aimerai avoir votre avis.

[bistouille]

Désolé, mais non je comprends pas, si tu veux simplement élargir horizontalement la dimension de tes boutons, l'option padx de Button suffit, et pady pour le vertical.

[Benjamy]

Ok, merci pour ton aide en tous cas. Bonne fin de soirée!

[bistouille]

Sinon, fais un simple croquis pour montrer ce que tu veux obtenir, car comme ça, c'est pas facile à comprendre.

[Benjamy]

J'ai réussi à faire ce que je voulais mais avec un programme légèrement différent et pas du tout optimisé. D'ailleurs si on rajoute d'autre label, bouton ou instruction pour les colonnes et les lignes ça part vite dans tous les sens. Si tu as plus simple comme code pour faire la même chose n'hésite pas à me le dire .

Voilà le monstre:Le code - Barre en bas.py

[bistouille]

En effet, il est vivement déconseillé d'utiliser grid et pack, mieux vaut s'en tenir à un seul gestionnaire.

Maintenant pour ce que tu veux faire, ça va vite devenir compliqué lorsque tu vas avoir plusieurs niveaux d'imbrication de tes widgets, mais y'a toujours moyen de s'en sortir, pour peu qu'on se familiarise avec tkinter, et encore parfois on s'arrache les cheveux.

Là, avec cet exemple, c'est ce que tu veux obtenir, la différence est l'utilisation de grid_propagate pour conserver les dimensions du cadre blabla et que ça parte pas en cacahuète.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
import tkinter as tk
 
Fenetre = tk.Tk()
Fenetre.title("B")
 
Fenetre.geometry('%dx%d+%d+%d' %(800, 600, -10,0))
 
zone_graphique = tk.Canvas(Fenetre, bg='white', width=800, height=520)
zone_graphique.grid(row=0, column=0)
 
cadreBas = tk.Frame(Fenetre, bg="darkblue", relief=tk.GROOVE, width=800, height=80)
cadreBas.grid(row=1, column=0, sticky=tk.NSEW)
 
cadreBas.columnconfigure(0, weight=1)
cadreBas.columnconfigure(1, weight=1)
 
 
cadreBouton = tk.Frame(cadreBas, width=200, height=80, bg='lightGreen')
cadreBouton.grid(row=0, column=0, sticky=tk.NSEW)
 
cadreBouton.columnconfigure(0, weight=1)
cadreBouton.rowconfigure(0, weight=1)
cadreBouton.rowconfigure(1, weight=1)
 
bouton1 = tk.Button(cadreBouton, text='Boum', command=Fenetre.destroy)
bouton1.grid(row=0, column=0, sticky=tk.NSEW)
 
bouton2 = tk.Button(cadreBouton, text='Paf', command=Fenetre.destroy)
bouton2.grid(row=1, column=0, sticky=tk.NSEW)
 
cadreBlabla = tk.Frame(cadreBas, width=600, height=80, bg='lime')
cadreBlabla.grid(row=0, column=1, sticky=tk.NSEW)
cadreBlabla.grid_propagate(False)
 
labelTruc = tk.Label(cadreBlabla, text='Blabla', justify=tk.LEFT)
labelTruc.grid(row=0, column=0)
 
Fenetre.mainloop()

Mais, il y a d'autres pseudos solutions possibles, button ne peut être composé d'images et texte, par contre label oui, donc l'idée est d'utiliser les labels comme des boutons, en utilisant une image transparente pour avoir une dimension uniforme, et en utilisant des événements dessus avec les binds (clic, etc).

Il y a aussi l'idée d'utiliser un canvas, en plaçant tes boutons dedans avec create_window (jamais testé), à voir ce que ça donne.

[Benjamy]

Je te remercie pour ton aide