Diana Lange. Generative Gestaltung Grundlagen von Processing

Transkript

1 Diana Lange Generative Gestaltung Grundlagen von Processing

2 Bereichsaufbau leitet einen Bereich ein Name des Bereichs (z.b. setup, draw, keypressed,...) (genaue Erklärung kommt später) kommt später, momentan immer ( ) void bezeichner() { Inhalt des Bereichs, wird mit { begonnen, hört mit auf Kommentare: Werden beim Ausführen übersprungen - sind Notizen für den Programmierer // Einzeiliger Kommentar mit Doppelslash /* Mehrzeiliger Kommentar beginnt mit SlashSternchen und endet mit SternchenSlash */

3 Bereichsaufbau leitet einen Bereich ein Name des Bereichs (z.b. setup, draw, keypressed,...) (genaue Erklärung kommt später) kommt später, momentan immer ( ) void bezeichner() { Inhalt des Bereichs, wird mit { begonnen, hört mit auf void setup() { void draw() {

4 Programmablauf void bezeichner() { Innerhalb eines Bereichs wird der Code immer von oben nach unten ausgeführt

5 Programmablauf Programmeinstieg (hier startet das Programm immer) void setup() { void draw() { Die einzelnen Bereiche werden intern über ihren Namen aufgerufen (aufrufen = ausführen). Dadurch das wir die vordefinierten Namen verwenden (setup, draw), weiß Processing, dass diese Bereiche aufgerufen werden sollen - und in welcher Reihenfolge (die Reihenfolge wird von Processing bestimmt). 1. setup (Alle Befehle die in setup stehen werden nacheinander ausgeführt) 2. draw (Wird ausgeführt, sobald setup fertig ist)

6 Programmablauf Programmeinstieg (hier startet das Programm immer) void draw() { void setup() { Da der Aufruf der Bereiche über ihren Namen erfolgen, ist die Reihenfolge dieser egal. Aus Gründen der Übersichtlichkeit sollte aber im Code immer erst der setup() Bereich und dann der draw() Bereich definiert werden. Anmerkung: setup() und draw() darf es in jedem Code nur einmal geben! Denn: Die Bezeichner (Namen) der Bereiche müssen eindeutig identifizierbar sein. Wenn wir zwei setup() Bereiche hätten, dann wäre keine eindeutige Zuordnung mehr möglich (Soll nun setup() (1) oder setup() (2) als erstes aufgerufen werden?)

7 Programmablauf Programmeinstieg (hier startet das void setup() { 1x Wird genau einmal ausgeführt Programm immer) void draw() { Der draw() bereich wird geloopt, d.h. sobald draw fertig ausgeführt wurde, fängt das Abarbeiten wieder von vorne an. x Wird kontinuierlich ausgeführt - solange das Programm läuft Wenn die letzte Zeile des draw() Bereichs abgearbeitet wurde, dann wird ein neues Bild im Ausgabefenster erzeugt

8 Erste AnWeisungen Grafische Elemente size(breite, hoehe); background(farbwert(e)); point(x, y); line(x1, y1, x2, y2); ellipse(x, y, breite, hoehe); rect(x, y, breite, hoehe); ganze, positive Zahlen, erste Anweisung in setup(), Fenstergröße zeichnet eine deckende Fläche über das gesamte Ausgabefenster ganze Zahlen + negative Zahlen + gebrochene Zahlen Grundformen Alle Angaben in Pixeln. Koordinatensystem beginnt links oben. Werte werden mit Komma getrennt. Einfache Klammern umrahmen Werte, die zu einer Anweisung gehören. z.b. (x, y) gehört zu point. Semikolon beendet eine Anweisung. Gebrochene Zahlen werden mit Punkt geschrieben. z.b Anstelle von Zahlenwerten kann auch ein Rechenterm stehen. z.b. statt point(10, 15); geht auch point(20 / 2, * 5);

9 Farbwerte gilt nicht für background() (grau) (rot, gruen, blau) (#hexadezimal) (grau, alpha) (rot,gruen,blau,alpha) (#hexadezimal, alpha) 0 (schwarz) bis 255 (weiß) pro Kanal jeweils von 0 (Farbe nicht vorhanden) bis 255 (Farbe vorhanden) Beginnt immer mit # und besteht aus 6 Zeichen ( und A... F) Grauwert mit zusätzlichem Transparenzkanal, alpha von 0 (komplett Transparent) bis 255 (komplett deckend) Farbwert mit Transparenz Farbwert mit Transparenz (122) (255, 100, 40) (#FF7711) (122, 100) (255, 100, 40, 85) (#FF7711, 85)

10 Aussehen strokeweight(staerke); positive Zahl, Konturstärke stroke(farbwert(e)); fill(farbwert(e)); aktiviert Füllung bzw. Kontur und setzt die Farbe nostroke(); nofill(); deaktiviert Füllung bzw. Kontur Funktionieren jeweils wie Schalter. D.h. fill() setzt die Füllfarbe für alle nachfolgenden Elemente, solange bis erneut mit fill() eine andere Farbe gesetzt wurde oder sie mit nofill() deaktiviert wird.

11 Bezeichner Bezeichner sind frei wählbare, eindeutige Namen für z.b..pde Dateien (oder später Variablen- und Methodennamen) Bezeichner können aus einer beliebigen Anzahl von Buchstaben, Zahlen und Strichen (-_) bestehen Es gibt einige Einschränkungen für Bezeichner: Bezeichner müssen mit einem Buchstaben anfangen (keine Zahlen oder Striche als erstes Zeichen) (falsch: 1stesProgramm.pde, richtig: programm1.pde) Bezeichner dürfen nicht wie vordefinierte Schlüsselwörter heißen (z.b. void, float, return) Bezeichner dürfen keine Sonderzeichen enthalten; darunter fallen auch die deutschen Umlaute (also keine?,!, Ä, Ü, Ö, ß, usw.) Bezeichner dürfen keine Leerzeichen enthalten. Statt der Leerzeichen hat sich bei zusammengesetzen Namen die Camelcase-Schreibweise (Binnenmajuskel) etabliert: z.b. ProcessingIstEineOpenSourceProgrammierumgebung Desweiteren sind alle Bezeichner und Schlüsselbegriffe case sensitive - d.h. es wird zwischen Groß- und Kleinbuchstaben unterschieden. setup ist also etwas anderes als Setup