teach.rothe.io

Appearance

3 — Animation ​

Daumenkino ​

Animation ist eine weit verbreitete Technik, mit welcher durch das Erstellen und Anzeigen von Einzelbildern (engl. frames) für den Betrachter ein bewegtes Bild entsteht. Bei der Wiedergabe einer solchen Sequenz mit einer Geschwindigkeit mindestens 24 Bildern pro Sekunde entsteht beim Betrachter die Illusion einer flüssigen Bewegung.

Für animierte Videos (z.B Trickfilme) werden die einzelnen Bilder zuvor erstellt und anschliessend als Videodatei gespeichert. Bei interaktiven Animationen (z.B. Computerspiele) ist dies nicht möglich. Folglich bleibt eine Zeitspanne von maximal vier hundertstel Sekunden, um ein Einzelbild der Animation zu berechnen und zu zeichnen.

Illustration eines Daumenkinos [1]

Bildfrequenz ​

Die Bildfrequenz ist die Anzahl Einzelbilder, die pro Sekunde wiedergegeben werden. Sie wird in der Einheit fps (engl. frames per second) oder in Hz (Hertz) angegeben.

Das menschliche Gehirn ab einer Bildfrequenz von 14 bis 16 fps die Bilder als bewegte, aber nicht unbedingt ruckelfreie Szene wahr. Im 20. Jahrhundert galt eine Bildfrequenz von 24 Hz (Film) oder 25 Hz (Fernsehen) als Standard.

Bei modernen Standards wie HDTV gilt 60 Hz als Standard. Im Gaming-Bereich, wo hohe Bildfrequenzen wichtig sind, gibt es Bildschirme mit bis zu 144 Hz (QHD) oder 240 Hz (FHD).

Animation in Pygame Turbo ​

Beim Programmieren erstellen wir eine Animation ähnlich wie bei einem Daumenkino.

Wir zeichnen ein Bild, dann verschieben wir die Figuren ein wenig, dann zeichnen wir wieder ein Bild.

Für das Zeichnen des Bilds ist das Unterprogramm draw zuständig. Das Verschieben der Figuren nehmen wir im Unterprogramm update vor.

Grundstruktur ​

Ein Pygame Turbo-Programm mit Animation hat also folgende Grundstruktur:

python
import pgtrun

def draw():
    # Bild zeichnen

def update():
    # Figuren verschieben

pgtrun.go()

Objekt bewegen ​

Um ein Objekt zu bewegen, müssen wir im update-Unterprogramm jeweils seine neue Position berechnen. Dazu wird eine Variable, welche die Position des Objekts beinhaltet, auf einen neuen Wert gesetzt. Der neue Wert wird berechnet, indem zum aktuellen Wert die gewünschte Verschiebung addiert oder subtrahiert wird:

python
figur.x = figur.x + 1

Diese Anweisung muss nun in das Unterprogramm update gesetzt werden, da ja dort die neue Position der Objekte berechnet werden muss.

python
def update():
    figur.x = figur.x + 1

Das vollständige Programm sieht nun so aus:

python
# Hack: Fenster positionieren
import os

os.environ["SDL_VIDEO_WINDOW_POS"] = "100, 50"

import pgtrun


def draw():
    screen.fill(hintergrundfarbe)
    figur.draw()


def update():
    figur.x = figur.x + 1


WIDTH = 800
HEIGHT = 600
TITLE = "Mein tolles Game"
hintergrundfarbe = 11, 102, 35

figur = Actor("figur_01.png")

pgtrun.go()

✏️ Aufgabe 3.1 — Rennen

Ändern Sie Ihr Programm mit den vier Figuren folgendermassen:

  1. Die Figuren sollen alle am linken Rand stehen und vertikal gleichmässig verteilt sein.
  2. Die Figuren sollen sich alle mit einer unterschiedlichen Geschwindigkeit nach rechts bewegen.

→ Pygame Turbo: Animation

Lösung

  1. Quelle: Wikimedia Commons ↩︎