Simple filling issue

Processing Coding Questions
1

Hi. I have tried to write a really simple board game, but the simplest code just refused to work.
Here is the full code

int cell = 30;

int W = 1;
int B = -W;
int E = 0;

int selectorX = -1;
int selectorY = -1;

int [][]board = 
{{E,W,E,W,E,W,W,W,W,W,W,W,W,E,W,E,W,E},
 {W,W,W,E,W,E,W,W,W,W,E,W,E,W,E,W,W,W},
 {E,W,E,W,E,W,W,W,W,W,W,W,W,E,W,E,W,E},
 {E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E},
 {E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E},
 {E,W,E,E,W,E,E,W,E,E,W,E,E,W,E,E,W,E},
 {E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E},
 {E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E},
 {E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E},
 {E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E},
 {E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E},
 {E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E},
 {E,B,E,B,E,E,B,E,E,B,E,E,E,B,E,E,B,E},
 {E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E},
 {E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E,E},
 {E,B,E,B,E,B,B,B,B,B,B,B,B,E,B,E,B,E},
 {B,B,B,E,B,E,B,B,B,B,E,B,E,B,E,B,B,B},
 {E,B,E,B,E,B,B,B,B,B,B,B,B,E,B,E,B,E},};

void setup()
{
  size(540, 540);
  ellipseMode(CORNERS);
  noSmooth();
  noLoop();
}

void draw()
{
   background(0);
   
   for(int x=0; x<18; x++)
   {
     for(int y=0; y<18; y++)
     {
       stroke(255);
       
       if((x == selectorX || x == selectorX+1 || x == selectorX-1) && 
          (y == selectorY || y == selectorY+1 || y == selectorY-1))
       {
           fill(0, 255, 0);
           println(x, y);
       }
       
       
       else noFill();
       
       rect(x*cell, y*cell, (x+1)*cell, (y+1)*cell);
       noFill();
       
       
       if(board[y][x] == W)
       {
         fill(255, 0, 0);
         noStroke();
         ellipse(x*cell, y*cell, (x+1)*cell, (y+1)*cell);
       }
       
       if(board[y][x] == B)
       {
         fill(0, 0, 255);
         noStroke();
         ellipse(x*cell, y*cell, (x+1)*cell, (y+1)*cell);
       }
     }
   }
   
   println();
}

void mouseMoved()
{
  int x = int(mouseX/cell);
  int y = int(mouseY/cell);
  if(x != selectorX || y != selectorY)
  {
    selectorX = x;
    selectorY = y;
    
    redraw();
  }
}

The idea is the following: 3x3 square with 1x1 point at the cursor should be selected (painted green).
While the program prints out right coordinate for green squares, it draws some additional ones.
What am I doing wrong?

1 Like
2

:pineapple::pineapple:

You are trying to draw your rect()s as if you were using rectMode(CORNERS), but the default is rectMode(CORNER).

Add this line to setup():

rectMode(CORNERS);
1 Like
3

For reference, if you are unfamiliar with rectMode:

Modifies the location from which rectangles are drawn by changing the way in which parameters given to rect() are intepreted.

The default mode is rectMode(CORNER) , which interprets the first two parameters of rect() as the upper-left corner of the shape, while the third and fourth parameters are its width and height.

rectMode(CORNERS) interprets the first two parameters of rect() as the location of one corner, and the third and fourth parameters as the location of the opposite corner.