Werkzeugkoffer Teil 2

Werkzeugkoffer nutzen

Das schönste Bild wird nicht zwingend mit dem besten Pinsel gemalt, sondern es kommt vielmehr auf den richtigen Einsatz des / der Werkzeuge an.

Im ersten Schritt suchen wir uns eine kleine Anzahl an Werkzeugen aus, zwei bis drei sollten vorerst reichen. Sobald wir die Joshua-Davis Taste, sprich die Leertaste, gedrückt haben, erzeugen wir mit diesen Werkzeugen ein neues Bild.

Der nächste Ansatz verfolgt das Ziel, das wir gezielt Werkzeuge hinzufügen bzw. auch wieder entfernen können, um durch einen iterativen Prozess verschiedene Kombinationen auszuprobieren.

Hierbei werden wir if-Schleifen nutzen, um Bedingungen zu überprüfen. Die einfachste Bedingung lässt sich mit ja oder nein, sprich true oder false beantworten.

Beispiel:

boolean isSummertime = true;
 
if( isSummertime == true )
{
 println( "Sommerzeit" );
}

Um nicht nur An/Aus-Zustände zu überprüfen, kann man zwischen den Bausteinen if und else auch else if nutzen, um mehrere Zustände abzufragen. So könnte man zum Beispiel überprüfen welcher Wochentag ist, um auf dieser Basis Entscheidungen zu treffen.

Beispiel:

String currentDay = "Monday";
 
if( currentDay == "Monday" )
{
  println( "Wochenanfang" );
}
else if( currentDay == "Wednesday" )
{
  println( "Bergfest" );
}
else if( currentDay == "Saturday" )
{
  println( "Wochenende" );
}

Für heute wollen wir überprüfen, welche Werkzeuge aktiviert sind und welche nicht.

Beispiel:

toolSet1IsActive = toolSet2IsActive = toolSet3IsActive = 
doRedraw = false;
 
if( key == '1' )
{
  toolSet1IsActive = true; 
  doRedraw = true;   
}
else if( key == '2' )
{
  toolSet2IsActive = true;
  doRedraw = true;
}
else if( key == '3' )
{
  toolSet3IsActive = true;
  doRedraw = true;
}
 
if(  doRedraw == true )
{
  startRedraw(); 
}

PDF Export

Für heute wollen wir zwei Möglichkeiten kennenlernen, um generierte Grafiken direkt als PDF zu exportieren.

Im ersten Schritt müssen die externe PDF-Bibliothek einbinden, um PDFs exportieren zu können. Der Befehl dafür lautet import processing.pdf.*;.

Bei der ersten Variante wird der bereits verwendete Befehl size( width, height ) um zwei Parameter auf size( width, height, PDF, "filename.pdf" ) erweitert. Am Ende der draw()-Funktion beendet man das Beschreiben des PDFs mit dem Befehl exit().

Beispiel:

import processing.pdf.*;
 
void setup()
{
  size( 800, 600, PDF, "deinName.pdf" );
  smooth();
  background( 120 );
  stroke(200);
  noLoop();
 
}
void draw()
{
  drawCircles( 100 );
  exit();
}

Der Haken an dieser Variante ist, dass ohne das Anzeigen des Ausgabefensters, direkt ein PDF erzeugt wird. Bei vielen Arbeiten mag das egal sein, wenn man hingegen mehr Kontrolle wünscht, dann sollte man mit den Befehlen beginRecord( PDF, "filename.pdf" ) und endRecord() arbeiten.

Dabei werden alle Anweisungen zwischen diesen beiden Befehlen in das PDF übertragen und zusätzlich wird auch das Ausgabefenster angezeigt.

Achtung: Zu beachten ist, dass im Gegensatz zu saveFrame(), schon vor dem ersten Zeichnen mit beginRecord() der Aufzeichnungsprozess gestartet werden muss. Dieser Prozess kann durch ein erneutes Aufrufen von beginRecord() mit den gleichen Parametern neugestartet werden.

Beispiel:

import processing.pdf.*;
 
void setup()
{
  size( 800, 600 );
  smooth();
  background( 120 );
  stroke(200);
  noLoop();
  beginRecord(PDF, "deinName.pdf"); 
 
}
void draw()
{
  drawCircles( 100 );
  endRecord();
}

Werkzeugkoffer aufräumen

Früher oder später beinhaltet ein Processing-Sketch immer mehr Zeilen Code. Um den Überblick zu behalten, empfiehlt sich das Auslagern von Code auf einzelne Dateien. Im Fall unseres Werkzeugskoffers kann man den Koffer in die Bereiche toolbox, export, keyboard und tools gliedern. Der Vorteil liegt auf der Hand. Hat man sich einmal die Funktionen für den Export geschrieben, kann man die Datei später einfach in den neuen Sketch-Ordner kopieren und wieder verwenden. Zusätzlich kann man diese Datei bei der Fehlersuche auch ausschließen und behält einen besseren Überblick.

Tabs

Anordnung im Kreis

Um Elemente im Kreis anzuordnen benötigten wir die Mathe-Funktionen sin() und cos(). Der Sinus-Wert des Winkels beeinflusst die y-Koordinate und der Cosinus-Wert verändert die x-Koordinate. Beide Funktionen liefern Werte zwischen -1.0 und 1.0, das Ergebnis wird dann mit einem Radius von 100 Pixeln multipliziert und zu den Koordinaten des Mittelpunktes (centerX und centerY ) addiert.

Im folgenden Beispiel werden die Objekte gleichmäßig auf einem Kreis verteilt.

void drawObjectsAroundCircle()
{
  // Mittelpunkt
  int centerX = width / 2;
  int centerY = height / 2;
 
  int i = 0;
  // Winkel
  float angle = 0;
  // Anzahl der Objekte
  int objCount = 20;
  // Radius
  int radius = 100;
 
  // Schritte pro Objekt 
  float steps = TWO_PI / objCount;
 
  for( i = 0; i < objCount; i++ )
  {
    float grey = random( 255 );
 
    fill( grey );
 
    // Positionsberechnung
    float x = centerX + cos( angle ) * radius;
    float y = centerY + sin( angle ) * radius;
 
    ellipse( x, y, 10, 10 );
 
    // Winkel verändern
    angle += steps;
  } 
}

Hausaufgabe

Programmiert zwei Beispiele, bei denen ihr Euch mit den Funktionen sin() und cos() aus den letzten Beispielen befasst.

Beim dritten Beispiel habt ihr freie Werkzeug-Wahl, sollt aber lediglich eine Farbe verwenden.

Zu allen Arbeiten sind auch jeweils die Sketch-Dateien abzugeben.

Informationen zum Dateiformat, der Bezeichnung und zum Upload der Dateien sind unter dem Punkt Prüfungsleistung zu finden.

Die Beispiele der Woche können hier herunter geladen werden.