Action unknown: copypageplugin__copy

Micro:bit 2022

Der BBC micro:bit ist eine Art ‘Mini-Computer’, der mit Python (und anderen Sprachen) programmiert werden kann. Er kann mittels Knöpfe gesteuert werden, verfügt über eine 5×5-LED-Matrix und ist mit einigen Sensoren (z.B. Beschleunigungsmesser) ausgestaltet:

Editoren

Verwende einen der beiden Editoren:

Vor- und Nachteile der beiden sind:

  • + Online: Online lädt Code viel schneller auf micro:bit
  • + Mu: Mu hat (gutes) Autocomplete
  • + Mu: Kann nicht wirklich speichern online, nur File herunterladen

Tipp für Workflow

Arbeite mit beiden parallel: Online-Editor zum eigentlichen Coden und auf micro:bit laden, Mu-Editor zum ausprobieren. Kopiere Code regelmässig in .py-File auf Computer, damit nicht verloren geht, wenn man z.B. aus Versehen den Browser schliesst. Möchtest du Code, der keine spezifischen micro:bit-Funktionen beinhaltet, ausprobieren oder testen, so kannst du dies auch in TigerJython, VSCode oder einer anderen Python-IDE tun.

Getting started mit Online-Editor

  1. Verbinde micro:bit per USB-C mit Laptop (ev. Benötigst du Adapter)
  2. Öffne Online-Editor in Chrome.
  3. Klicke auf ‘Connect’ / Wähle micro:bit aus / ‘Verbinden’.
  4. Verbindung Testen: Klicke auf ‘Flash’ → Default-Programm «Hello World!» wird auf micro:bit geladen und ausgeführt
  • micro:bit kennenlernen
  • Verwendung von LED-Matrix und Tasten

Speichere in einer Liste einige Symbole. Mit der linken und rechten Taste kannst du durch die Liste durchgehen und das jeweilige Symbol mit der LED-Matrix anzeigen.

from microbit import * # importiere alle Funktionalitäten für micro:bit
 
display.show(Image.HEART) # zeige Herz-Symbol an
# weitere Symbole: HAPPY, DIAMOND, SWORD, RABBIT, PACMAN, SKULL, …
# Alle Symbolen: https://microbit-micropython.readthedocs.io/en/v2-docs/tutorials/images.html 
 
# eigenes Symbol (hier Buchstabe A) erzeugen:
letter_A_img = Image(
        "99999:"
        "90009:"
        "99999:"
        "90009:"
        "90009")
# kann auch kompakt geschrieben werden (Buchstabe B):
letter_B_img = Image("99990:90009:99990:90009:99990")
 
# Wenn Knopf A gedrueckt ....
if button_a.get_presses():
    pass
  1. Gleicher Code, aber mit selbst gestalteten Symbolen
  2. Für TALITs mit Vorwissen: ausgewähltes Symbol per Radio an andere micro:bits senden
  • Grundfunktionen vom micro:bit kennenlernen
  • etwas komplexeren Code schreiben

Programmiere ein Spiel, in welchem man mit den beiden Tasten ein Raumschiff nach links und rechts (Raumschiff ist ein helles Pixel in unterster Reihe der LED-Matrix) steuern kann. Dabei wird das Raumschiff mit Asteroiden (oder was auch immer) beschossen. Asteroiden sind etwas weniger helle Pixel, die von der obersten Reihe der LED-Matrix nach unten fliegen. Diese Asteroiden sollen random erzeugt werden. Ziel des Spiels ist, möglichst lange den Asteroiden ausweichen zu können. Sobald man getroffen wird, ist Game Over.

# Spiel soll beliebig lang gespielt werden können, deshalb muss Code in ENDLOSSCHLEIFE geschrieben werden
while True:
    pass
  1. Speichere deinen Code regelmässig in einem File 'space_war_i.py'
  2. Erzeuge Raumschiff (hier auch Player genannt), steuerbar mit den beiden Tasten. Ist man ganz links/rechts, so kann man sich nicht weiter bewegen.
  3. Erzeuge den ersten Asteroiden, welcher nach unten fliegt.
  4. Game Over, falls Asteroid das Raumschiff berührt
  5. Erzeuge nun weitere Asteroiden: Diese sollen random erzeugt werden. Game Over muss mit allen Asteroiden funktionieren.
  6. Nach einer gewissen Zeit soll man ins nächste Level gelangen, d.h. mehr und schnellere Asteroiden.
  7. Erzeuge eine Game Over Benachrichtigung: Bei Game Over soll das erreichte Level angezeigt werden und man soll per Knopfdruck ein neues Spiel starten können.
  8. Sei kreativ: Erweitere das Spiel und gib ihm eine persönliche Note.
  • Versionierungssoftware Git installieren und verwenden können
  • GitHub einrichten und verwenden können
  • Python installieren
  • IDE Visual Studio Code installieren und einrichten, Extensions installieren

