Fill not working?

DDJDDJ
edited November 2015 in Questions about Code

Hi,

Relatively new to Processing, but making some progress. I have noticed something odd though with the code below. It draws a red square fine, then fills it will black, but does not re-fill it as red when the draw() routine loops back to the top.

Can anyone tell me why this is happening?

Many thanks.

void setup() { size(1000, 500); colorMode(RGB); } void draw() { fill(255, 0, 0); rect(100, 100, 100, 100); delay(1000); fill(0, 0, 0); rect(100, 100, 100, 100); }

Answers

  • edited November 2015

    Use background(); for a background at the beginning. The black is being drawn over the red and there is nothing making it so it will go away so the red can be drawn under it. | = black \ = red

      At seconds <= 999
         \             \
          \              \
           \              \
             __________\
       at seconds >= 1000 that don't have a background
       |------ |
       |            |
       |            |
       |            |
       |_______ |
    
       at seconds <= 999 that don't have a background
       |------ |
       |            |
       |            |
       |            |
       |_______ |
    

    You can see, the background covers up what is not being drawn anymore :)

    void setup() { size(1000, 500); colorMode(RGB); } void draw() { background(255); fill(255, 0, 0); rect(100, 100, 100, 100); delay(1000); fill(0, 0, 0); rect(100, 100, 100, 100); }

  • The draw() method is called ~60 times a second and the display is updated AFTER the draw method has finished.

    So the red rectangle is NEVER seen because it is overwritten by the black rectangle and the delay() method does nothing. Move the black rectangle so it doesn't cover the red one and you will see that both rectangles appear at the same time.

    I suggest you read about setup and draw

  • @Quark - I see the red rectangle first, then the black. But it does not show the red rectangle again. I'm just wondering why? In fact, when I change the code slightly to that shown below I see the red and the black, but NOT the blue and the green.

    void setup() { size(1000, 500); colorMode(RGB); } void draw() { fill(255, 0, 0); rect(100, 100, 100, 100); delay(1000); fill(0, 255, 0); rect(100, 100, 100, 100); delay(1000); fill(0, 0, 255); rect(100, 100, 100, 100); delay(1000); fill(0, 0, 0); rect(100, 100, 100, 100); delay(1000); }

  • I see the red rectangle first, then the black.

    That is amazing, unless you have a version of Processing that no one else does then that is impossible because the display is ONLY updated at the end of draw.

    If you try this code you will see that the display is only updated once every 4 seconds because of the four 1 second delays.

    void setup() {
      size(1000, 500);
      colorMode(RGB);
    }
    void draw() {
      fill(255, 0, 0);
      rect(100, 100, 100, 100);
      delay(1000);
      fill(0, 255, 0);
      rect(100, 100, 100, 100);
      delay(1000);
      fill(0, 0, 255);
      rect(100, 100, 100, 100);
      delay(1000);
      fill(0, 0, 0);
      rect(100, 100, 100, 100);
      delay(1000);
    
      fill(255);
      rect(0,0,width, 20);
      fill(0);
      text(""+frameCount, 20,16);
    }  // NOW display the result on the screen
    
  • OK, so this is interesting. I'm running Processing 3.0.1 and when I run your code I see the red rectangle first, then I see the text with the black rectangle. I have attached screen shots:

    Red square initially... red

    ...then the black one with the counter... black

    ...thereafter it is only the black one displayed as you can see by the rising count... black2

  • Answer ✓

    I don't know why you can see the red square it shouldn't be possible with this code. I am using Processing 3.0.1 (Java mode) on OSX and when I run it I get the grey background for 4 seconds then the black square appears, and that is what should happen.

  • Maybe it's an OS thing - I'm on windows. Anyway, thanks for your help, I will restructure my real code to take account of the information you have shared.

Sign In or Register to comment.