Processing 2. Креативное программирование
.pdf
, 2D
int x2 = floor( random( width ) ); int y2 = floor( random( height ) );
if ( pixelMode |
== true ) { |
||||
color |
c1 |
= img.get( |
x1, y1 ); |
||
color |
c2 |
= img.get( |
x2, y2 ); |
||
img.set( |
x1, |
y1, |
c2 |
); |
|
img.set( |
x2, |
y2, |
c1 |
); |
|
}else {
PImage crop1 = img.get( x1, y1, copyWidth, copyHeight ); PImage crop2 = img.get( x2, y2, copyWidth, copyHeight ); img.set( x1, y1, crop2 );
img.set( x2, y2, crop1 );
}
image( img, 0, 0 );
}
, , , , .
40
2
, Processingdata .Sketch | Show Sketch Folder.
, Processing, PImage. loadImage() setup() data PImage.
get() set() PImage. - . get() .
,
PImage. x/y ,. set() get, .
pixelMode. copyWidth copyHeight -/ .
, 1,Processing 2. .
- InDesign, ,, . Processing . , , , - .
. Ostrich Sans Junction The League of Moveable Type. http://www. theleagueofmoveabletype.com..
41
, 2D
, Processing, -.vlw, Processing.Create Font. ,OK. .vlw data .
PFont .setup() .vlw PFontloadFont():
PFont ostrichSans;
PFont junction;
void setup()
{
size( 640, 480 );
42
2
smooth();
ostrichSans = loadFont("OstrichSans-Bold-48.vlw"); junction = loadFont("Junction-24.vlw");
strokeCap( SQUARE );
}
, - .draw():
Void draw()
{
background( 255 ); fill( 128, 0, 0 );
textFont( ostrichSans, 48 ); textAlign( LEFT );
text( "Hello, I'm Ostrich Sans", 20, 50 );
textFont( junction, 24 );
text("I'm a line of text, set in Junction.", 20, 80);
stroke( 128, 0, 0 ); strokeWeight( 1 ); line( 20, 94, 620, 94 ); line( 20, 96, 620, 96 );
}
Processing textFont(). Junction. draw().
fill( 0 );
textFont( junction, 24 );
text( "The quick brown fox jumps over the lazy dog. (24)", 20, 130 ); textFont( junction, 18 );
text( "Pack my box with five dozen liquor jugs. (18)", 20, 154 ); textFont( junction, 12 );
text( "Blowzy red vixens fight for a quick jump. (12)", 20, 172 );
stroke( 128 ); strokeWeight( 3 );
line( 20, 186, 620, 186 );
43
, 2D
., .draw().
fill( 245 ); stroke( 128 ); strokeWeight( 1 );
rect( 20, 192, 600, 110 );
stroke( 128 );
line( width/2, 192, width/2, 298 );
fill( 128 ); stroke( 128 );
triangle( width/2-4, 192, width/2+4, 192, width/2, 196 ); triangle( width/2-4, 302, width/2+4, 302, width/2, 298 );
fill( 0 );
textFont( junction, 24 ); textAlign( LEFT );
text( "since I left you", width/2, 225 ); textAlign( CENTER );
text( "symmetry is boring", width/2, 252 ); textAlign( RIGHT );
text( "flush to the right", width/2, 280 );
Processing ..draw().
textFont( junction, 14 ); textAlign( LEFT );
String multiline = "In typography, leading refers\n"; multiline += "to the distance between the\n"; multiline += "baselines of successive lines\n"; multiline += "of type.";
float standardLeading = ( textAscent() + textDescent() ) * 1.275f;
textLeading( standardLeading ); text( multiline, 20, 340 );
textLeading( standardLeading * 0.75 ); text( multiline, 220, 340 ); textLeading( standardLeading * 1.5 ); text( multiline, 420, 340 );
44
2
, draw(),textWidth()..
textFont( ostrichSans, 36 ); String s = "textWidth"; float w = textWidth( s ); fill( 128, 0, 0 );
text( s, 20, 450 ); noStroke();
rect( 20, 455, w, 8 );
, , :
45
, 2D
, Processing., :
ftext() . -String, char.- , .
floadFont() dataPFont.
Create Font.
ftextFont() text(), .
ftextAlign() , text(). LEFT, RIGHT CENTER.,.
ftextWidth() .
ftextLeading() . ,.
ftextAscent() - .
ftextDescent() - .
, , .-.Adobe Illustrator Inkscape,, .
, - OpenGL.3D. , 3D,, bezierDetail() curveDetail() -2D-. OpenGL Sketch | Import Library…| OpenGL. , :
import processing.opengl.*;
void setup()
{
46
2
size( 640, 480, OPENGL ); smooth();
}
draw(). bezierDetail() -.
Void draw()
{
background( 255 );
noFill();
for ( int i = 0; i < 15; i++ ) { pushMatrix();
translate( (i * 40) + 20, 0 ); bezierDetail( i + 4 );
stroke( 0 );
bezier( 0, 20, 50, 10, 80, 100, 30, 200 ); stroke( 255, 0, 0, 128 );
line( 0, 20, 50, 10 ); line( 80, 100, 30, 200 ); popMatrix();
}
}
- curve().x .draw().
float t = map( mouseX, 0, width, -5.0, 5.0 ); curveTightness( t );
for ( int i = 0; i < 15; i++ ) { pushMatrix();
translate( (i * 40) + 20, 220 ); curveDetail( i + 4 );
stroke( 0 );
curve( 10, 50, 0, 20, 30, 200, -50, 250 ); stroke( 255, 0, 0, 128 );
line( 10, 50, 0, 20 ); line( 30, 200, -50, 250 ); popMatrix();
}
47
, 2D
, :
. , :
fbezier() . -. -. -, - .
fbezierDetail() .20.
fcurve() . - Processing. bezier(), - , .
48
2
fcurveDetail() . bezierDetail().
fcurveTightness() . ,0.0. 1.0. -5.0 5.0 ,..
- . bezierPoint() curvePoint().
. noise(). , curve(),.
float noiseOffset;
void setup()
{
size( 640, 480 ); smooth();
noiseOffset = 0.0;
rectMode( CENTER );
}
void draw() { noiseOffset += 0.01;
background( 255 );
// Bézier curve stroke( 0 ); noFill();
bezier( 40, 200, 120, 40, 300, 240, 600, 40 );
stroke( 255, 0, 0 );
49