Question

I am new to processing and am creating a sketch where a 600px by 600px canvas is filled with 50px rects of a random color from my orange[] palette. The random formation of blocks need to be located inside of the draw() function in order to operate correctly with some conditionals that I will put in later.

The error that I am getting is ArrayIndexOutOfBoundsException: 12 on this line:

randomSize[varCreator] = sIncrement[int(random(0,sIncrement.length-1))];

I can’t seem to figure out why this error is occurring. I have looked into related questions, and maybe its just because I am so new, but I can’t figure it out:

int x; //x coordinate
int y; //y coordinat
int s = 50; //rect size
int wide = 600; //canvas width
int tall = 600; //canvas height
int[] sIncrement = new int[12];//{s, s*2, s*3, s*4, s*5, s*6};

//colors
int[] oranges = {
  #773600, #5f3613, #552700, #9c5215, #9c5c26
};
int[] blues = {
  #004848, #0c3939, #003333, #107979, #1e7979
};
int[] palette = oranges;//holds current color pallete

//random
int fillColor = palette[int(random(0, palette.length))]; //random starting fill color
int changeColor = palette[int(random(0, palette.length))]; //random new color
int[] randomSize = new int[sIncrement.length]; //array of lots of random s values to place newly color changed blocks


//setup
void setup(){
  size(wide, tall);
  background(255);
  noStroke();
  frameRate(24);

  /*fills sIncrement array with incrementing s values (i.e. if s = 50 then array 
   contains 50, 100, 150, etc...) from 0 to canvas width for use in a conditional statement*/
  for(int i = 0; i <= sIncrement.length-1; i++){
    sIncrement[i] = s*i;
  }

 //creates multiple randomSize variables for if() x or y == randomSize[varCreator] 
 for(int varCreator = 0; varCreator <= (width/s)+(height/s); varCreator++){
   randomSize[varCreator] = sIncrement[int(random(0,sIncrement.length-1))];
 }
}

//draw
void draw(){
  fill(fillColor); //selects random color from palette

  //draws grid colored boxes with s size
  for (y = 0; y <= height; y+= s) {
    for (x = 0; x <= width; x+= s) {
      if(x == sIncrement[randomSize[1]] && y == sIncrement[randomSize[3]]){
        fill(changeColor); //selects random color from palette
        rect(x, y, s, s);
      }

      else{
      fill(fillColor);
     // fill(palette[int(random(0, palette.length))]); //selects random color from palette
      rect(x, y, s, s);
      }
    }
  }
}

Answer 1

You are accessing elements of the array randomSize. How long is this array? Let’s see its declaration:

int[] randomSize = new int[sIncrement.length];

So, it’s the same length as the array sIncrement. If we look a bit earlier:

int[] sIncrement = new int[12];

The length of sIncrement, and therefore the length of randomSize is 12.

In this code:

for(int varCreator = 0; varCreator <= (width/s)+(height/s); varCreator++){
    randomSize[varCreator] = sIncrement[int(random(0,sIncrement.length-1))];
}

The index you use to access the elements in the array randomSize is in the variable varCreator, which goes from 0 to (width/s)+(height/s). Since the length of randomSize is 12, you can only use indexes from 0 to 11 to access elements, or you will have the error you are reporting.

So, if (width/s)+(height/s) should not be 12 or more. How much it is ?

That’s where we are stuck, because nothing in your code tells us where width and height are declared. We only know that s is 50.

But you have these variables, wide and tall, each equals to 600. I’m going to take a wild guess and estimate that somewhere in your code you have width = wide and height = tall.

So (width/s)+(height/s) = (600/50) + (600/50) = 12 + 12 = 24

That’s it. varCreator goes from 0 to 24 (included) and therefore you run out of bounds of the array.