Lernpfad:Einführung in Processing/16

Vorheriger Schritt

Nächster Schritt

Du kennst nun die wichtigsten Konzepte der Programmierung mit Java. Als Abschluss des Lernpfades kannst du alles Gelernte in einem selbst gewählten Abschlussprojekt anwenden. Falls du Ideen für ein kreatives Projekt hast, dann formuliere eine kurze Beschreibung deiner Idee. Bespreche zunächst mit deiner Lehrkraft, ob die Idee in der verfügbaren Zeit umsetzbar ist.

Die folgenden Projekte sind Anregungen und Beispiele, die dir als Vorlage und Inspiration dienen können.

tixy

Im Tauschordner findest du ein Processing-Projekt mit dem Namen tixy. Öffne das Projekt und sieh es dir an.

Klicken, um das Programm zu starten.

Du siehst eine Funktion dot und zwei Reiter: tixy und canvas. canvas soll nicht verändert werden, sondern nur die dot Funktion.

Starte das Programm und schau dir das Ergebnis an. Lösche dann die Zeile return x%4 - y%4 und entferne die Zeichen // aus der Zeile darüber. Studiere erneut das Ergebnis.

Die Zeichen // markieren eine Zeile als Kommentar. Kommentarzeilen werden bei der Ausführung ignoriert.

Das Programm arbeitet nach einem einfachen Prinzip:

1. Die dot-Methode gibt eine Zahl zwischen -1 und 1 zurück (return).
2. Der Betrag der Zahl bestimmt die Größe des Punktes (0.5 und -0.5 bedeuten beide halbe Größe, -.25 und .25 bedeuten beide ein Viertel der Größe, usw.).
3. Negative Zahlen färben den Punkt rot, positive weiß.

Die Funktion erhält vier Parameter:

1. t ist die Zeit, die das Programm läuft in Sekunden.
2. i ist die Nummer des Kreises. Es gibt 16 Reichen und 16 Spalten. Der Kreis oben links hat die Nummer 0, der Kreis links daneben 1, und so weiter bis Nummer 255 unten rechts.
3. x ist die Spaltennummer des Kreises (von 0 bis 15).
4. y ist die Zeilennummer des Kreises (von 0 bis 15).

Arbeitsauftrag

Experimentiere mit der dot-Methode und versuche spannende Muster und Animationen zu erzeugen.

Du kannst Funktionen wie sin(), cos(), tan(), usw. verwenden.

Beispiele für interessante Animationen

Füge die Programmzeilen jeweils in die dot-Methode ein.

return sin(t);

return y - t*2.0;

return sin(y/8 + t);

return random(1.0) * 2 - 1;

return cos(t + i + x * y);

return sin(x/2) - sin(x-t) - y+6;

return (x-8)*(y-8) - sin(t)*64;

return sin(t-sqrt(x*x+y*y));

return sin(t-sqrt(x*x+y*y));

return y-t*3+9+3*cos(x*3-t)-5*sin(x*7);

return 1.0/32.0*tan(t/64.0*x*tan(i-x));

return sin(2*atan((y-7.5)/(x-7.5))+5*t);

float d = PI/3.8;
return sin(pow(x,d)) - tan(pow(y,d));

Das Muster

float size = 50;
float x = 0;
float y = 0;

void setup() {
  size(400, 400);
}

void draw() {
  background(200);
  
  float s = size+(size*sin(millis()/1000.0)*0.5);
  
  for ( float i = 0; i < width/s; i+=1.0 ) {
    for ( float j = 0; j < height/s; j+=1.0 ) {
      fill(255);
      stroke(0);
      strokeWeight(2);
      rect(x + i*s, x+j*s, s, s);
    }
  }
}

Das obige Programm erstellt ein Karo-Muster und animiert es.

Klicken, um das Programm zu starten.

Arbeitsauftrag

1. Analysiere das Programm und erkläre seine Funktion. Nutze die Fachbegriffe, die du in diesem Lernpfad gelernt hast.
2. Animiere das Muster. Du kannst das Programm beliebig modifizieren, aber du musst immer vom ursprünglichen Karo-Muster ausgehen. Sei kreativ!
   • Schau dir für weitere Ideen die Processing Referenz an.
   • Processing kann auch 3D-Szenen zeichnen. Dazu muss die Zeichenfläche beim Erstellen als 3D gekennzeichnet werden. size(400, 400, P3D);. Nun kannst du auch dreidimensionale Formen zeichnen. Zum Beispiel mit box(). Lies für weitere Informationen in der Referenz und bei Michael Kipp nach.

Klicken, um das Programm zu starten.