213
edits
(sketches from 5.12. added) |
|||
Line 873: | Line 873: | ||
myPort.write(myValue); | myPort.write(myValue); | ||
} | } | ||
</source> | |||
<br /><br /> | |||
=== IX translate() and rotate() (PROCESSING ONLY) === | |||
<source lang="java"> | |||
/* ORBITING RECTS (PROCESSING ONLY) | |||
* | |||
* Example of the translate() and rotate() | |||
* functions. Try to comment out certain lines | |||
* of the code to understand what exactly happens | |||
* during the runtime of the program. | |||
* | |||
* There is also a good tutorial which explains | |||
* 2D transformations: | |||
* http://processing.org/learning/transform2d/ | |||
* | |||
* Frederic Gmeiner, 2011 | |||
*/ | |||
// value used for the increasing rotation | |||
float rotationVal = 0; | |||
void setup(){ | |||
size(500,500); | |||
smooth(); | |||
noStroke(); | |||
// this tells processing to draw rectangles | |||
// from the center instead of the upper left | |||
// corner | |||
rectMode(CENTER); | |||
} | |||
void draw(){ | |||
background(100); | |||
// set the origin to the center of the sketch window | |||
// (so width/2, height/2 is now equal to 0,0 ) | |||
translate(width/2,height/2); | |||
// rotate the whole scene by the amount of | |||
// the increasing rotationVal | |||
rotate(rotationVal); | |||
// change the origin again by 100 pixels to the right. | |||
// we are doing this so that the rectangle won't stick | |||
// to the center of the sketch and rotates there, | |||
// but rather let the rect orbit around the | |||
// center with a distance of 100px. | |||
translate(100,0); | |||
// now draw the black rectangle to the | |||
// origin (0,0) | |||
fill(0); | |||
rect(0,0,30,30); | |||
// to get to the position of the smaller red | |||
// rectangle which is circling faster, we have | |||
// to rotate the scene again with a multiplication | |||
// of the prvious rotation: | |||
rotate(rotationVal*4); | |||
// shift the origin again by 40px to the right: | |||
translate(40,0); | |||
// draw the smaller red rectangle | |||
fill(255,0,0); | |||
rect(0,0,5,5); | |||
// increase the rotation value a bit: | |||
rotationVal += 0.01; | |||
} | |||
</source> | |||
<br /><br /> | |||
=== X String, Char & Typography (PROCESSING ONLY) === | |||
<source lang="java"> | |||
/* RANDOM LETTERS | |||
* | |||
* Example of how to work with font files and | |||
* charecters (char). | |||
* In order to use a font face we have to | |||
* convert it using the Tools>create font... | |||
* menu. This will make the font available | |||
* in the data folder of this sketch. | |||
* Follow this tutorial for detailed | |||
* descriptions: | |||
* http://processing.org/learning/text/ | |||
* | |||
* Frederic Gmeiner, 2011 | |||
*/ | |||
// create a font object | |||
PFont mySerif; | |||
void setup() { | |||
size(400,400); | |||
smooth(); | |||
// load the font file "Baskerville-48.vlw" from | |||
// the data folder | |||
// !!! MAKE SURE THAT YOU HAVE THE FILE IN YOUR | |||
// DATA FOLDER OR THAT YOU CREATED A NEW ONE AND CHANGED | |||
// THE NAME ACCORDINGLY !!! | |||
mySerif = loadFont("Baskerville-48.vlw"); | |||
// set the text align to center | |||
textAlign(CENTER); | |||
background(0); | |||
fill(255,0,0); | |||
// specify the font and the size which should | |||
// be used when calling the text() function | |||
textFont(mySerif, 15); | |||
// write "random letters" to the position 50,15 | |||
text("random letters", 50, 15); | |||
} | |||
void draw() { | |||
//background(0); | |||
fill(200,200,200,50); | |||
// set the font and font size | |||
textFont(mySerif, 32); | |||
// instead of writing a String to the screen we only | |||
// draw a single randomly chosen character to the current | |||
// mouse position. | |||
// the char() function returns a character from the unicode | |||
// table by the index. | |||
text( char(int(random(150))), mouseX, mouseY); | |||
} | |||
</source> | </source> | ||
<br /><br /> | <br /><br /> |
edits