Processing ist eine Programmierumgebung für Java, die für bildende KünstlerInnen entwickelt wurde. Sie glänzt insbesondere mit einer übersichtlichen Oberfläche, einfachen Funktionen zur Grafikausgabe und einem Haufen per Mausklick installierbarer Libraries, die alle möglichen interessanten Funktionen zur Verfügung stellen.

Damit ist Processing ideal geeignet, um ein graphisches Interface zu eurem Roboter zu bauen.

• Ladet euch hier https://processing.org/download/ die Software herunter. Nehmt am besten die 32bit-Version, egal was für ein Betriebsystem oder Computer ihr habt. (Die macht weniger Probleme mit externen Libraries)
• entpackt die .zip-Datei an einen Ort, wo ihr sie haben wollt
• Startet Processing mit einem Doppelclick auf die Entpackte „.exe“ Datei.

Das, was in Arduino setup und loop sind, heisst in Processing setup und draw

Dieses Programm zeichnet eine Linie, die diagonal einmal quer durch das Bild geht:

Liniezeichnen.pde

void setup(){
  size(400, 400);
  background(255);
}
 
void draw(){
  for (int i = 0; i < 400; i++) {
    point(i, i);
  }
}

Das gleiche kann auch ohne for-Schleifen mit einer globalen Variable gemacht werden. Wie geht das?

Das folgende Programm zeichnet einen Kreis um den Koordinatenursprung:

Kreiszeichnen.pde

float angle=0;
float radius=50;
void setup(){
 
}
 
void draw(){
  point(cos(angle)*radius,sin(angle)*radius);
  angle+=0.01;
}

Damit die Bewegung kontinuierlich angezeigt wird, muss in jedem „draw“ Aufruf ein Punkt gezeichnet werden (also keine Schleife).

Jetzt wollen wir eine aus Punkten zusammengesetzte Sinuskurve zeichnen, die das Fenster genau ausfüllt. Auf der x-Achse sollen die Winkelwerte zwischen 0 und 2π angezeigt werden. Auf der y-Achse die Sinuswerte zwischen -1 und 1. Die x-Koordinate wird in die Zahl zwischen 0 und 2π umgerechnet:

float angle = xCoordinate * TWO_PI / windowWidth;

Sinuskurvezeichnen.pde

void setup() {
  size(600, 400);
  background(255);
}
 
void draw() {
  for (int i = 0; i < 600; i++) {
    float angle = i * TWO_PI / 600;
    float xValue = i;
    float yValue = sin(angle) * 200 + 200; 
    // der Koordinatenursprung wird um die halbe Hoehe verschoben, 
    // damit der Wertebereich <0 auch sichtbar ist. 
    point(xValue, yValue);
  }
}