Entwicklung

Erste Schritte in Processing

Dieser Artikel ist älter als zwei Jahre und womöglich veraltet!

Processing stellt eine einfache Entwicklungsumgebung für den Einstieg in die Programmierung dar. Auch für fortgeschrittene Programmieren hält die IDE eine Möglichkeit für die rasche und einfache Umsetzung einer Idee bereit.

Übersicht

Processing verwendet eine vereinfachte Syntax von Java und beeinhaltet eine simple IDE für die Entwicklung in dieser Sprache. Seine Stärken spielt die Sprache vor allem beim Erstellen von grafischen Programmen, also vor allem bei Zeichnungen und (auch interaktiven) Grafiken.

Processing IDE

Das Ergebnis wird als exe-Datei ausgegeben, die auch außerhalb des verwendeten Systems lauffähig ist. Außerdem kann das Programm als Java-Applet exportiert werden. Da die Verwendung von Applets in Zeiten von HTML5 eher zu vermeiden ist, können die Programme auch mit Processing.js in JavaScript mit Hilfe des canvas-Elements dargestellt werden.

Zusammen mit der IDE werden auch Beispiele für die Processing-Sprache mitgeliefert. Eines davon ist dieses Beispiel in dem Kreise mit der Maus gezeichnet werden, oder auch dieser Würfel.

Download

Die komplette IDE kann auf der offiziellen Website heruntergeladen werden und steht dort in Versionen für Windows, Mac OSX und Linux bereit. Wenn man bereits das Java SDK installiert hat, kann man auch die Version „Windows (Without Java)“ verwenden, was natürlich Größe einspart.

Nach dem Download, das bei einer DSL-Leitung nur etwa 2 Minuten dauert, und dem Entpacken startet man die IDE ohne Installation durch Ausführen von processing.exe.

Aufbau eines Programmes

Ein Programm wird in Processing „Sketch“ genannt und besitzt immer die folgende Grundstruktur:

void setup(){

}

void draw(){

}

Im Abschnitt „setup“ werden die grundlegenden Einstellungen wie die Fenstergröße oder Startwerte von Variablen einmalig angegeben. Dieser Abschnitt wird nur einmal am Anfang des Programmes ausgeführt.

Der Teil namens „draw“ wird immer wieder für jeden Frame im Laufe des Programmes aufgerufen. Hier hinein wird auch der Hauptinhalt geschrieben, der das eigentliche Programm ausmacht. Um beispielsweiße eine einfache Linie von einer Ecke in die andere Ecke zeichnen zu lassen, braucht man folgendes:

void setup(){
	size(200,200);
	line(0,0,200,200);
}

void draw(){

}

Mit ‘size(200,200)’ wird die Größe des Fenster angegeben und mit ’line(0,0,200,200)’ die Linie gezeichnet. Die ersten beiden Werte geben die x und y-Position des Startpunktes an und die beiden letzten Zahlen die Korrdinaten des Endpunktes.

Interaktivität

Um ein Processing-Programm interaktiv zu machen kann man zum Beispiel die Position der Maus abrufen. In den Variablen ‘mouseX’ und ‘mouseY’ sind die aktuellen Koordinaten des Mauszeigers enthalten. Um nun die Linie an der Position der Maus starten zu lassen, muss die Position natürlich laufend abgerufen werden. Dazu muss diese Logik in den „draw“-Bereich wandern:

void setup(){
	size(200,200);
}

void draw(){
	line(mouseX,mouseY,200,200);
}

Natürlich gibt es noch viel mehr Beispiele und Verwendungmöglichkeiten, doch die ersten Schritte mit der Programmiersprache und der IDE habe ich mit diesem Artikel hoffentlich leicht verständlich vermittelt.