In der TALIT arbeiten wir mit Git und GitHub. Git erlaubt es dir, auf eine elegante Art und Weise verschiedene Versionen vom gleichen Code zu erstellen. Dies ist viel besser als Kopien vom File zu erstellen. GitHub ist eine Art Cloud-Lösung, auf die man seine Git-Repositories (Ordner, die mit Git verwaltet werden) hochladen kann. Git und GitHub erlauben es auch, in Gruppen am gleichen Code zu arbeiten.

Auch sind für dich die Zeiten von TigerJython vorbei, du bist als TALIT nun zu cool dafür! Stattdessen werden wir mit richtigem Python in der IDE Visual Studio Code (VSCode, VSC) arbeiten. Achtung: TigerJython-spezifische Dinge wie 'gturtle' oder 'repeat' (Pfui!) funktionieren nicht in richtigem Python.

Ziel von diesem Auftrag ist, dass du Git, GitHub, Python und VSCode installierst und einrichtest und lernst, diese zu verwenden.

Teil 1: Git & GitHub

  1. Git installieren (auf Mac und Linux schon vorinstalliert)
  2. GitHub-Account erstellen
  3. Erstelle ein GitHub-Repo 'microbit_projects' (private mit Python-.gitignore) und gib es der Lehrperson (anschae) frei. Lege alle Codes, die mit micro:bits zu tun haben und von dir alleine programmiert wurden, in diesem Repo ab.
  4. Klone das Repo an passender Stelle auf deinen Computer …
  5. und füge den Code vom ersten Projekt (Space-War Game I) dem Repo hinzu.
  6. Pushe den Code auf GitHub und stelle sicher, dass der Upload geklappt hat.
  7. Lasse alles von der Lehrperson überprüfen.

Teil 2: Python & VSCode

  1. Aktuellste Version von Python installieren
  2. VSCode installieren mit wichtigsten Extensions
  3. 'Hello World!' in VSCode programmieren und ausführen zum Überprüfen ob funktioniert.
  • in 2er-Gruppe arbeiten (random)
  • gemeinsam per Git(Hub) am gleichen Code arbeiten
  • micro:bit Vertiefen.

Gearbeitet wird in 2er Gruppen. Überlegt euch ein eigenes micro:bit-Projekt und setzt es um. Verwendet Git und GitHub, damit ihr gemeinsam am gleichen Code arbeiten könnt.

  1. Projektidee überlegen (siehe Ideenliste unten, aber noch besser: eigene Idee)
  2. Mit Lehrperson besprechen, sobald ok …
  3. Auf Papier einen Plan machen: Grobes Vorgehen? Welche Variablen und Funktionen? Gerade Funktionen sind wichtig, da man dies gut Aufteilen kann. Z.B. kann Fritzli die function_a() programmieren und Monika gleichzeitig die function_b().
  4. Eine Person erstellt auf seinem GitHub-Account ein Repository für das Projekt. Verwende einen passenden Namen (beginnend mit 'microbit_', nur Kleinbuchstaben, Underlines anstelle Leerschläge), z.B. 'microbit_rock_paper_scissors'. Das Repo soll 'private' sein und wähle das '.gitignore'-File für Python.
  5. Gib das Repo dann für die andere Person in der Gruppe, sowie für die Lehrperson (Name: anschae) frei.
  6. Die zweite Person soll das Repo dann auf den eigenen Computer clonen.
  7. Beginnt nun mit dem Programmieren (Online- oder Mu-Editor). Gebt dem File einen passenden Namen, z.B. rock_paper_scissors.py (Wieder: snake_case). Committe und pushe regelmässig. Damit ihr in der Gruppe gut am gleichen File arbeiten könnt, macht es Sinn, viel mit Funktionen zu Arbeiten und die Arbeit etwas aufzuteilen: Fritzli programmiert Funktion A aus, während Monika Funktion B programmiert.
  8. Projekt kurz Klasse präsentieren.

