Impressum
< Index

Tic-Tac-Toe Stufe 2 - Interaktion

Wir erweitern unsere Klasse um ein privates Attribut player. In diesem Attribute speicher wir, welcher Spieler (1 oder -1) gerade dran ist.
Wir machen dieses Attribut private und initialisieren es im Konstruktor mit 1.
Zusätzlich erstellen wir eine Methode klick(), welche aufgerufen werden soll, wenn auf den Canvas mit der Maus geklickt wurde.
TTT
-feld:int[][]
-player:int
+TTT()
+paint()
+klick(e:Event)
Damit die Spieler mit der Maus Kreise und Kreuze setzen können, müssen wir dem Canvas mitteilen, dass er auf Maus-Clicks reagieren soll:
self.__canvas.bind( "<Button-1>", self.klick )
Die Methode bind() des Canvases, bindet ein Ereignis an eine Methode. Das Ereignis "<Button-1>" ist ein Klick mit der linken Maustaste.
Die Methode wird als zweiter Parameter angegeben. Wichtig ist, dass hier keine Klammern nach dem Methodenname stehen dürfen.

Die Methode klick()

Die Methode klick() kann entsprechend des Struktogramms umgesetzt werden. Sie bekommt bei jedem Mausklick ein Klick-Event übergeben, welches der Parameter e ist.
Dieses Event enthält u.a. die Koordinaten des Klicks.
Erklärungen
  • Die Koordinaten sind in Pixel, d.h. e.x liegt zwischen 0 und 300, wenn man in das Spielfeld geklickt hat
  • Um die Pixelkoordinaten in Feldpositionen umzusetzen teilen wir e.x durch 100, da jedes Feld 100x100 Pixel groß ist.
  • Ganzzahliges Teilen realisiert man in Python mit //
  • Danach prüfen wir, ob ins Spielfeld geklickt wurde. D.h. die Feldposition muss zwischen 0 und 2 liegen (für Zeile und Spalte)
  • Es muss noch überprüft werden, ob das angeklickte Feld leer ist (eine 0 enthält)
  • Wenn alles überprüft wurde setzen wir die Feldposition auf den Wert des Spielers. Dieser ist ja 1 oder -1.
  • Jetzt ist der nächste Spieler dran. Wenn der Spieler 1 war wird er zu -1 und anders herum.
    Am einfachsten ist dies mit self.__player = -self.__player zu realisieren, denn es muss ja nur das Vorzeichen geändert werden.
  • Zum Schluss zeichnen wir das Feld mit einem Aufruf von paint, damit die Änderungen am feld-Attribute auch angezeigt werden.
Struktogramm der Methode klick()
Struktogramm