Tag 2 5.Bilder darstellen

Um Bitmap-Bilder darzustellen existiert das PImage-Objekt. Wie etwa Ganzzahlen im Variablentyp int oder Fließkommazahlen im Typ float gespeichert werden, so werden Bilder im Variablentyp PImage gespeichert. Der Programmablauf zur Darstellung eines Bitmap-Bildes ist wie folgt:

  • Deklariere eine Variable des Typs PImage
  • Lade eine Bilddatei in diese Variable
  • Stelle das Bild mit der Funktion image() im Ausgabefenster dar

Beispiel 2-1


PImage img;

void setup(){
   size(800,600);
   img = loadImage(„grimes.jpg“);
}

void draw(){
   background(0);
   image(img, 0, 0);
}

Die Funktion image() erwartet als Parameter das darzustellende Bild (in unserem Beispiel: img), die x- und y-Koordinate der Position, an der das Bild dargestellt werden soll sowie die Breite und Höhe.


image(img, x, y, width, height);

Breite und Höhe sowie die Position sind optional, wird nur das Bild angegeben wird es am Ursprung (linke obere Ecke) in seiner gesamten Breite und Höhe positioniert. Processing kann GIF-, JPG-, TGA- und PNG-Bilddateien mittels PImage darstellen.

1.1 Der data-Ordner

Unsere Bilder sollten im data-Ordner, der sich wiederum in ihrem Sketch-Ordner befindet, liegen. Da der data-Ordner nicht automatisch angelegt wird, sollten man ihn manuell erstellen, wenn man beginnt (und das scheint gerade der Fall zu sein), externe Dateien in seinen Programmen zu verwenden. Auch Fonts oder CSV-Daten werden später in den data-Ordner gelegt um sie in Processing zu laden und zu verwenden.

1.2 Image processing Filter

Mit dem Befehl tint() lässt sich die Farbigkeit eines Bildes einstellen/filtern:


tint(255,0,0); 		// Setzt die Farbigkeit auf Rot.


tint(0,255,0,128);		// Setzt die Farbigkeit auf Blau mit einer Deckkraft von 50 Prozent.

Beispiel 2-2


PImage img;
float colorNoise;
float counter = 0;

void setup(){
   size(1000,1000);
   img = loadImage(„grimes.jpg“); 
}

void draw(){
   background(255); 
   counter += 0.1;
   colorNoise = noise(counter)*255;
   tint(200,colorNoise,155);
   image(img, 0, 0, width/2, height/2);
   tint(colorNoise,200,200);
   image(img, width/2, 0, width/2, height/2);
   tint(200,200,colorNoise);
   image(img, 0, height/2, width/2, height/2);
   tint(colorNoise);
   image(img, width/2, height/2, width/2, height/2);
}