Die beiden Lehrer (sca & hof) haben die Projekte untereinander aufgeteilt. Unten seht ihr, wer den Code von eurem Projekt begutachten und euch ein Feedback dazu geben wird. Gebt aber BEIDEN Lehrpersonen (anschae und tkilla77) Zugriff über GitHub. Achtung: Wahrscheinlich müsst ihr einen Educational Account beantragen, damit ihr euer Repo mit mehr als drei Personen verwenden könnt.

Abgabe

  • Deadline ist Sa. 12.03.2021 um 23.59
  • Checkliste (siehe unten) wurde abgearbeitet
  • Pushed euer Projekt auf GitHub. Stellt auf github.com sicher, dass Projekt komplett vorhanden und aktuell ist.
  • Stellt sicher, dass beide Lehrpersonen Zugriff haben
  • Sendet Lehrperson, die euch betreut (siehe unten), den Link zum Repo zusammen mit einer kurzen Beschreibung: Funktioniert? Hat noch Bugs (sollte nicht!), …

Checklist vor Abgabe

Hast du …

  • sinnvolle Variablennamen verwendet?
  • auf Englisch programmiert?
  • dich an Python-Konventionen gehalten? Beispiel: asteroid_speed anstelle von AsteroidSpeed, mehr Infos siehe hier
  • deinen Code sinnvoll strukturiert?
    • sinnvolle (aber nicht zu viele) Zeilenumbrüche
    • sinnvolle Funktionen definiert
  • deinen Code ausreichend Kommentiert:
    • Überschriften z.B. # PLAYER MOTION
    • Erklärungen, was in Zeile gemacht wird, z.B. empty = Image(5,5) # create an empty image
    • Achtung: Es soll nicht jede Zeile kommentiert werden, sondern nur wenn sinnvoll. Die Kommentare sind primär dazu da, dass die Lehrperson in möglichst kurzer Zeit euren Code verstehen kann.

Aufteilung Betreuer

sca

  • JonasLeonadrdo & Kajetan: Pattern folgen mit Accelerometer
  • Livia & Jona: Morsecode übersetzen
  • Hanna & Anatol: Teamwork, zusammen Linie folgen

hof:

Präsentation

  • Jede Gruppe erhält einige Tage nach Abgabe ein Feedback. Setzt dieses umgehend um.
  • Sucht euch in Absprache mit den Betreuer ein Element heraus, welches ihr den anderen TALITs vorstellen möchtet. Dies soll etwas sein, was die anderen möglichst noch nicht kennen.
  • Präsentiert in 5-10 Minuten euer Projekt:
    • Demonstriert Projekt auf micro:bit (könnte im Vorfeld auch auf mehrere micro:bits geladen werden)
    • Stellt Element von Eurem Code über Beamer (z.B. PowerPoint) vor
  • Termine 23.3. & 30.3.

Ziele

  • Philosophie von Model vs. View verstehen …
  • und auf Asteroiden aus Space-War-Game anwenden:
    • Model für Asteroiden aus vorherigem Auftrag entwickeln
    • View für Console-App schreiben

Slides

Model vs. View

Eine der grossen Herausforderungen wird sein, den aktuellen Zustandes des Spiels im Code drin abzubilden. Der Spielzustand hier beinhaltet die aktuellen Positionen des Players, sowie aller Asteroiden. Für den Player ist dies relativ einfach: Man könnte eine Variable player_position initiieren, die einen Wert von $0$ (ganz links) bis $4$ (ganz rechts) annehmen kann. Wie macht man dies am besten für die Asteroiden? Hier ist es ein bisschen komplizierter, da jeder Asteroid sowohl eine x- wie auch eine y-Koordinate hat. Weiter variiert die Anzahl Asteroiden ständig. Eine Möglichkeit wäre z.B., die Asteroiden in eine Liste zu schreiben: Erzeugt man einen neuen Asteroiden, so fügt man diesen der Liste hinzu. Ist der Asteroid am unteren Teil der LED-Matrix angelangt, so entfernt man diesen wieder aus der Liste. Dieses Abbilden des Spielzustands im Code gehört zum Model des Spiels / zur Spiellogik.

