Why does this not work? (8 Squares)

Hi! I'm an absolute beginner programmer, and my exercise is to make 8 squares, that scales with the window and with numbers from 1 to 8 inside them (which is pretty much already done).

What I cannot get to work is to make the rectangles change color to red when you click on one of them, and when you clock on another of the 8 rectangle the rectangle you clock on changes color to red and the the rectangle you previously clicked on goes white again

Here is my code so far:

int pressedButton;
float spaceWidth;
float boxSize;

void setup() {
  size(900, 300);
  boxSize = width/10;
  spaceWidth = width/(5*9);
  background(0);
  pressedButton = 0;
}

void draw() {
  noStroke();
  for (int i = 0; i < 8; i++) {
    fill(255);
    rect(spaceWidth+i*(boxSize+spaceWidth), 70, boxSize, boxSize);
    fill(0);
    text(i+1, spaceWidth+i*(boxSize+spaceWidth), 81);
    fill(255);
  }
}

void mousePressed() {
  for (int i=0; i<8; i++) {
    if (mouseX > spaceWidth+i*(boxSize+spaceWidth) && mouseX < spaceWidth+i*(boxSize+spaceWidth)+width) {
      fill (255, 0, 0);
    }
    if (mouseY > height && mouseY < height) {
      fill (255, 0, 0);
    }
  }
}

Answers

  • use pressedButton

    set it in mousePressed()

    read it in draw() with if :

    if(i==pressedButton)
         fill(255,0,0);
       else   
        fill(255);
    
  • What do you mean about "read it in draw() with if :"??

  • just as I wrote:

    in the sense that you use the value of pressedButton (as opposed to set the value of it)

    if(i==pressedButton)
         fill(255,0,0);
       else  
        fill(255);
    
  • But how does the program know if it's inside the box without the

    if (mouseX > spaceWidth+i*(boxSize+spaceWidth) && mouseX < spaceWidth+i*(boxSize+spaceWidth)+width)
    
  • the point is, it won't work when you set the color only in mousePressed, because that is only active as long as the mouse is pressed (very short)

    so store the result in pressedButton and then use pressedButton

  • edited October 2016

    you wrote :

    But how does the program know if it's inside the box without the


    if (mouseX > spaceWidth+i(boxSize+spaceWidth) && mouseX < spaceWidth+i(boxSize+spaceWidth)+width)

    you are right,

    set pressedButton in mousePressed()

    depending on

    if (mouseX > spaceWidth+i*(boxSize+spaceWidth) && 
        mouseX < spaceWidth+i*(boxSize+spaceWidth)+width)
    
  • It doesn't give any errors, but the it still doesn't work

    int pressedButton;
    float spaceWidth;
    float boxSize;
    
    void setup() {
      size(900, 300);
      boxSize = width/10;
      spaceWidth = width/(5*9);
      background(0);
      pressedButton = 0;
    }
    
    void draw() {
      noStroke();
      for (int i = 0; i < 8; i++) {
        fill(255);
        rect(spaceWidth+i*(boxSize+spaceWidth), 70, boxSize, boxSize);
        fill(0);
        text(i+1, spaceWidth+i*(boxSize+spaceWidth), 81);
        fill(255);
      }
    }
    
    void mousePressed() {
      for (int i=0; i<8; i++) {
        if (mouseX > spaceWidth+i*(boxSize+spaceWidth) && mouseX < spaceWidth+i*(boxSize+spaceWidth)+width && mouseY > height && mouseY < height) {
          pressedButton = 1;
        } else {
          fill(255);
        }
        if (i == pressedButton) {
          fill(255,0,0);
        } else {
          fill(255);
        }
      }
    }
    
  • you forgot the "read it in draw() with if" part - see above

    also, the idea is to store the number of the cell that is active in pressedButton

    pressedButton = 1;

  • setup() runs only once, draw() runs on and on, 60 times per second, mousepressed runs only once when the mouse is pressed

    Hence the idea is to store what happens in mousepressed and use that data in draw(). In our case, let pressedButton store the number of the pressed cell / button and act on it.

    OK?

    Chrisir

  • setup() runs only once, draw() runs on and on, 60 times per second, mousepressed runs only once when the mouse is pressed

    But they're all voids

  • edited October 2016

    well, they are all functions (void is just their return type, which is empty / void in this case)

    but they are different kinds of functions. As I described.

    does it work now?

Sign In or Register to comment.