Informatik W24d

Pygame Zero ist ein Python-Modul womit man relativ einfach grafische Programme schreiben kann. Pygame Zero hilft beim Erstellen eines Fensters und bietet mehrere Möglichkeiten um Bilder und Grafiken darzustellen, zu animieren und auch zu steuern.

Achtung

Pygame Zero-Programme verwenden neben dem Python-Skript Medien-Dateien wie Bilder und Sounds. Diese müssen von Pygame Zero gefunden werden können. Dies wird durch eine vorgegebene Ordnerstruktur erreicht:

pygame-zero/
    ├── sounds/
    │   └── click.mp3        
    ├── images/
    │   ├── alien.png
    │   └── alien_hurt.png
    └── game.py

Aufgabe «Ordner-Struktur erstellen»

  • gehe in deinen Informatik-Ordner
  • erstelle dort einen Unterordner pygame-zero für alle Pygame Zero-Skripte
  • öffne den neu-erstellten Ordner
  • erstelle darin die Unterordner images und sounds für verwendete Medien-Dateien

Speichere in Zukunft alle Pygame-Zero-Skripte und die verwendeten Medien-Dateien in den oben erstellten Ordnern!

# Vorbereitung

Damit man Pygame Zero verwenden kann, muss man zuerst das Package pgzero installieren, dann kann man im Skript das Modul verwenden (import pgzrun) und ganz am Schluss dann mit pgzrun.go() alles starten:

import pgzrun

pgzrun.go()
1
2
3

Alles andere kommt also zwischen die beiden oben stehenden Zeilen.

Aufgabe «Package installieren»

  • öffne Thonny und installiere das Package pgzero
  • teste ob es funktioniert, indem du das obenstehende Zwei-Zeilen-Programm ausführst

# Fenstereinstellungen

Nun können wir sehr einfach ein Fenster erstellen: Dazu definieren wir zwei Ganze Zahlen als Konstanten mit den Namen WIDTH und HEIGHT.

WIDTH = 200
HEIGHT = 200
1
2

Diese werden beim Start von Pygame Zero gelesen und für die Dimensionen des Fensters verwendet. Wenn wir das Programm starten, sehen wir ein kleines schwarzes quadratisches Fenster.

Optional können wir einen dritten Wert TITLE definieren. Hier müssen wir Text eingeben, gekennzeichnet durch Anführungszeichen. Pygame Zero verwendet diesen Wert um das Fenster zu beschriften:

TITLE = "Erstes Programm"
1

Aufgabe «Fenstereinstellungen»

Baue Fenstergrösse und Fenstertitel in dein Programm ein.

# Actor hinzufügen

Nun wollen wir etwas darin anzeigen. Wir wollen einen sogenannten Actor einbauen. Wie der Name es sagt – ein Schauspieler. Beim Actor handelt es isch sozusagen um eine Spielfigur, die wir dann verschieben und verwenden können. Der Actor wird mit Hilfe einer Bilddatei dargestellt.

Aufgabe «Bilder»

Zuerst müssen wir aber die beiden Bilder an der richtigen Stelle abspeichern:

  • gehe in den Ordner wo dein Python-Skript liegt
  • erstelle einen Unterordner images
  • speichere die beiden pinken Alien-Bilder dort drin ab

Wir hängen unterhalb den folgenden Code an:

zorg = Actor('alien')
zorg.x = 100
zorg.y = 100
1
2
3

Damit haben wir einen sogenannten Actor definiert:

Zeile 1
Erstellt einen Actor aus dem Bild alien.png (muss im Unterordner images liegen) und weist dem neuen Actor den Namen zorg zu, damit wir ihn später wieder ansprechen können.
Zeile 2 und 3
Da zorg ein Actor ist, hat er auch eine Position. Wir setzen seine Koordinaten auf die Mitte des Fensters.

# Spiel zeichnen

Wenn wir das Programm starten, ändert sich aber nichts – das Fenster bleibt immer noch schwarz. Dies ist deshalb so, weil Pygame Zero zum Zeichnen des Fensterinhaltes ein spezielles Unterprogramm aufruft, nämlich draw(). Dieses Unterprogramm muss sämtlichen Fensterinhalt zeichnen und von uns definiert werden. Wir fügen das folgende Unterprogramm unten an unseren Code an:

