Tkinter Grid-Methode

Question

Ich benutze Tkinter, um eine GUI für meine Informatik-Kursarbeit basierend auf Steganographie zu erstellen. Ich verwende die .grid() Funktion auf den Widgets in meinem Fenster, um sie auszulegen, aber ich kann nicht diesen bestimmten Teil bekommen, um zu schauen, wie ich es will.

So sieht meine GUI momentan aus: http://imgur.com/LNEZtEL (oder nur der Teil mit dem Fehler).

Ich möchte die restlichen Zeichen Label direkt unter dem Texteingabefeld sitzen, aber aus irgendeinem Grund beginnt Zeile 4 einen großen Weg nach unten unterhalb der Box. Wenn ich die GUI mit in Nordwesten verankerten Spalten und Zeilen beschrifte, sieht das so aus: http://imgur.com/a/V7dTW.

Wenn ich die Bildbox auf der linken Seite verkleinere, sieht es aus wie ich will, aber ich möchte nicht das Bild so klein: http://imgur.com/a/0Dudu.

Die Bildbox hat eine Zeilenlänge von 2, was also bewirkt, dass die 4. Zeile so tief unten im Texteingabefeld beginnt? Hier ist ungefähr, wie ich die GUI aussehen möchte: http://imgur.com/a/ck04A.

Voll Code:

imageButton = Button(root, text="Add Image", command = add_image) 
imageButton.grid(row = 2, columnspan = 2, sticky = W, padx = 30, pady = 20) 
steg_widgets.append(imageButton) 

image = Image.open("square.jpg") 
image = image.resize((250,250)) 
photo = ImageTk.PhotoImage(image) 
pictureLabel = Label(root, image = photo) 
pictureLabel.image = photo 
pictureLabel.grid(column = 0, row = 3, columnspan = 2, rowspan = 2, padx = 20, pady = (0, 20), sticky = NW) 
steg_widgets.append(pictureLabel) 

nameLabel = Label(root, text = "Brandon Edwards - OCR Computer Science Coursework 2016/2017") 
nameLabel.grid(row = 0, column = 2, columnspan = 2, padx = (0, 20), pady = 10) 
steg_widgets.append(nameLabel) 

inputTextLabel = Label(root, text = "Enter text:") 
inputTextLabel.grid(row = 2, column = 2, sticky = W) 
steg_widgets.append(inputTextLabel) 

startButton = Button(root, text="Go!", command = start_stega) 
startButton.grid(row = 2, column = 2, sticky = E) 
steg_widgets.append(startButton) 

inputTextBox = Text(root, height = 10, width = 30) 
inputTextBox.grid(row = 3, column = 2, sticky = NW) 
steg_widgets.append(inputTextBox) 

maxCharLabel = Label(root, text = "Remaining characters:") 
maxCharLabel.grid(row = 4, column = 2, sticky = NW) 
steg_widgets.append(maxCharLabel) 

saveButton = Button(root, text="Save Image", command = save_image) 
saveButton.grid(row = 2, column = 3, sticky = W) 
steg_widgets.append(saveButton) 

Answer 1

empfehle ich die Benutzeroberfläche in logische Abschnitte zu brechen, und separat jeden Abschnitt Auslegen.

Zum Beispiel haben Sie eindeutig zwei verschiedene Abschnitte: das Bild und die Schaltfläche auf der linken Seite und die anderen Widgets auf der rechten Seite. Beginnen Sie mit Containern für diese beiden Gruppen zu erstellen:

import Tkinter as tk 
... 
left_side = tk.Frame(root) 
right_side = tk.Frame(root) 

Da sie Seite an Seite sind, pack ist der einfachste Weg, um sie zu legen:

left_side.pack(side="left", fill="y", expand=False) 
right_side.pack(side="right", fill="both", expand=True) 

Als Nächstes können Sie konzentrieren sich auf nur eine Seite. Sie können pack oder grid verwenden. Dies verwendet grid zu illustrativen Zwecken:

image = tk.Canvas(left_side, ...) 
button = tk.Button(left_side, ...) 

left_side.grid_rowconfigure(0, weight=1) 
left_side.grid_columnconfigure(0, weight=1) 
image.grid(row=0, column=0, sticky="nw") 
button.grid(row=1, column=0, sticky="n") 

Schließlich Arbeit auf der rechten Seite. Da Widgets von oben nach unten gestapelt sind, ist pack die natürliche Wahl:

l1 = tk.Label(right_side, text="Enter text:") 
l2 = tk.Label(right_side, text="Remaining characters") 
text = tk.Text(right_side) 
l1.pack(side="top", fill="x") 
text.pack(side="top", fill="both", expand=True) 
l2.pack(side="top", fill="x")