size(200,200);  
background(255); 
float w = ________;  
while (________)  {   
  stroke(0);  
  fill(________);  
  ellipse(_______,_______,_______,_______);  
  __________20;  
}
Example
// Learning Processing
// Daniel Shiffman
// http://www.learningprocessing.com

// Exercise 6-1b

size(200,200); 
background(255); 
smooth();

float w = width; 
while (w > 0) { 
  stroke(0); 
  fill(w); 
  ellipse(width/2,height/2,w,w); 
  w = w - 20; 
} 
  • Guipena

    Could you explain how you defined the different colors using “fill(w)”?

  • Anonymous

    ‘w’ is simply a variable that starts at 200 and decrements by 20 each cycle through the loop (200,180,160,140,etc.).  Since it’s a number it can be used for anything.  And here it is used to (a) define the size of each circle and (b) the fill color.  A greyscale color in Processing has a range between 0 and 255 (0 being black and 255 white).

  • AhAdel

    this loop argument didn’t executed : while (w<=0) {
    why ??

  • AhAdel

    sorry, the loop that didn’t executed : while (w<= 200) {
    why ??

  • Anonymous

    w starts at the value 200 which is not less than 0.  Therefore the boolean returns false and the loop is bypassed.

  • donald clark

    Hi daniel what ive done which is basically just added the draw and setup components. my question is why does float w = width have to be put in the context of the draw() function to work. if for instance i set it up as a traditional variable and put it in before setting up draw the programme doesnt work a intended

    void setup(){
    size(200,200);

    background (255);
    }
    void draw(){

    float w = width;

    while(w >0 ){
    stroke (0);

    fill(w);
    ellipse(width/2,height/2,w,w);

    w = w – 20;
    }

    }

  • shiffman

    There is no width until size() is called so if you want it to be global it would have to be:

    float w;

    void setup() {
    size(200,200);
    w = width;
    }

    The algorithm you’ve written however, still requires w to be reset each time through draw().

  • donald clark

    Thanks Daniel this make sense in the context of the width function.if i made

    float w = 200; a global variable does it still require size() to be called ? i assume it does as we are using it in the context of the width of the ellipse . why doesnt the location x,y require setup to be called though? maybe it does but it doesnt need to be drawn as its a location ?l still doesnt make sense though :)

    still a few fundamentals im obviously failing to understand as far as variables go but thanks for for your illuminating response

  • Donald Clark

    Sorry when I say setup for x and y I mean size()

  • shiffman

    you must alway have setup() and size(). this determined the Processing window size. It’s convenient then to initialize w from the window’s dimensions (“width”) but there’s no reason why you could otherwise just say w = 200; or any value you chooe.

  • Joël

    // I don’t understand why my code doesn’t work. I think it’s just the same except it’s looping from the center to the periphery.

    size(200,200);
    background(255);
    smooth();

    float w = 10;

    while (w < 200) {
    stroke(0);
    fill(w);
    ellipse(100,100,w,w);
    w = w + 20;
    }

  • Joël

    If I draw the biggest circle last it will cover all the previous
    circles? Ok.