def draw():
    screen.clear()
    zorg.draw()
1
2
3
Zeile 1
Mit def geben wir an, dass wir ein Unterprogramm definieren wollen.
draw soll der Name des Unterprogrammes sein. Sonst kann Pygame Zero das Unterprogramm gar nicht aufrufen
mit der Klammer () wird gesagt dass der Name draw für ein Unterprogramm steht und mit dem Doppelpunkt : wird der Inhalt des Unterprogrammes eingeleitet
Zeile 2
löscht den Fensterinhalt komplett
(ist eingerückt und gehört deshalb zum Inhalt des Unterprogrammes)
Zeile 3
zeichnet unseren Actor
(ist eingerückt und gehört deshalb zum Inhalt des Unterprogrammes)

Aufgabe «Actor»

Baue den Actor in dein Programm ein und teste das Programm. Das Programm sollte wie folgt aussehen:

Screenshot
Lösung «Actor» 
import pgzrun

WIDTH = 200
HEIGHT = 200

TITLE = "Erstes Programm"

zorg = Actor("alien")
zorg.x = 100
zorg.y = 100

def draw():
    screen.clear()
    zorg.draw()

pgzrun.go()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

Aufgabe «Änderungen»

Versuche die folgenden Änderungen am Programm vorzunehmen:

  • Vergrössere das Pygame Zero-Fenster, so dass es einigermassen den Bildschirm füllt.
  • Füge ein weiteres «Alien» hinzu. Gib ihm aber einen anderen Namen und natürlich andere Koordinaten!

Hier findest du weitere Aliens in verschiedenen Farben und etwas kleinerem Format:

Lösung «Änderungen» 
import pgzrun

WIDTH = 800
HEIGHT = 480

TITLE = "Zweites Programm"

zorg = Actor("alien")
zorg.x = 100
zorg.y = 100

gelber_feind = Actor("alien_yellow")
gelber_feind.x = 300
gelber_feind.y = 200

def draw():
    screen.clear()
    gelber_feind.draw()
    zorg.draw()

pgzrun.go()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

# Game-Loop

In einem sogenannten Game-Loop wird in Pygame-Zero automatisch das Spiel neu berechnet. Dabei wird immer wieder das Folgende erledigt:

  1. Checke Auftreten von Ereignissen – Z.B. Tastendruck oder Mausklick zur Steuerung der Spielfigur.
  2. Berechne den neuen Spielstand – Hat sich der Spieler seit dem letzten Aufruf bewegt? Haben sich andere Figuren bewegt? Dann müssen neue Positionen berechnet werden. Oder hat es eine Kollision gegeben? Dann verliert der Spieler ein Leben.
  3. Stelle den neuen Spielstand dar – Wenn sich etwas verändert hat, so muss das Spiel neu gezeichnet werden.
Der Game-Loop mit den Aufrufen der Unterprogramme

# Animation

Der Game-Loop ruft das Unterprogramm update immer wieder auf. Wir können dort also die neue Position unserer Elemente berechnen:

def update():
    zorg.x = zorg.x + 1
1
2

Aufgabe «Animation»

Versuche die oben beschriebene Animation einzubauen. Der Alien sollte sich langsam nach rechts bewegen.

Lösung «Animation» 
import pgzrun

WIDTH = 800
HEIGHT = 400

TITLE = "Erste Animation"

zorg = Actor("alien")
zorg.x = 100
zorg.y = 100

gelber_feind = Actor("alien_yellow")
gelber_feind.x = 300
gelber_feind.y = 200

def draw():
    screen.clear()
    gelber_feind.draw()
    zorg.draw()
    
def update():
    zorg.x = zorg.x + 1
    
pgzrun.go()
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

# Steuerung

Im Unterprogramm update() können wir auch die Tastatur abfragen. So kann eine Steuerung gebaut werden: Wir verschieben den Actor nur, wenn die entsprechende Taste gedrückt ist.


 


def update(dt):
    if keyboard[keys.RIGHT]:
        zorg.x = zorg.x + 1
