23. September 2013
Einfache Formen: Am zweiten Tag wurden wir noch einmal über die Grundfunktionen von Processing aufgeklärt. So erfuhren wir, was "size" und "background" etc. bedeutet, und konnten zum ersten Mal ein wenig an den Parametern einfacher Formen rumspielen. Variablen: Danach hat uns Max mit der Bedeutung von Variablen vertraut gemacht. So konnten wir dann zum Beispiel anhand einer definierten globalen Variable Längen definieren und diese dann in den Koordinaten zweier Ellipsen zum Ausdruck bringen. Println-Funktion: An diesem Beispiel wurde uns erklärt, wie wir die "println" Funktion anwenden können. Diese Funktion ist sehr wichtig wenn wir zum Beispiel debuggen wollen. Wir können als Variablen Werte definieren, und diese danach in der Konsole ausdrücken. Dies funktioniert auch, wenn wir die Variablen in einfachen mathematischen Gleichungen darstellen. Grösser werdende Ellipse: Das erarbeitete Wissen konnten wir danach weiter anwenden. Diesmal in der "draw" Funktion als Animation. In einer Version zeigte sich das in einer Ellipse, die wächst. Ellipse mit Schweif: In einer anderen Version, die wir um Teil zusammen in der Klasse gemacht haben, sehen eine Ellipse, die wächst und in der unteren Hälfte grün und in der oberen Hälfte rot ist. Zudem wird in der "draw" mit einer leichten Transparenz von 10 ständig über das vorherige Bild gemahlen, so dass es so aussieht, als dass der Kreis einen Schweif hätte. Malprogramm: Als letzte Aufgabe an diesem Tag mussten wir ein kleines Malprogramm schreiben. In diesem Malprogramm sollte es mindestens möglich sein, dass man mit den Zahlen 1 bis 5 auf dem Keyboard verschiedene Farben auswählen, mit der linken Maustaste male und mit der rechten Maustaste radieren kann.color farbe = color(0, 200, 0); int groesse = 50; void setup() { size(600, 600); background(255); frameRate(180); smooth(); } void draw() { if (mousePressed) { println(mouseButton); switch(mouseButton) { case LEFT: fill(farbe); break; case RIGHT: stroke(255); fill(255); break; } ellipse(mouseX, mouseY, groesse, groesse); } } void keyPressed() { switch(key) { case '1': farbe = color(0, 200, 0); break; case '2': farbe = color(0, 0, 200); break; case '3': farbe = color(255, 0, 0); break; case '4': farbe = color(#F6FF00); break; case '5': farbe = color(#00ECFF); break; // grösser case 'w': groesse +=5; break; // kleiner case 'q': groesse -=5; break; // Repetition case 'r': for (int i = 0; i < 20; i += 1) { for (int j = 0; j < 20; j += 1) { ellipse(i * mouseX, j * mouseY, groesse, groesse); } } } }Ich habe das so gelöst, dass ich zuerst mit der "color" Funktion eine Farbe definiert habe, die Farbe habe ich "farbe" genannt. In der "draw" Funktion habe ich danach mit der "if (mousePressed) "Bedingung" gearbeitet. Mit switch(mouseButton) LEFT oder RIGHT wird entschieden, ob man entweder mit "farbe" oder mit weiss (radieren) malt. Gemalt wird mit einer Ellipse die sich immer an der Mausposition befindet. In der „keyPressed“ Funktion werden dann mit „switch(key)“ mit den Tasten 1 bis 5 auf dem Keyboard die Farben gewechselt. Mit den Tasten „w“ und „q“ kann man die Pinselgrösse verändern. Dies funktioniert so, dass ich eine globale Variable mit der Grösse 50 definiert habe. Diese Variable haben ich „groesse“ genannt und danach in die beiden Radiusgrössen der Ellipse eingegeben. Jedes Mal, wenn jetzt „w“ gedrückt wird, wird „groesse“ um 5 Pixel vergrössert und wenn „q“ gedrückt wird, um 5 Pixel verkleinert. Schlussendlich wollte ich mich auch noch an einer „Repetition“ versuchen, dies habe ich mit einer „for“ Schleife versucht. Wenn „r“ gedrückt wird, dann wird die Ellipse mit dem Abstand vom Nullpunkt der X und Y-Achse zu den Koordinaten der Mausposition in beiden Richtungen zwanzig Mal repetiert.