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: Frühlingserwachen
Erzeuge eine Reihe von mindestens drei statischen Grafiken rund ums Thema "Frühling".
Programmiere dazu ein Sketch, der u.a. mit random() gesteuert wird, und speichere Screenshots ab.
A3: Interaktiver eCard-Generator
Entwirf ein Programm, dass verschiedene interaktive Grafikstyles verwendet, die der Nutzer miteinander kombinieren kann. Das kann unter anderem sein:
- Mit Schleifen erzeugte Grafiken
- Zufällig positionierte visuelle Elemente
- Bilder laden und als Stempel (Brush) verwenden
- Fonts verwenden, um abschließend noch einen Gruß auf die Karte zu setzen.
- und alles, was euch noch so einfällt …
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 Graphic 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.