Cover
 This is the archive Discourse for the Processing (ALPHA) software. Please visit the new Processing forum for current information.
 Processing 1.0 _ALPHA_    Teaching    Theory and Practice (Moderators: REAS, arielm)    Quick Bits : STATIC FORM - EXTRA « Previous topic | No topic »

 Pages: 1
 Author Topic: Quick Bits : STATIC FORM - EXTRA  (Read 2603 times)
arielm

 Quick Bits : STATIC FORM - EXTRA « on: Mar 2nd, 2004, 11:48pm »

SFX_001

Code:
 // 2D TRANSFORMATIONS/TRANSLATING   // translate(dx, dy) is moving the origin of the coordinate system // dx is the amount of translation on the horizontal axis // dy is the amount of translation on the vertical axis   noStroke();   rect(0, 0, 20, 20); // white rectangle   translate(50, 25);  // moving the "origin" of the coordinate system 50 points right, 25 points down fill(255, 0, 0);    // red rect(0, 0, 20, 20); // the top-left corner of the rectangle is now at 50, 25   translate(-10, 10); // moving the "origin" of the coordinate system 10 points left, 25 points down fill(102, 204, 51); // blue rect(0, 0, 20, 20); // the top-left corner of the rectangle is now at 50-10 = 40, 25+10 = 35   // the effect of translate is "additive", // i.e: at each translate(), the origin of the coordinate system is moved relatively to its previous position

Ariel Malka | www.chronotext.org
arielm

 Re: Quick Bits : STATIC FORM - EXTRA « Reply #1 on: Mar 2nd, 2004, 11:49pm »

SFX_002

Code:
 // 2D TRANSFORMATIONS/MATRIX STACK   // push() is saving the current coordinate system to the top of the "matrix stack" // pop() is loading a (previously saved) coordinate system from the top of the "matrix stack"   // the origin of the coordinate system is at 0,0 rect(5, 5, 30, 30); // big rectangle   push(); // saving the current coordinate system   translate(50, 50);  // the origin is now at 50, 50 rect(0, 0, 20, 20); // medium rectangle   pop(); // restoring the previous coordinate system (the origin is now back to 0, 0)   rect(0, 0, 10, 10); // small rectangle     // note: full understanding of the push/pop concepts will come with time and work :-)

Ariel Malka | www.chronotext.org
arielm

 Re: Quick Bits : STATIC FORM - EXTRA « Reply #2 on: Mar 2nd, 2004, 11:51pm »

SFX_003

Code:
 // 2D TRANSFORMATIONS/ROTATING   rectMode(CENTER_DIAMETER);  // setting the "rotation axis" of rectangles to their center   translate(50, 50); // moving to the middle of the screen rotate(PI / 6);    // rotating the coordinate system by a certain amount // all the drawings that come after these 2 operation are "transformed" // (suggestion: remove them and look at the drawing!)   rect(0, 0, 40, 40);   // big rectangle rect(30, 10, 20, 20); // small rectangle   // the rotate() function is receiving an angle parameter in "radians" (and not in "degrees") // PI is equivalent to half of a circle, or 180 degrees // so in our example: PI/6 is equal to 30 degrees   // an helpful function: radians(), is receiving a value in degree and returns a value in radians // so our example could have been written as: // rotate(radians(60))

Ariel Malka | www.chronotext.org
arielm

 Re: Quick Bits : STATIC FORM - EXTRA « Reply #3 on: Mar 2nd, 2004, 11:53pm »

SFX_004

Code:
 // 2D TRANSFORMATIONS/SCALING   // a simple pattern rect(0, 0, 15, 15); rect(15, 0, 10, 25);   push(); translate(40, 40); scale(2);   // the same pattern, twice bigger rect(0, 0, 15, 15); rect(15, 0, 10, 25); pop();   translate(40, 20); scale(0.5);   // the same pattern, twice smaller rect(0, 0, 15, 15); rect(15, 0, 10, 25);

Ariel Malka | www.chronotext.org
arielm

 Re: Quick Bits : STATIC FORM - EXTRA « Reply #4 on: Mar 2nd, 2004, 11:54pm »

SFX_005

Code:
 // 2D TRANSFORMATIONS/COMBINATIONS   // when combining translate(), rotate() and scale(), // the order of appearance of the transformation is very important: // each transformation is affecting the drawing that come after as well as the transformations that come after!   rectMode(CENTER_DIAMETER);   translate(50, 50); rect(0, 0, 40, 40); // white rectangle   rotate(PI / 4); // 180 / 4 = 45 degrees scale(0.5); fill(255, 0, 0); // red rect(0, 0, 40, 40);   translate(100, 0); fill(0, 0, 255); // blue rect(0, 0, 40, 40);   // note how the relation between the red rectangle and the blue rectangle: // they are only separated by a translate(100, 0) (which means: move 100 points right), // but this transformation is afected by a 45 degrees rotation an a 50% down-scale

Ariel Malka | www.chronotext.org
 Pages: 1

 Forum Jump: ----------------------------- Discussion -----------------------------  - Community, Collaboration, Status   - Events, Publications, Propaganda   - General Processing Discussion ----------------------------- Programming Questions & Help -----------------------------  - Syntax   - Programs   - Integration ----------------------------- Topics & Contributions -----------------------------  - Tools   - Responsive Form, Games   - Information Visualization   - Simulation, Artificial Life   - Tangible Computing   - Automated Systems   - Sound   - Video, Camera   - Beyond Categories ----------------------------- Suggestions -----------------------------  - Software Suggestions   - Website, Reference, Example Suggestions ----------------------------- Bugs -----------------------------  - Software Bugs   - Website, Reference, Example Bugs   - Bug Fixes, Implemented Suggestions ----------------------------- Teaching -----------------------------  - Course Blueprints => Theory and Practice « Previous topic | No topic »