11. GUI II - Canvas und Medien
Geplanter Inhalt
Abschnitt betitelt „Geplanter Inhalt“- Das
<canvas>-Element: Koordinatensystem, Formen, Farben, Text. - Einfache Animation: Zeichnen im Takt (
requestAnimationFrame), Bewegung über Objektzustand. - Objekte zeichnen sich selbst: eine
draw()-Methode pro Klasse. Hier trifft OOP auf Grafik. - Medien einbinden: Bilder und Audio aus JavaScript steuern.
- “Unterschiedliche Medien” (Lehrplan): dieselbe Logik für Maus und Touch; responsive Rücksichten.
Lernziele
Abschnitt betitelt „Lernziele“- Mit Canvas Formen zeichnen und einfache Animationen erstellen.
- Bewegliche Objekte als Klassen mit Zustand und
draw()-Methode modellieren. - Auf Maus-/Touch-Eingaben im Canvas reagieren.
Passende Übungen
Abschnitt betitelt „Passende Übungen“- Aufgabe 20 - Canvas-Aquarium