 |
|||
| HSG |
|
Motivation
Die Widgets in der gezeigten Benutzeroberfläche wurden mit place platziert. Wie aufwendig ist das? Was passiert, wenn man das Fenster in seiner Größe ändert? Was hätte man denn gerne?
Pack 0
Der Packer arbeitet so, dass für ein Widget ein unsichtbares Rechteck, das das Widget enthält, an eine bestehende Grenze gerückt wird. Dabei hat das Rechteck in der 'Andockrichtung' minimale und quer dazu maximale Ausmaße. Die Default-Andockrichtung ist oben ('top'), die Default-Ausrichtung im Rechteck ist zentriert ('center').
import tkinter as tk
fenster = tk.Tk()
fenster.title('pack 0')
fenster.geometry('200x100+300+100')
l1 = tk.Label(fenster,text='Label 1',background='#ff0000')
l1.pack()
l2 = tk.Label(fenster,text='Label 2',background='#ffff00')
l2.pack()
l3 = tk.Label(fenster,text='Label 3',background='#00ff00')
l3.pack()
b1 = tk.Button(fenster,text='Button1')
b1.pack()
fenster.mainloop()
Pack 1
Die Ausrichtung im Rechteck lässt sich mit dem Attribut anchor beeinflussen. Die Buchstaben n,w,s,e geben dabei die Himmelsrichtungen an. Die rechte untere Ecke kann man z.B. mit 'se' erreichen. anchor='center' beschreibt die Mitte.
import tkinter as tk
fenster = tk.Tk()
fenster.title('pack 1')
fenster.geometry('200x100+300+100')
l1 = tk.Label(fenster,text='Label 1',background='#ff0000')
l1.pack(anchor='n')
l2 = tk.Label(fenster,text='Label 2',background='#ffff00')
l2.pack(anchor='e')
l3 = tk.Label(fenster,text='Label 3',background='#00ff00')
l3.pack(anchor='w')
b1 = tk.Button(fenster,text='Button1')
b1.pack(anchor='s')
fenster.mainloop()
Pack 2
import tkinter as tk
fenster = tk.Tk()
fenster.title('pack 2')
fenster.geometry('200x100+300+100')
l1 = tk.Label(fenster,text='Label 1',background='#ff0000')
l1.pack(side='left')
l2 = tk.Label(fenster,text='Label 2',background='#ffff00')
l2.pack(side='right')
l3 = tk.Label(fenster,text='Label 3',background='#00ff00')
l3.pack(side='bottom')
b1 = tk.Button(fenster,text='Button1')
b1.pack(side='right')
fenster.mainloop()
Pack 3
import tkinter as tk
fenster = tk.Tk()
fenster.title('pack 3')
fenster.geometry('200x100+300+100')
l1 = tk.Label(fenster,text='Label 1',background='#ff0000')
l1.pack(side='left', anchor='s')
l2 = tk.Label(fenster,text='Label 2',background='#ffff00')
l2.pack(side='right', anchor='n')
l3 = tk.Label(fenster,text='Label 3',background='#00ff00')
l3.pack(side='bottom', anchor='w')
b1 = tk.Button(fenster,text='Button1')
b1.pack(side='right', anchor='n')
fenster.mainloop()
Pack 4
Viele Layoutideen lassen sich durch die Verwendung von Frames erreichen. Diese Frames können Container für Widgets oder auch weitere Frames bilden. Warum ist der Button im Beispiel so 'verkümmert'? Es ist interessant zu sehen, wie sich das Layout verändert, wenn man die Fenstergröße ändert.
import tkinter as tk
fenster = tk.Tk()
fenster.title('pack 4')
fenster.geometry('200x100+300+100')
f1 = tk.Frame(fenster,background='#ff99ff')
f1.pack(ipadx=20,ipady=10)
l1 = tk.Label(f1,text='Label 1',background='#ff0000')
l1.pack(side='left')
l2 = tk.Label(f1,text='Label 2',background='#ffff00')
l2.pack(side='right')
l3 = tk.Label(fenster,text='Label 3',background='#00ff00')
l3.pack(pady=5)
b1 = tk.Button(fenster,text='Button1')
b1.pack(pady=10)
fenster.mainloop()
Pack 5
Manchmal möchte man, dass ein Widget das übergeordnete Master-Widget in einer Richtung ganz ausfüllt. Das lässt sich mit dem Attribut fill erreichen. Auch kann es wichtig sein, die Reihenfolge der pack-Anweisungen geschickt zu wählen. Im Beispiel bleibt so der Button immer unten links.
import tkinter as tk
fenster = tk.Tk()
fenster.title('pack 5')
fenster.geometry('200x100+300+100')
f1 = tk.Frame(fenster,background='#ff99ff')
f1.pack(fill='x',ipady=10)
l1 = tk.Label(f1,text='Label 1',background='#ff0000')
l1.pack(side='left')
l2 = tk.Label(f1,text='Label 2',background='#ffff00')
l2.pack(side='right',padx=5)
l3 = tk.Label(f1,text='L3',background='#00ff00')
l3.pack(side='right')
b1 = tk.Button(fenster,text='Button1')
b1.pack(side='bottom',anchor='w',padx=5,pady=5)
t1 = tk.Text(fenster)
t1.insert('end','Hallo Welt!')
t1.pack(padx=5)
fenster.mainloop()
Pack 6
import tkinter as tk
fenster = tk.Tk()
fenster.title('pack 6')
fenster.geometry('200x100+300+100')
f1 = tk.Frame(fenster,background='#ff99ff')
f1.pack(fill='x',padx=5,ipady=10)
l1 = tk.Label(f1,text='Label 1',background='#ff0000')
l1.pack(side='left')
l2 = tk.Label(f1,text='Label 2',background='#ffff00')
l2.pack(side='right')
e1 = tk.Entry(f1,width=5)
e1.insert('end','0.01')
e1.pack(side='right')
l3 = tk.Label(f1,text='L3',background='#00ff00')
l3.pack(side='right')
b1 = tk.Button(fenster,text='Button1')
b1.pack(side='bottom',anchor='w',padx=5,pady=5)
t1 = tk.Text(fenster)
t1.insert('end','Hallo Welt!')
t1.pack(padx=5)
fenster.mainloop()
Pack 7
Das Ausgangsproblem wurde jetzt mit Hilfe von pack weitgehend gelöst. Verhält sich alles so, wie gewünscht?
import tkinter as tk
fenster = tk.Tk()
fenster.title('pack 7')
fenster.geometry('330x200+300+100')
f1 = tk.Frame(fenster)
f1.pack(fill='x',padx=10,ipady=10)
l1 = tk.Label(f1,text='Port:')
l1.pack(side='left')
L = ['/dev/ttyS0','/dev/ttyS1','/dev/ttyUSB0']
vS = tk.StringVar(fenster)
vS.set(L[2])
o1 = tk.OptionMenu(f1,vS,*L,command=None)
o1.pack(side='left')
l2 = tk.Label(f1,text='s')
l2.pack(side='right')
e1 = tk.Entry(f1,width=5)
e1.insert('end','0.01')
e1.pack(side='right')
l3 = tk.Label(f1,text='Bitzeit:')
l3.pack(side='right')
b1 = tk.Button(fenster,text='clear')
b1.pack(side='bottom',anchor='w',padx=10,pady=5)
t1 = tk.Text(fenster)
t1.insert('end',"Wie geht's denn so?")
t1.pack(padx=10)
fenster.mainloop()
Aufgabe
Folgende Benutzeroberfläche stammt aus dem Kapitel zur Entwicklung grafischer Oberflächen aus dem 'elektronischen Lehrbuch' www.inf-schule.de. Baue die Oberfläche mit Hilfe von pack nach.
Tipp zur Farbwahl: Benutze Gimp/Ändern der Farbe
Links
- The Packer - docs.python.org