03 Animation

Einstieg in das Thema

Was braucht man an Vorwissen?

Du kennst jetzt die Struktur und weißt, dass man - ähnlich wie bei Processing - sich wiederholende Frames zeichnen kann.

Worum geht es?

Nun, obiges ruft förmlich nach Animationen. Wir schauen uns das an.

Was ist das Ziel?

Du weißt am Ende, wie man am einfachsten Animationen macht und kannst Zeit abfragen.

Erarbeitung

Theorie

Aufgaben

Basis ist der

Quelltext

Aufgabe 1

Wie kann man Geschwindigkeit verändern?

Aufgabe 2

Wie kann man den Abstand der Winkel verändern?

Aufgabe 3

Verbessert das den Effekt?

Nun verändern wir das Programm mit den Quadraten aus der vorherigen Lektion. Wir lassen die Quadrate zittern Ich unterstelle, dass dein Code beim zeichnen ähnlich aussah:

        surface.fill(BLACK)

        for j in range(0, 20):
            for i in range(0, 20):
            pygame.draw.rect(surface, GREEN, (i*30+20, j*30+20, 20, 20))

Vielleicht hast du die berechnung der x- und y-Werte vor dem Zeichnen gemacht. Das wäre sogar gut. Vor jedem Zeichnen berechnen wir eine Veränderung und addieren diese auf.

        distx = frame % 5
        disty = 0
        pygame.draw.rect(surface, GREEN, (i*30+20+distx, j*30+20+disty, 20, 20))

Aufgabe 4

Was passiert auf dem Bildschirm?

Aufgabe 5

Wie kann man sich das erklären?

Aufgabe 6

Was muss man ändern, damit dieser Effekt vertikal auftritt?

Aufgabe 7

Was passiert, wenn man frame % 10 schreibt?

Die folgenden Aufgaben zeigen schöne Effekte, du kannst sie ausprobieren, auch wenn du den Sinus noch nicht kennst. Vielleicht ist es in diesem Fall ja eine Motivation für Mathe.

Änderung nun die Berechnung. Der Sinus liefert fortlaufend Werte zwischen 1 und -1.

        distx = 5*math.sin(frame/10)
        disty = 5*math.sin(frame/10)

Aufgabe 8

Was passiert nun?

Aufgabe 9

Wie starkt ändern die Quadrate ihre Position in jede Richtung?

Aufgabe 10

Wie kann man die Bewegung schneller oder langsamer machen?

Das sieht noch alles viel zu geordnet aus.

        distx = 5*math.sin(frame/10+i)
        disty = 5*math.sin(frame/10+j)

Aufgabe 11

Wodurch entsteht dieser neue Effekt?

        distx = 5*math.sin(frame/10)
        disty = 5*math.cos(frame/10)

Aufgabe 12

Wie kannst die folgende Bewegung erklären?

Aufgabe 13

Addiere i und j (im zweiten Schritt auch i+j) auf die Argumente. Was hat sich geändert und warum war das so?

Zusammenfassung

Was muss man wissen / können?

Du hast nun gesehen, wie man leicht zeitabhängige Bewegungen realisieren kann. Neben dem einfachen Addieren von Variablen (kennst du schon von Processing) bieten sich auch Timestamps, Framenummern und Modulo-Operationen an.

Wie geht es weiter?

Das Ding heißt PyGame. Zeit für etwas mehr Game.