Python 3 - Lernen und professionell anwenden

477

16.4

Vorgehensweise bei der GUI-Entwicklung

16.4.1 Die Benutzungsoberfläche gestalten

Abbildung 16.8 zeigt das Aussehen der geplanten Benutzungsoberfläche. Den Widgets wur-

den Objektbezeichnungen in UML-Schreibweise nach dem Muster

objekt:Klasse zuge-

ordnet. Das UML-Objektdiagramm in Abbildung 16.9 veranschaulicht die Master-Slave-

Hierarchie der Widgets.

Abb. 16.8: Benutzungsoberfläche eines Vokabeltrainers

Abb. 16.9: UML-Objektdiagramm eines Fensters mit Label- und Button-Widgets

rfLabel:Label

okButton:Button

fenster:Tk

englischLabel:Label

titel:Label

entry:Entry

rahmen:Frame

gelerntLabel:Label

deutschLabel:Label

nochmalButton:Button

rfLabel:Label

okButton:Button

fenster:Tk

englischLabel:Label

titel:Label

entry:Entry

rahmen:Frame

gelerntLabel:Label

deutschLabel:Label

nochmalButton:Button

Kapitel 16

Layout

478

Tabelle 16.3 erläutert die wichtigsten Objekte ein wenig.

In der ersten Phase der Programmierung schreiben wir nur die Anweisungen auf, die zur

Definition der Oberfläche notwendig sind. Für die Kommandos der Buttons sind nur Dum-

mies angegeben, also Funktionen, die nichts bewirken. Wir übernehmen die obige Defini-

tion der Klasse

Karteikasten.

Skript:

Widget Erläuterung

englischLabel:Label

Dieses Label enthält das aktuelle englische Wort, das soeben

aus dem »Karteikasten« gezogen worden ist. Hier ändert

sich dynamisch der Text.

rahmen:Frame

Ein Frame-Widget, das einen Rahmen darstellt. Innerhalb

des Frames befinden sich andere Widgets.

entry:Entry

Ein Entry-Widget. Das ist ein einzeiliges Eingabefeld, in das

in diesem Fall eine deutsche Übersetzung der darüber ange-

zeigten englischen Vokabel eingetragen werden soll.

okButton:Button

Wird die Schaltfläche angeklickt, prüft das Programm, ob die

im Entry-Widget eingetragene Übersetzung stimmt.

gelerntLabel:Label

Ein dynamisches Label-Widget, das die Anzahl der bisher

gelernten Vokabeln anzeigt.

rfLabel:Label

Dieses Label gibt eine Rückmeldung, ob die zuletzt eingege-

bene Vokabel richtig war.

nochmalButton:Button

Klickt man auf diesen Knopf, so startet das Programm

erneut.

Tabelle 16.3: Erklärung einiger Widgets des Beispiels

# vokabeltrainer.pyw

from tkinter import *

class Karteikasten(object):

...

class Vokabeltrainer:

def __init__(self, datei):

# neuen Karteikasten anlegen und erste Karte ziehen

self.gelernt = 0

se l f .da t ei = d a tei

self.k = Karteikasten(datei) #1

self.aktVokabel = self.k.getNeueVokabel()

479

16.4

Vorgehensweise bei der GUI-Entwicklung

# Widgets instanziieren

self.fenster = Tk()

self.vokabel = StringVar() #2

self.vokabel.set(self.aktVokabel[0])

self.titel = Label(master=self.fenster,

text='Vokabeltrainer',

font=('Comic Sans MS',14),fg='blue')

self.rahmen = Frame(master=self.fenster,

relief=RIDGE,bd=2)

self.englischLabel = Label(master=self.rahmen,

textvariable=self.vokabel, #3

font=('Arial',14))

self.deutschLabel = Label(master=self.rahmen,

t e xt= ' D eut s ch:' )

self.entry = Entry(master=self.rahmen, width=15)

self.okButton = Button(master=self.rahmen,text='ok',

command=self.ok) #4

self.gelerntLabel = Label(master=self.fenster,

width=10, bg='yellow',

text=str(self.gelernt)+' gelernt')

self.rfLabel = Label(master=self.fenster, width=20)

self.nochmalButton = Button(master=self.fenster,

tex t = 'no c h ei n mal ' ,

command=self.nochmal) #5

self.layout()

self.fenster.mainloop()

def layout(self):

self.titel.pack()

self.englischLabel.pack()

self.deutschLabel.pack(side=LEFT)

self.entry.pack(side=LEFT, padx=10, pady=10)

self.okButton.pack(side=RIGHT, padx=10, pady=10)

self.rahmen.pack()

self.gelerntLabel.pack(side=LEFT, padx=10, pady=10)

self.rfLabel.pack(side=LEFT)

self.nochmalButton.pack(side=RIGHT,

p adx = 10, p a dy= 1 0 )

# Dummies

def nochmal(self):

pa s s