Checkerboard Problems

I'm trying to create a checkerboard (320x320, 8 rows/columns) that uses loops to fill in the colors (black and red). My current issue is it's duplicating at the top (and I'm not really sure why it's running at all).

Full disclosure, my current code is based on several helpful forum answers:

` int squareSize = 40; // Dimensions ask for 40x40 int cols, rows;

  void setup() {
  size(320, 320); // Specified by assignment

  // Initialize columns and rows
  cols = 8; // Specified by assignment | size/squareSize
  rows = 8; // Specified by assignment | size/squareSize
  }

  void draw() {

  // Begin loop for columns
  for (int i = 0; i < cols; i++) {
  // Begin loop for rows
  for (int j = 0; j < rows; j++) {

  // Scaling up to draw a rectangle at (x,y)
  int x = i*squareSize; // width
  int y = j*squareSize; // height

  // For every column and row, a rectangle is drawn at an (x,y) location scaled and sized by videoScale.
  rect(x,y,squareSize,squareSize);

  // Begin fill controls
  if ((i+j) % 2 == 0) { // Even is red
    fill(250, 0, 0);
  }

  else { // Odd is black
    fill(0); } 
  }
 }
 }

`

My results are: . Firstly, I'm not even sure why this code works past the first two rows: ((i + j) % 2) should always == 0 given rows and cols are set up to always create an even result, which means I should be getting all red squares, I think.

If someone could explain a) why I'm getting these results and/or b) what I should look into fixing (is it my for loops? do I need more if statements?) to make it generate a proper checkerboard pattern, I'd appreciate it very much.

Answers

  • Answer ✓
    int squareSize = 40; // Dimensions ask for 40x40 
    int cols, rows;
    
    
    
    void setup() {
      size(320, 320); // Specified by assignment
    
      // Initialize columns and rows
      cols = 8; // Specified by assignment | size/squareSize
      rows = 8; // Specified by assignment | size/squareSize
    }
    
    void draw() {
    
      // Begin loop for columns
      for (int i = 0; i < cols; i++) {
        // Begin loop for rows
        for (int j = 0; j < rows; j++) {
    
          // Scaling up to draw a rectangle at (x,y)
          int x = i*squareSize; // width
          int y = j*squareSize; // height
    
          // Begin fill controls
          if ((i+j) % 2 == 0) { // Even is red
            fill(250, 0, 0);
          } else { // Odd is black
            fill(0);
          }
    
          // For every column and row, a rectangle is drawn at an (x,y) location scaled and sized by videoScale.
          rect(x, y, squareSize, squareSize);
        }
      }
    }
    
  • You issue fill() after rect()! :-\" A similar online example: :D
    http://studio.ProcessingTogether.com/sp/pad/export/ro.98-pSvW97Q-RE

  • edited September 2015 Answer ✓

    your bug:

    • obviously you need to set any fill before the rect to apply

    This:

     if ((i+j) % 2 == 0) { // Even is red
    

    hm, let's say you are in the 0th row, 0th col : 0+0 is 0 is even

    you are in the 1st row, 0th col : 0+1 is 1 is odd

    you are in the 2nd row, 0th col : 0+2 is 1 is even

    so it alternates always

    test sketch:

    int squareSize = 40; // Dimensions ask for 40x40 
    int cols, rows;
    
    
    
    void setup() {
      size(320, 320); // Specified by assignment
    
      // Initialize columns and rows
      cols = 8; // Specified by assignment | size/squareSize
      rows = 8; // Specified by assignment | size/squareSize
    }
    
    void draw() {
    
      // Begin loop for columns
      for (int i = 0; i < cols; i++) {
        // Begin loop for rows
        for (int j = 0; j < rows; j++) {
    
          // Scaling up to draw a rectangle at (x,y)
          int x = i*squareSize; // width
          int y = j*squareSize; // height
    
          // Begin fill controls
          if ((i+j) % 2 == 0) { // Even is red
            fill(250, 0, 0);
          } else { // Odd is black
            fill(0);
          }
    
          // For every column and row, a rectangle is drawn at an (x,y) location scaled and sized by videoScale.
          rect(x, y, squareSize, squareSize);
          fill(255); 
          int a = i+j; 
          text(i+","+j+"="+a, x+1, y+16);
        }
      }
    }
    
  • Answer ✓

    As an artist must dip his paint brush in red paint before painting some red, so must you also set your fill color before you draw shapes in that color...

  • You are all wonderful. :) Thank you so much!

Sign In or Register to comment.