Creative Coding

btk

Till Nagel

Einführung - Woche 1

Aufgaben

A1: Japan

Erstelle ein Programm, das an zufällige Positionen verschiedenfarbige Kreise zeichnet. Die Farbe jedes Kreises hängt davon ab, ob der Kreis innerhalb eines imaginären großen Kreises liegt oder nicht.

Variante: Lass die Größe der Kreise variieren.

Diskussion: Wie kann man prüfen, ob ein Punkt innerhalb eines Rechtecks liegt?

A2: Freeform

Entwerft und programmiert einen Sketch, der mit Hilfe einer oder mehrerer der unten genannten Funktionen (Abstandsmessung, Kollisionserkennung, logischen Verknüpfungen) eine statische oder dynamische Grafik erstellt.


Logische Operatoren

Durch if und else kann der Programmablauf gezielt gelenkt werden. Wir formulieren Bedingungen, um dann den Ergebnissen verschiedene Anweisungen zuzuordnen.
Im Falle eines Mausklicks ist das einfach abzufragen, da die Maustaste nur entweder gedrückt oder nicht gedrückt sein kann:

Wenn nun nicht eine Bedingung, sondern mehrere Bedingungen gleichzeitig zutreffen sollen, kann dies mit Hilfe von logischen Operatoren (auch: boolesche Operatoren) geprüft werden.

In diesem Fall werden also Bedingungen durch den &&-Operator verknüpft, was bedeutet dass die Maustaste gedrückt und dass es die rechte Maustaste sein muss. Wenn also die linke Maustaste gedrückt wird, würde der Code nicht ausgeführt werden, obwohl eine der Bedingungen (nämlich mousePressed) wahr ist.

UND

a && b

Dieser boolesche Operator prüft, ob beide Bedingungen wahr sind.

Beispielsweise könnte sich die Farbe eines Objekts ändern, wenn man mit der Maus in die rechte Hälfte des Zeichenbereichs klickt. Bisher mussten wir in solch einem Falle zwei if-Abfragen verschachteln:

Mit Hilfe einer UND-Verknüpfung kann dies nun eleganter gelöst werden:

Die folgende Tabelle stellt dar, welches Ergebnis bei welchen Werten herauskommt. Die ersten beiden Spalten ("a" und "b") sind jeweils boolesche Werte – etwa Bedingungen wie mousePressed – und die dritte Spalte zeigt den resultierenden Wahrheitswert der logischen Operation.

a b a&&b
0 0 0
0 1 0
1 0 0
1 1 1

Wenn etwa "a" falsch ist und "b" wahr ist, dann ist "a UND b" falsch (siehe Tabelle 2. Reihe).

ODER

a || b

Der boolesche Operator ODER prüft, ob mindestens eine der beiden Bedingungen wahr ist.
Das Ergebnis einer ODER-Bedingung ist folglich true, wenn entweder "a" oder "b" wahr ist, aber natürlich auch, wenn beide wahr sind.

a b a||b
0 0 0
0 1 1
1 0 1
1 1 1

NICHT

!a

Der NICHT-Operator dreht den Wahrheitswert einer Bedingung um.

a !a
0 1
1 0

Multiple Verknüpfungen

Die logischen Operatoren werden also dazu benutzt, Einzelbedingungen miteinander zu kombinieren. Es können aber nicht nur zwei, sondern beliebig viele Bedingungen verknüpft werden.

So ist zum Beispiel der Ausdruck mouseX > 100 && (mousePressed || keyPressed) dann wahr, wenn die Mausposition auf der x-Achse größer 100 ist und die Maus oder eine Taste gedrückt wird.

Dabei ist darauf zu achten, dass die Bedingungen richtig geklammert werden.

Boolesche Variablen

Boolesche Variablen können gut dazu eingesetzt werden, bestimmte Zustände in einem Programm zwischen zu speichern.

Zum Anderen sind boolean-Variablen sinnvoll, um den Wahrheitswert von komplexen, längeren Bedingungen zu speichern.

Kollision von einfachen geometrischen Objekten

Im letzten Semester wurde vorgestellt, wie man Kollisionen gegen einen Rand erkennen kann; zum Beispiel mit if (x >= width). Diese einfache Kollisionserkennung funktioniert allerdings nur bei vertikalen oder horizontalen Linien.
Wie ein Programm auf andere "Berührungen" reagieren kann, wird im Folgenden vorgestellt.

Linie

Wie abgefragt werden kann, ob ein Punkt eine Linie überschritten hat, wurde bereits im Rahmen von Bewegungen gezeigt (siehe Creative Coding 1) und wird z.B. so verwendet:

Oder beispielsweise in einer Funktion mit einem boolean-Rückgabewert:

Kreis

Um zu wissen, ob ein Punkt innerhalb eines Kreises liegt, muss geprüft werden, ob der Radius größer ist als der Abstand zwischen Kreismittelpunkt (circleX, circleY) und dem Punkt an der Position (x, y).

Punkt außerhalb

Punkt innerhalb

Oder als Funktion:

Zwei Kreise

Zwei Kreise berühren, bzw. überschneiden sich, wenn der Abstand zwischen ihren Mittelpunkten kleiner ist als die Summe der beiden Radien.

Kreise schneiden sich nicht

Kreise schneiden sich

Hier geht er zur interaktiven Veranschaulichung des Algorithmus.

Rechteck

Um zu prüfen, ob ein Punkt innerhalb eines Rechtecks ist, müssen alle vier Kanten getestet werden. Der Punkt muss zwischen oberer und unterer, und zwischen linker und rechter Seite des Rechtecks liegen. Daher ist es hierbei sinnvoll, die Prüfungen mittels UND (&&) zu verknüpfen:

dist()

dist(x1, y1, x2, y2);

Berechnet die Entfernung zwischen zwei Punkten.
Wird beispielsweise in obiger circlesIntersect(...)-Funktion verwendet, um den Abstand der Kreismittelpunkte zu erhalten.

Creative Commons Lizenz: Namensnennung-NichtKommerziell-Weitergabe unter gleichen Bedingungen 2.0 (Deutschland)

© 2008 Till Nagel, All rights reserved – Alle Rechte vorbehalten.