Willkommen auf unserem Seminar-Blog

Immer auf dem aktuellen Stand bleiben

Dieser Seminar-Blog befindet sich noch im Aufbau und wird in den kommenden Tagen entsprechend verfeinert.

Member Login

Lost your password?

Registration is closed

Sorry, you are not allowed to register by yourself on this site!

You must either be invited by one of our team member or request an invitation by email at viad.info {at} zhdk {dot} ch.

18.09.2013 – Erste Übungen und Malkasten

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. sketch 03 B sketch 03 C 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. sketch 06 B sketch 06 C 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. Bildschirmfoto 2013-09-23 um 10.48.55 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. rotgruenrotgruen 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. Bildschirmfoto 2013-09-23 um 10.52.26 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. sketch 12 B2