Ulli's Python Kurs

Processing Grafikmodul

Processing ist eine Editor Software zum Erlernen von Java. Inzwischen kann man mit dem Processing Editor auch in Python und JavaScript Programme schreiben. Processing bietet zu den Standardbefehlen der jeweiligen Programmiersprache zusätzliche Befehle an, mit denen man Grafiken in 2D (Linien, Kreise, Rechtecke, ...) und 3D (Kugel, Würfel, ...) erstellen kann. Die Processing Bibliothek für JavaScript heisst p5.js und kann mit meinem HTML / CSS / JavaScript - Online - Editor ausprobiert werden.
Für meinen Python - Online - Editor habe ich auf Grundlage von p5.js ein Python Modul entwickelt, so dass man jetzt Online Processing Programme schreiben und ausführen kann.

  1. Um Processing Befehle verwenden zu können muss man den Processing - Modus aktivieren:Processing Modus aktivieren Beim Starten des Programms wird dann am Programmanfang "from p5 import *" (Import des Processing Moduls) eingefügr. Außerdem werden einige Processing Variablen z.B. width und height in Funktionen width() und height() umgewandelt. Bei Processing Programmen mit def setup(): und def draw(): wird am Ende des Programms run() ergänzt.
    • "ein" ergänzt alles nur im Hintergrund; das Processing Programm wird nicht verändert und läuft bei Bedarf auch im Processing Editor.
    • "Code ändern" übernimmt alle Änderungen in den Online Editor. Dadurch läuft das Programm danach auch ohne Processing Mode. Im Processing Editor Programm funktioniert das Programm jetzt nicht mehr.
    Processing Programme (*.pyde) können auch lokal geladen und gespeichert werden.
  2. Einfaches Processing Programm im Direkt-Modus
    Zunächst muss man mit der size(Breite, Höhe, Modus) Funktion die Größe des Grafikfensters festlegen (und ggf. den 2D oder 3D Grafikmodus). Danach kann man zeichnen:
    • background(Farbe) färbt den Hintergrund der Grafik.
    • rect(x,y, Breite, Höhe) zeichnet ein Rechteck (linke obere Ecke bei x/y)
    • quad(x1,y1, x2,y2, x3,y3, x4,y4) Viereck mit den Ecken bei x/y 1-4. Die Ecken werden nacheinander mit einer Linie verbunden, deshalb ist die Reihenfolge der Eckpunkte wichtig!
    • triangle(x1/y1, x2,y2, 3,y3) zeichnet ein Dreieck
    • ellipse(x,y, Breite, Höhe) zeichnet eine Ellipse bzw. einen Kreis (wenn Höhe und Breite gleich sind); Mittelpunkt bei x/y.
    • arc(x,y, Breite,Höhe, von Winkel, bis Winkel); die Winkel werden in Bogenmaß angegeben; 0 Grad ist bei 3 Uhr, PI bei 9 Uhr. Der gesamte Kreis (360 Grad) ist 2 * PI
    • fill(Farbe) vor dem Zeichnen füllt die Figur aus. Mit noFill() schaltet man den Füllmodus wieder aus.
    • line(x1,y1, x2,y2) zeichnet eine Linie von x1/y1 nach x2/y2.
    • strokeWeight(Liniendicke) legt die Liniendicke (in Bildpunkten) fest.
    • stroke(Farbe) legt die Linienfarbe fest


  3. from p5 import *
    size(600, 400)
    background("green")
    rect(50, 50, 200, 100)
    fill("red")
    ellipse(width() / 2, height() /2, 40, 80)
    stroke("blue")
    strokeWeight(10)
    line(50, 350, 550, 350)
    triangle(450,50, 400,300, 500,300)
    Ergebnis des Programms
  4. Natürlich können beim Zeichnen auch Variable, Schleifen, Listen, Wenn-Dann-Abfragen, selbst definierte Funktionen, usw. verwendet werden. Hier einige Aufgaben zum Ausprobieren:
  5. Haus
    Schachbrett


    Tick Tack To Feld
  6. Bilder
  7. 3D - Modus

Processing is an open project intiated by Ben Fry and Casey Reas. It is developed by a small team of volunteers. Processing.py is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License