# Random boxes and circles using array(s)

**URL:** <https://discourse.processing.org/t/random-boxes-and-circles-using-array-s/2939>\
**Category:** Coding Questions\
**Created:** [August 25, 2018, 10:25am UTC](https://discourse.processing.org/t/random-boxes-and-circles-using-array-s/2939 "2018-08-25T10:25:26Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![suptoabha](https://avatars.discourse-cdn.com/v4/letter/s/a587f6/32.png) [@suptoabha](https://discourse.processing.org/u/suptoabha)\
**Post date:** [August 25, 2018, 10:25am UTC](https://discourse.processing.org/t/random-boxes-and-circles-using-array-s/2939/1 "2018-08-25T10:25:26Z")

</div>

![hszd](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/e/e7fcc1bdddb4446dfc772303d61dbc37d9024124.jpeg)

I am trying to make something like this. My code is here

```auto
int x;
int y=226;
boolean play = true;

void setup() {
  size(800, 400);
  background(0);

  
}

void draw() {
  cave();
  stone();
  clumsy();
  bomb();
  coins();
  
}

void cave() {
  noStroke();
  fill(160);
  rect(0,88,width,200);
}

void stone() {
  color c[] = new color[3];
  int n=0;
  c[0]=color(255, 0, 0); // first color
  c[1]=color(0, 255, 0); // second
  c[2]=color(0, 0, 255); // third
  for(int i=0; i<width; i+=30){
    strokeWeight(2);
    stroke(0);
    fill(c[n]);
    rect(i,88,30,30);
    rect(i,285,30,30);
    n++;
    if(n>2) n=0;
  }
}

void clumsy(){
  strokeWeight(1);
  fill(0);
  ellipse(x+30,y-5,80,45);
  fill(#F3F156);
  rect(x,y,58,58);
  fill(#90F614);
  rect(x+5,y+10,10,10);
  rect(x+40,y+10,10,10);
  fill(#EF1A1A);
  rect(x+15,y+30,25,15);
  if (play){
    x++;
  }
  if(x>width){
  x=0;}

}

void keyPressed() {
  
  if (key == CODED) {
    if (keyCode == UP) {
      if (y == 226){
      y-= 100;
      }
    }
  }
   if (keyCode == DOWN) {
      if (y == 126){
      y+= 100;
      }
    }
    
    if (keyCode == ' ') {
      play = !play;
    }
  }

void bomb(){
  

}

void coins(){
}

```

How can i make this little red boxes and yellow circles randomly using array(s). Thse are defines as bomb and coins respectively. Please help me with this problem.

---

<div class="post-metadata">

**Author:** ![jb4x](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jb4x/32/789_2.png) [@jb4x](https://discourse.processing.org/u/jb4x)\
**Post date:** [August 25, 2018, 11:38am UTC](https://discourse.processing.org/t/random-boxes-and-circles-using-array-s/2939/2 "2018-08-25T11:38:40Z")

</div>

Hi,

Concerning the array, I would advise you to read [the doc about arrayList](https://processing.org/reference/ArrayList.html) and maybe try some exemples given with processing.

Now for the random part, I would deal with it that way:

```auto
Divide your screen into a certain amount of colomns

For every column:
  get a random number r
  if r < 0.5:
    set the y position to the top
  else:
    set the y position to the bottom

  get another random number r2
  if r2 < 0.2:
    draw a circle in the column at the y position
  else if r2 < 0.4:
    draw a rectangle in the column at the y position
  else:
    draw nothing

```

Of course you can adjust the numbers to fit the need of your game.  
Here is a working exemple:

```auto
void setup() {
  size(500, 100);
  background(40);
  noStroke();
  fill(200);
  
  for (int i = 10; i < width; i+=20) {
    float shapeType = random(1);
    float r = random(1);
    int y;
    int w = 10;
    
    if (r < 0.5) {
      y = 10;
    } else {
      y = height - 20;
    }
    
    if (shapeType < 0.2) {
      rect(i, y, w, w);
    } else if (shapeType < 0.4) {
      ellipse(i + w/2.0, y + w/2.0, w, w);
    }
  }
}

```

---

<div class="post-metadata">

**Author:** ![suptoabha](https://avatars.discourse-cdn.com/v4/letter/s/a587f6/32.png) [@suptoabha](https://discourse.processing.org/u/suptoabha)\
**Post date:** [August 25, 2018, 2:23pm UTC](https://discourse.processing.org/t/random-boxes-and-circles-using-array-s/2939/3 "2018-08-25T14:23:06Z")

</div>

lets focus on the rects only. I want only 2 rects at bottom and 2 in the top with a random value. How can i do it with array(s)? please help me

---

<div class="post-metadata">

**Author:** ![kfrajer](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kfrajer/32/196_2.png) [@kfrajer](https://discourse.processing.org/u/kfrajer)\
**Post date:** [August 25, 2018, 4:36pm UTC](https://discourse.processing.org/t/random-boxes-and-circles-using-array-s/2939/4 "2018-08-25T16:36:03Z")

</div>

Here is my incomplete attempt to demonstrate how to implement coins. For what you want to do, you should consider learning OOP as it will allow you to track related variables together under an abstraction called an object. The main concept you want to use from oop in this case would be encapsulation. Before you try to figure out ArrayList, you need to isolate and understand the Coin class. I have added an abstract class as it can be used to implement your bomb objects in your game as well, as I demonstrated below. Notice the bomb class is almost fully implemented, but some work still needs to be done there.

Finally, notice that the coins show in the wrong place. It is an easy fix and it will be your task to complete it.

I strongly recommend you to visit this guide about [objects](https://processing.org/tutorials/objects/) as it will resolve most of your immediate questions about the code below.

Kf

```java
final int NCOINS=5;
final color GOLD_COLOR=color(220,220,15);
final int FLOOR_HEIGHT=285;
final int CEIL_HEIGHT=88;

int x;
int y=226;
boolean play = true;

ArrayList<Coin> allCoins;

void setup() {
  size(800, 400);
  background(0);
  
  allCoins = new ArrayList<Coin>();
  
  for(int i=0;i<NCOINS;i++){
    Coin aCoin=new Coin(random(width),CEIL_HEIGHT+40,GOLD_COLOR); //40 to account for stone and coin dimensions
    allCoins.add(aCoin);    
  }
}

void draw() {
  cave();
  stone();
  clumsy();
  bomb();
  coins();
}

void cave() {
  noStroke();
  fill(160);
  rect(0, 88, width, 200);
}

void stone() {
  color c[] = new color[3];
  int n=0;
  c[0]=color(255, 0, 0); // first color
  c[1]=color(0, 255, 0); // second
  c[2]=color(0, 0, 255); // third
  for (int i=0; i<width; i+=30) {
    strokeWeight(2);
    stroke(0);
    fill(c[n]);
    rect(i, FLOOR_HEIGHT, 30, 30);
    rect(i, CEIL_HEIGHT, 30, 30);
    n++;
    if (n>2) n=0;
  }
}

void clumsy() {
  strokeWeight(1);
  fill(0);
  ellipse(x+30, y-5, 80, 45);
  fill(#F3F156);
  rect(x, y, 58, 58);
  fill(#90F614);
  rect(x+5, y+10, 10, 10);
  rect(x+40, y+10, 10, 10);
  fill(#EF1A1A);
  rect(x+15, y+30, 25, 15);
  if (play) {
    x++;
  }
  if (x>width) {
    x=0;
  }
}

void keyPressed() {

  if (key == CODED) {
    if (keyCode == UP) {
      if (y == 226) {
        y-= 100;
      }
    }
  }
  if (keyCode == DOWN) {
    if (y == 126) {
      y+= 100;
    }
  }

  if (keyCode == ' ') {
    play = !play;
  }
}

void bomb() {
}

void coins() {
  
  for(Coin x: allCoins){
    x.draw();
  }
}

// https://docs.oracle.com/javase/tutorial/java/IandI/abstract.html
public abstract class MasterObject {

  protected color c;
  protected PVector pos;
  abstract void draw();
  abstract void update();
}

class Coin extends MasterObject {
  
  float radius;

  //Constructor
  Coin( float x, float y, color col) {
    c=col;
    pos =new PVector(x, y);
    radius=10;
  }

  //Mandatory implementation: draw
  void draw() {
    fill(c);
    ellipse(pos.x,pos.y, radius*2,radius*2);
  }

  //Mandatory implementation: update
  void update() {
  }
}

//NEXT class is incomplete and needs to be fully implemented
class Bomb extends MasterObject {
  
  float len; //Length pf side of square

  //Constructor
  Bomb( float x, float y, color col) {
    c=col;
    pos =new PVector(x, y);
  }

  //Mandatory implementation: draw
  void draw() {
    
    //HERE draw a square using the rect() function. Read documentation for proper implementation
  }

  //Mandatory implementation: update
  void update() {
  }
}

```

---

<div class="post-metadata">

**Author:** ![suptoabha](https://avatars.discourse-cdn.com/v4/letter/s/a587f6/32.png) [@suptoabha](https://discourse.processing.org/u/suptoabha)\
**Post date:** [August 25, 2018, 6:40pm UTC](https://discourse.processing.org/t/random-boxes-and-circles-using-array-s/2939/5 "2018-08-25T18:40:12Z")

</div>

Thanks a lot bro. You are great. Thanks