Es ist good Practice, die Spiellogik von der View zu trennen. Dies kann man wie folgt machen: Schreibe eine Funktion display(...). Dieser werden die Informationen zum Spielstand übergeben (also Infos zu Positionen von Player und Asteroiden) übergeben. Aufgrund dieser Infos wird dann der Output erzeugt. Im Beispiel hier, wird also ein String s erzeugt, aus dem dann ein Image Image(s) erzeugt wird, welches von der LED-Matrix angezeigt werden kann.

Diese klare Trennung von View und Model hat einen grossen Vorteil im Vergleich zu einem Code, in dem Code der beiden Bereichen wild miteinander vermischt wird: Der Model-Teil deines Codes ist reines Python, der View-Teil beinhaltet Funktionen, die spezifisch sind für den micro:bit. Stelle dir vor, du möchtest nun dein Space-War Game auf einer anderen Plattform als dem micro:bit laufen lassen. Den Model teil kannst du ohne Änderung übernehmen. Du musst nur den View-Teil an die neue Plattform anpassen oder neu schreiben. Kurz: Die Trennung von Model und Code macht deinen Code einfacher portierbar und vielseitiger einsetzbar.

Auftrag

Nun wollen wir die Model vs. View-Philosophie auf die Asteroiden aus unserem Space-War-Game anwenden. Ziel ist, in einem Konsolenprogramm, also in regulärem Python (VSCode, NICHT mit micro:bit), die Bewegung der Asteroiden zu simulieren. Der Player soll für den Moment ignoriert werden. Der Code soll also einfach 'Asteroiden regnen' lassen.

Zuerst sollst du eine Model für die Asteroiden entwickeln. Die zugehörigen Funktionen sind unabhängig von der Game-Plattform (Console-App, micro:bit, …). Danach sollst du eine View erstellen. Diese ist natürlich abhängig von der Plattform und muss umgeschrieben werden, wenn der Code von einer Console-App auf micro:bit geportet wird.

Der Code soll für eine Beliebig grosse Matrix funktionieren. Dein Code soll also zwei Konstanten WIDTH und HEIGHT haben, die diese vorgeben. Für den mirco:bit muss man diesen beiden den Wert $5$ zuordnen.

Bemerkungen:

  • Committe und pushe regelmässig auf GitHub.
  • Achte darauf, dass dein Code ganz sauber strukturiert ist. Verhindere ein 'Gebastel'.
  • Halte dich an die Checkliste von oben.
  • Ist Einzelarbeit (wichtig, dass du ALLEINE codest!)

Teil I

  1. Lade das Template 'space_war_ii_model_view.py' (siehe unten) herunter und füge es dem Repo vom letzten Auftrag hinzu. Das Template dient als Startpunkt.
  2. Entwickle nun ein Model für deine Asteroiden und schreibe die entsprechenden Funktionen zu den ### MODEL FUNCTIONS. Achte darauf, dass diese nichts mit der Anzeige zu tun haben und nur normalen Python-Code beinhalten.
  3. Der Vorteil vom Programmieren mit Funktionen ist, dass man diese einzeln testen kann. Teste deine Model-Funktionen. Zum Beispiel: Erzeuge eine leere Asteroids-Liste. Wende dann deine Funktion, die random Asteroiden erzeugt darauf an und schaue die Liste wieder an. Hat die Funktion gemacht, was sie soll?
  4. Bespreche den Code mit der Lehrperson: persönlich oder per Teams (Link zu Repo schicken)

Template

Teil II: Console-Game

  1. Schreibe nun eine View für deine Asteroiden. Die entsprechende(n) Funktion(en) gehören natürlich unter ### VIEW FUNCTIONS. Dieser Code ist natürilch plattformabhängig.
  2. Teste die View-Funktion(en).
  3. Finalisiere das Programm: Es soll nun 'Asteroiden regnen', der Player wird weggelassen - man kann also nichts steuern.
  4. Bespreche wieder mit der Lehrperson.

Teil III: micro:bit

Mache hier erst weiter, wenn du die vorherige Lösung mit der Lehrperson besprochen hast!