1
2
3
Zeile 2
keyboard ist ein Verzeichnis von Wahrheitswerten. Wir können jede Taste abfragen (z.B. keys.RIGHT) und erhalten True, sollte sie gedrückt sein.
Die Tasten sind in keys definiert: z.B. keys.LEFT, keys.A oder keys.RETURN. (Vollständige Liste unter https://pygame-zero.readthedocs.io/en/stable/hooks.html#keys (opens new window))

Aufgabe «Steuerung»

Baue eine Steuerung ein, so dass du den Actor mit den Pfeiltasten in alle 4 Richtungen bewegen kannst

Lösung «Steuerung» 
import pgzrun

WIDTH = 800
HEIGHT = 400

TITLE = "Erste Steuerung"

zorg = Actor("alien")
zorg.x = 100
zorg.y = 100

gelber_feind = Actor("alien_yellow")
gelber_feind.x = 300
gelber_feind.y = 200

def draw():
    screen.clear()
    gelber_feind.draw()
    zorg.draw()
    
def update():
    if keyboard[keys.RIGHT]:
        zorg.x = zorg.x + 1
    if keyboard[keys.LEFT]:
        zorg.x = zorg.x - 1
    if keyboard[keys.UP]:
        zorg.y = zorg.y - 1
    if keyboard[keys.DOWN]:
        zorg.y = zorg.y + 1
        
pgzrun.go()
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

# Kollisionen erkennen

Bei vielen Spielen interagieren die Spielfiguren miteinander. Dazu muss man Kollisionen zwischen ihnen erkennen können. Pygame Zero bietet für den Actor das Unterprogramm colliderect() an, um zu Überprüfen, ob der Actor einen anderen Actor berührt.

def update():
    if zorg.colliderect(gelber_feind):
        zorg.image = "alien_hurt"
1
2
3

Aufgabe «Spiel»

Versuche das Beispiel fertigzustellen, so das daraus ein erstes kleines Spiel wird.
Folgende Elemente könntest du noch einbauen:

  • Der Gegner soll sich ständig bewegen, z.B. diagonal.
  • Der Gegner sollte nicht verschwinden. Er könnte z.B. an den Rändern des Fensters abprallen.
  • Wenn der Spieler den Gegner berührt, dann ist «Game Over».
Lösung «Spiel» 
import pgzrun

WIDTH = 800
HEIGHT = 400

TITLE = "Erste Game"

zorg = Actor("alien")
zorg.x = 100
zorg.y = 100

gelber_feind = Actor("alien_yellow")
gelber_feind.x = 300
gelber_feind.y = 200
## horizontale und vertikale geschwindigkeit festlegen
gelber_feind.dx = 2
gelber_feind.dy = 1

def draw():
    screen.clear()
    gelber_feind.draw()
    zorg.draw()
    
def update():
    # feind bewegen
    gelber_feind.x = gelber_feind.x + gelber_feind.dx
    gelber_feind.y = gelber_feind.y + gelber_feind.dy
    # feind prallt links und rechts ab
    if gelber_feind.x > WIDTH or gelber_feind.x < 0:
        gelber_feind.dx = -gelber_feind.dx
    ## feind prallt unten und oben ab
    if gelber_feind.y > HEIGHT or gelber_feind.y < 0:
        gelber_feind.dy = -gelber_feind.dy
    ## spieler steuern
    if keyboard[keys.RIGHT]:
        zorg.x = zorg.x + 1
    if keyboard[keys.LEFT]:
        zorg.x = zorg.x - 1
    if keyboard[keys.UP]:
        zorg.y = zorg.y - 1
    if keyboard[keys.DOWN]:
        zorg.y = zorg.y + 1
    ## kollision zwischen spieler und feind erkennen
    if zorg.colliderect(gelber_feind):
        zorg.image = "alien_hurt"
        
pgzrun.go()
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
39
40
41
42
43
44
45
46
47

# weitere Informationen

Weitere Möglichkeiten findet man in der offiziellen Dokumentation:
https://pygame-zero.readthedocs.io/en/stable/ (opens new window)

Letzte Änderung: 8. November 2021 12:05

←