26 Jan 2011, 11:30pm
Programmierung
unkommentiert
Amazon.de-Suche

Processing: Bewegte Punkte

Ich beginne klein und erzeuge drei Punkte auf einer 101*101 Pixel großen Fläche; einen auf dem Nullpunkt, einen in der Bildmitte und einen unten rechts:

size(101,101); //width,height|breite,hoehe
point(0,0); // Punkt(xWert,yWert)
point((width/2),(height/2));
point(width-1,height-1);

Aufgepasst: Eine Breite von 101px bedeutet, dass der erste Pixel der Null-te ist und der letzte durch die natürliche Zahl 100 ‘angesteuert’ wird! Du musst also, siehe oben, beim Markieren des rechtsunten-sten vom Breitenwert einen Pixel abziehen, sonst verschwindet der point aus dem Bild.

|| 1 | 2 | 3 | 4 | ... | 101 || (Anzahl)
|| 0 | 1 | 2 | 3 | ... | 100 || (Zaehler)

Außerdem gibt es bei einer geraden Anzahl von Pixeln keine echte Mitte. 101px bedeutet, einer ist der point und jeweils 50 auf jeder Seite bleiben leer.

Der nächste Quellcode erzeugt die gleichen drei Punkte, ist aber die Vorstufe zur Bilderfolge und deshalb sperriger:

int n=0; //zaehlvariable
size(101,101); //width,height
point(n,n);
point((width/2)+n,(height/2)+n);
point(width-1,height-1);

Die int-Variable n ist zu Beginn (und in diesem Fall unvariabel) mit Null definiert, ihre Addition verändert die mittlere point-Position nicht.

Nun variiere ich die Idee heftigst und bringe gleichzeitig Bewegung hinein; ./processing wird mittels des folgenden Quellcodes vier Punkte generieren, die sich auf die Bildecken zubewegen.

int n=0; // zaehlvariable festlegen und auf Null setzen
void setup(){ // alles relevante vor beginn der endlosschleife
size(101,101); // bildgroesse
background(210); // hintergrundfarbe
frameRate(16); // Dauer (in 1/x-Sekunden) bis zum naechsten Durchlauf
}
void draw(){ // endlosschleife
background(210); // bild wird mit grauwert gefuellt
point((width/2)+n,(height/2)+n); // unten rechts
point((width/2)-n,(height/2)+n); // unten links
point((width/2)-n,(height/2)-n); // oben links
point((width/2)+n,(height/2)-n); // oben rechts
saveFrame("point-###.png"); // 3stellig durchnummerierte Einzelbilder erzeugen
n++; //hochzaehlen (entspricht n=n+1)
if(n>((width/2)-1)){n=0;} // n auf Null zurücksetzen, wenn Wert 'anstoesst'
}

Wenn ich innerhalb void draw() den Befehl background(210) weglasse, bleiben alle bereits gesetzten Punkte sichtbar, und dies erzeugt Strahlen, die auch beim nächsten Durchlauf nicht verschwinden. So hingegen überlagert/löscht der background die alten Punkte, nur um gleich darauf mit vier frischen verziert zu werden. Falls man im void setup() die Strichstärke strokeWeight(5) festlegt, sind sie besser erkennbar.

Processing: Mittelstrahlen Processing: Mittelpunkte Processing: Mittelpunkte mit 5px Strichstaerke

[weiterführender Link: http://processing.org/reference/alpha.html]

*name

*e-mail

web site

Hinterlasse einen Kommentar (,der vor Erscheinen moderiert wird.)