Ziel: Game auf micro:bit portieren

  1. Mache eine Kopie vom letzten Programm und nenne es space_war_ii_microbit.py. Füge es natürlich dem Repo hinzu.
  2. Portieren: Schreibe deinen Code nun so um, dass er auf dem micro:bit funktioniert. Dazu müssen die View-Funktionen neu geschrieben und ein paar weitere kleine Details angepasst werden. Die Model-Funktionen sollen komplett unverändert bleiben.
  3. Natürlich soll jetzt auch der Player hinzugefügt werden. Achte darauf, dass du die Zeit gut umsetzt (siehe unten).
  4. Überprüfe, ob es zu einer Kollision zwischen dem Player und einem Asteroiden kommt. Dies hat nichts mit der Anzeige zu tun und soll in einer neuen Model-Funktion umgesetzt werden.
  5. Das Spiel soll gut spielbar sein, d.h. zum Beispiel: guter Schwierigkeitsgrad, keine Crashs, …

Zeit: Mit der sleep-Funktion kann man die Dauer eines Frames festlegen. Beachte, dass diese nicht zu hoch sein darf, damit man den Player flüssig bewegen kann - eine Framedauer von 1s (sleep(1000)) wäre zum Beispiel viel zu hoch. Wähle eine viel kürzere Frame-Dauer. Das Problem ist nun, dass sich die Asteroiden viel zu schnell bewegen. Löse dies wie folgt: Lege in einer KONSTANTEN fest, nach wie vielen Frames die Asteroiden updated werden sollen. Zähle dann in einer Variablen die Frames und update die Asteroiden, sobald der Wert erreicht wird.

Teil IV - GRANDE FINALE (für den Moment)

Erledige mind. einen der folgenden beiden Aufträge - am besten natürlich beide ;) Der zweite ist spannender, da du dort PyGame kennenlernst - ein Python-Modul, mit welchem man Games entwickeln kann. Mit PyGame werden wir in einem höheren Semester wieder arbeiten.

Option 1: mirco:bit

Ziel: Code aus Teil III perfektionieren und weitere Features hinzufügen

  • Mit der Zeit soll das Spiel schwieriger werden (höhere Wahrscheinlichkeit für Asteroiden und/oder bewegen sich schneller). Die genauen Einstellungen sollen in KONSTANTEN festgelegt werden.
  • Game-Over-Anzeige
  • Nach Game-Over soll wieder neues Game starten können per Knopfdruck
  • Game Balancing: Passe alle Konstanten so an, dass es Spass macht, das Spiel zu spielen:
    • am Anfang: Mischung zwischen einfach (keine Frustration) und schwierig (Überforderung)
    • mit der Zeit: Spieler:in soll gefordert (aber nicht zu schnell überfordert) werden
Option 2: PyGame

Ziel: Game auf PyGame portieren

  1. Lade das Template unten herunter und bringe es zum Laufen.
  2. Verschaffe dir einen Überblick über den Code und versuche grob zu verstehen, welche Zeile was macht. Die PyGame-Funktionalitäten müssen nur angewendet und nicht im Detail verstanden werden können.
  3. View für Asteroiden: Implementiere eine View für das Space War Game. Verwende dazu die Model-Funktionen von oben unverändert. Es soll nun Asteroiden (also farbige Quadrätchen) regnen.
  4. Implementiere nun einen Player: Kästchen in anderer Farbe. Dieser soll mit den Pfeiltasten (sicher links/rechts, kann auch oben/unten dazu nehmen)
  5. Implementiere nun die Collisions: Game-Over, sobald Player auf Asteroiden trifft
    Optional (aber empfohlen):

Mit wenigen Schritten kannst du nun den obigen Code in ein (einigermassen) hübsches Spiel umwandeln. Einige Ideen:

  • Passendes Hintergrundbild (z.B. Weltall)
  • Bilder anstelle von Quadraten für Asteroiden und Player (siehe z.B. Bilder unten, Tipp: Verwende png mit transparentem Hintergrund)
  • Schussfunktion, siehe z.B. Bild mit Bullet unten
  • Schussfunktion limitieren, damit schwieriger wird:
    • gewisse Wartezeit zwischen zwei Schüssen
    • nie 2x hintereinander in gleiche Richtung feuern
    • muss Ammo Sammeln (die auch durch Weltall fliegt)
  • weitere Features:
    • verschiedene Gegner
    • Soundeffekte
    • Bild für Explosion
  • Interessanteres Gameplay implementieren:
    • muss Punkte sammeln
    • irgendetwas auf Zeit

Template

Bilder:

  • talit/microbit_2022.txt
  • Zuletzt geändert: 2023-02-15 12:23
  • von sca