1. For Net Art Lecture 2 J Parker
Programming
For Net Art
Lecture 2
J Parker

2. We looked at Static Processing
size (300, 300); strokeWeight (7); line (100, 90, 140, 85); line (175, 82, 225, 80); strokeWeight (4); ellipse (130, 120, 60, 50); ellipse (200, 118, 60, 50);
fill (0);
ellipse (148,126, 14,18);
ellipse (218,123, 14,18);
// Mouth
line (122, 165, 118, 175);
line (120,170, 170, 180);
line (170, 180, 210, 160);
line (210,155, 213, 165);

3. A Flower
int positionx = 200; int positiony = 200; int ground = 350; int i=0; noStroke(); size (500, 500); stroke (0,190,20); line (positionx, positiony, positionx-20, ground);
fill (200,200,23);
ellipse (positionx, positiony-25, 30,30);
ellipse (positionx+18, positiony-5, 30,30);
ellipse (positionx+12, positiony+20, 30,30);
ellipse (positionx-13, positiony+20, 30, 30);
ellipse (positionx-18, positiony-7, 30,30);
fill(0,0,0);
ellipse (positionx, positiony, 30,30);
positionx = positionx + i*12;
positiony = positiony - i*3;

4. Flowers come in Groups
We need to draw more than one. Repeat the process for different locations. We need a LOOP, such as we used in the Turtle graphics programs

5. WHILE { statements } Syntax is: while ( expression )
As long as (while) the expression is true, keep repeating the statements within the { … } over and over.

6. Expressions
while ( i < 10) As long as the value of i is smaller than 10 while (x >= 0) As long as the value of x is more than 0 while (x < i) while (i*2 < 100)

7. Forever
If a loop never ends then it is called an ‘infinite loop’, and this is a bad thing. SO: some statement inside of the loop must have the possibility of changing the expression (which is evaluated once everytime the loop executes) so that the expression COULD be false.

8. WHILE i = 3; i = 0; X = 0.5; while (i < 10) while (x < i) { {
x = x + 0.5 }
i = 0;
while (i < 10) {
i = i + 1;
. . . }

9. Back to Flowers i = 0; while (i< 20) {
draw a flower
positionx = positionx + i*12;
positiony = positiony - i*3;
i = i + 1; } ‘
i = 0; while (i < 20) { draw a flower Change position }

10. Flowers while (i<20) { stroke (0,190,20);
line (positionx, positiony, positionx-20, ground);
noStroke();
fill (200,200,23);
ellipse (positionx, positiony-25, 30,30);
ellipse (positionx+18, positiony-5, 30,30);
ellipse (positionx+12, positiony+20, 30,30);
ellipse (positionx-13, positiony+20, 30, 30);
ellipse (positionx-18, positiony-7, 30,30);
fill(0,0,0); ellipse (positionx, positiony, 30,30); positionx = positionx + i*12; positiony = positiony - i*3; i = i + 1; }

11. Circles
Draw a set of 10 circles across the window

12. Example
int x=20,y=50, i; size (400,200); i = 1; // Start with circle 1 while (i<=10) // Loop 20 times { ellipse (x, y, 20, 20); // Draw a circle x = x + 30; // Increase X so next circle will be to the right i = i+ 1; }

13. Circles

14. Nested Loops
int x=20,y=50, i,j; size (400,400); i = 1; j = 1; // Start with circle 1 while (j <=10) { i = 0; x = 20; while (i<=10) // Loop 20 times ellipse (x, y, 20, 20); // Draw a circle x = x + 30; // Increase X so next circle will be to the right i = i + 1; } y = y + 30; j = j + 1;

15. Arrays
Basically, many variables with the same name accessed by number: int a[] = new int[20]; Is a collection of 20 integers. x[0] = 1; x[1] = 2; x[2] = x[1] + x[0];

16. Why?
Now we can keep track of many individual objects, like circles. Int x[] = new int[20]; Int y[] = new int[20]; … while (i<20) { ellipse (x[i], y[i], 10, 10); }

17. Images
Pimage is a type for an image. PImage x, y; Can read them from files. x = loadImage (“image.jpg”); And display them: image (x, 0, 0);

18. PImage im; // The image to be loaded String name = "image
PImage im; // The image to be loaded String name = "image.jpg"; // Name of the image file void setup () { size (400,400); surface.setResizable(true); im = loadImage (name); // Load the image if (im == null) // Did the file exist? { // No. println ("File 'image.jpg' is missing."); exit(); } else surface.setSize (im.width, im.height); // Yes - set window size. } void draw() { image (im, 0, 0); // Display the image }

19. Mouse
void setup () { size (400,400); background(200, 30, 200); } void draw () // background(200, 30, 200); ellipse (mouseX, mouseY, 30, 30);

20. Now let’s play.