Tag 1 9.Interfaces

Wir haben bereits gelernt, dass sich sich Mausposition über die beiden Variablen mouseX und mouseY abfragen und für Programme nutzen lässt. Mausklicks werden über mousePressed erfasst.

8.1 Keyboard

Durch setup() und draw() ist der Code in Bereiche gegliedert, die unter bestimmten Bedingungen ausgeführt werden. setup() am Anfang des Programms, draw() in einer endlosen Schleife. Wie aber lässt sich Code anderen Ereignissen als den Programmstart (setup()) zuweisen? Dies ermöglichen Events, deren Code immer ausgeführt wird, wenn ein bestimmter Event eintritt. Dies können Mausklicks oder Tastatureingaben sein.


void keyPressed(){
   Anweisungen;
}

Wie auch bei setup() und draw() handelt es sich bei keyPressed() um eine Funktion (weiteres zu Funktionen siehe weiter unten). Der definierte Code-Block wird jedesmal ausgeführt, wenn eine Taste der Tastatur gedrückt wird.


void keyPressed(){
   if (key == 's'){
       background(100);
   }
}

Um festzustellen, welche Taste gedrückt wurde und einer Taste bestimmte Befehle zuzuordnen muss die Variable key, in der gespeichert ist, welche Taste gedrückt wurde, ausgelesen werden. Durch eine if-Abfrage wird getestet, ob eine bestimmte Taste gedrückt wurde:

8.2 Maus

Wir haben bereits kennengelernt, wie man die Mausposition über mouseX und mouseY abfragen können. Aber über Events lassen sich ähnlich wie Tastatur- auch weitere Mausereignisse abfragen. Die entsprechenden Funktionen sind:

mouseMoved()
mouseDragged()
mousePressed()
mouseReleased()
…

Beispiel:


void mousePressed(){
   ellipse(mouseX, mouseY, 10,10)
}

8.3 Textausgabe

Um NutzerInnen darüber zu informieren, welche Interaktionsmöglichkeiten zur Verfügung stehen, können diese in Form eines Textes angezeigt werden. Der entsprechende Befehl lautet text().

text("Press r to restart", 10,40);

Texte können formatiert werden, indem die Schrift definiert wird (textFont()), die Größe geändert wird (textSize()), etc.

Wie müsste ein Programm aufgebaut sein, das die Pinselspitze aus Beispiel 1-6 durch Tastatureingaben verändern lässt? Parameter: Spraycan/Brush, Durchmesser, Deckkraft, Farbe.

1. Fertige eine Skizze über den Ablauf an.
2. Programmiere die Anwendung entsprechend.