# Putting rectangles in random positions
**URL:** https://discourse.processing.org/t/putting-rectangles-in-random-positions/39300
**Category:** Processing
**Tags:** homework
**Created:** [October 16, 2022, 3:10pm UTC](https://discourse.processing.org/t/putting-rectangles-in-random-positions/39300 "2022-10-16T15:10:33Z")
**Posts on this page:** 8
**Page:** 1
### Author:  [@JHProcess](https://discourse.processing.org/u/JHProcess)
#### Post date: [October 16, 2022, 3:10pm UTC](https://discourse.processing.org/t/putting-rectangles-in-random-positions/39300/1 "2022-10-16T15:10:33Z")
Hi everyone, I’m new to processing, and in this class, I’m in I’m trying to place rectangles in a scattered array behind this big star that I have already in place.
The image I have attached is my sketch for this project
the code I have right now is this
```auto
void setup(){
size(1360, 1400);
}
void draw() {
background(51);
fill(41,171,226);
stroke(255);
strokeWeight(2);
beginShape();
vertex(785, 233);
vertex(881,431);
vertex(1098,464);
vertex(939, 617);
vertex(975, 834);
vertex(781, 730);
vertex(586, 831);
vertex(625, 614);
vertex(468, 460);
vertex(686, 430);
endShape(CLOSE);
}
{
float r = 0;
float g = 0;
float b = 0;
float a = 0;
float X = 0;
float Y = 0;
if (mousePressed){
r = int(random(0, 255));
g = int(random(0, 255));
b = int(random(0, 255));
a = int(random(0, 255));
X = int(random(10, 60));
Y = int(random(10, 60));
fill(r, g, b, a);
rectMode(CENTER);
rect(mouseX, mouseY, X, Y);
}
}
```
whenever i run this code i only get the star and not the rectangles, i would greatly appreciate any and all help!
---
### Author:  [@svan](https://discourse.processing.org/u/svan)
#### Post date: [October 16, 2022, 3:20pm UTC](https://discourse.processing.org/t/putting-rectangles-in-random-positions/39300/2 "2022-10-16T15:20:33Z")
Take the background(51) out of the draw() function. This will erase everything on every draw cycle which occurs 60 times per second by default. I presume that if you draw a rectangle you want it to stay on your screen, so leave it out.
Use this mousePressed() and it should work:
```auto
void mousePressed() {
r = int(random(0, 255));
g = int(random(0, 255));
b = int(random(0, 255));
a = int(random(0, 255));
X = int(random(10, 60));
Y = int(random(10, 60));
fill(r, g, b, a);
rectMode(CENTER);
rect(mouseX, mouseY, X, Y);
}
```
---
### Author:  [@JHProcess](https://discourse.processing.org/u/JHProcess)
#### Post date: [October 16, 2022, 3:30pm UTC](https://discourse.processing.org/t/putting-rectangles-in-random-positions/39300/3 "2022-10-16T15:30:25Z")
Thank you soo much svan but now its saying that "int does not match with “processing.core.PGraphics”.
```auto
void setup(){
size(1360, 1400);
}
void draw() {
fill(41,171,226);
stroke(255);
strokeWeight(2);
beginShape();
vertex(785, 233);
vertex(881,431);
vertex(1098,464);
vertex(939, 617);
vertex(975, 834);
vertex(781, 730);
vertex(586, 831);
vertex(625, 614);
vertex(468, 460);
vertex(686, 430);
endShape(CLOSE);
}
{
float r = 0;
float g = 0;
float b = 0;
float a = 0;
float X = 0;
float Y = 0;}
void mousePressed() {
r = int(random(0, 255));
g = int(random(0, 255));
b = int(random(0, 255));
a = int(random(0, 255));
X = int(random(10, 60));
Y = int(random(10, 60));
fill(r, g, b, a);
rectMode(CENTER);
rect(mouseX, mouseY, X, Y);
}
```
its saying those variable doesnt exist when i have it setup to exist?
---
### Author:  [@svan](https://discourse.processing.org/u/svan)
#### Post date: [October 16, 2022, 3:59pm UTC](https://discourse.processing.org/t/putting-rectangles-in-random-positions/39300/4 "2022-10-16T15:59:20Z")
Remove the brackets around your variables (you don’t need the brackets). Usually those variables go at the top of your code.
```auto
float r = 0;
float g = 0;
float b = 0;
float a = 0;
float X = 0;
float Y = 0;
```
---
### Author:  [@JHProcess](https://discourse.processing.org/u/JHProcess)
#### Post date: [October 16, 2022, 5:06pm UTC](https://discourse.processing.org/t/putting-rectangles-in-random-positions/39300/5 "2022-10-16T17:06:40Z")
You are amazing thank you, i do have one more request how would i setup to make the star spin after pressing then have the rectangle pop up around the spinning star
---
### Author:  [@svan](https://discourse.processing.org/u/svan)
#### Post date: [October 16, 2022, 5:15pm UTC](https://discourse.processing.org/t/putting-rectangles-in-random-positions/39300/6 "2022-10-16T17:15:19Z")
> how would i setup to make the star spin after pressing then have the rectangle pop up around the spinning star
That’s a postgraduate question and I’m not sure I know the answer. We like to limit these threads to one problem, one solution for the next person who searches the archive and reads this. To avoid confusion, it would probably be best to open a new thread; someone else may have a solution to the above question.
---
### Author:  [@JHProcess](https://discourse.processing.org/u/JHProcess)
#### Post date: [October 16, 2022, 5:26pm UTC](https://discourse.processing.org/t/putting-rectangles-in-random-positions/39300/7 "2022-10-16T17:26:19Z")
I appreciate all your help so far thank you!
---
### Author:  [@jb4x](https://discourse.processing.org/u/jb4x)
#### Post date: [October 16, 2022, 5:30pm UTC](https://discourse.processing.org/t/putting-rectangles-in-random-positions/39300/8 "2022-10-16T17:30:27Z")
I would not advise to get rid of `background()` since in 99% of the case that will create more problem that it will solve.
Take the example below. We start by drawing a simple white rectangle in the middle of the screen. When a key is pressed, we draw a red rectangle on top of the white one.
```auto
void setup() {
size(600, 600);
background(20);
}
void draw() {
noStroke();
fill(240);
rect(200, 200, 200, 200);
}
void keyPressed() {
noStroke();
fill(240, 0, 0);
rect(250, 250, 100, 100);
}
```
You can see how the red rectangle only stay one frame since the white rectangle is being drawn on top . That would be your case if you would draw a rectangle on top of your star with your current code.
The way to do it is to store somewhere the rectangles that you want to draw and to handle in `draw()` how you want to draw them. One way is to use several ArrayList to store the position, size and color. A better way would be to create a rectangle class holding all that info and use an arraylist to store those rectangle object. Here’s an exemple:
```auto
ArrayList rectanglesPos;
ArrayList rectanglesDim;
ArrayList rectanglesCol;
void setup() {
size(1360, 1400);
rectanglesPos = new ArrayList();
rectanglesDim = new ArrayList();
rectanglesCol = new ArrayList();
}
void draw() {
background(20);
// Draw rectangles
rectMode(CENTER);
noStroke();
for (int i = 0; i < rectanglesPos.size(); i++) {
fill(rectanglesCol.get(i));
rect(rectanglesPos.get(i).x, rectanglesPos.get(i).y, rectanglesDim.get(i).x, rectanglesDim.get(i).y);
}
// Draw star
fill(41, 171, 226);
stroke(255);
strokeWeight(2);
beginShape();
vertex(785, 233);
vertex(881, 431);
vertex(1098, 464);
vertex(939, 617);
vertex(975, 834);
vertex(781, 730);
vertex(586, 831);
vertex(625, 614);
vertex(468, 460);
vertex(686, 430);
endShape(CLOSE);
}
void mousePressed() {
float r = random(0, 255);
float g = random(0, 255);
float b = random(0, 255);
float a = random(0, 255);
float X = random(10, 60);
float Y = random(10, 60);
rectanglesPos.add(new PVector(mouseX, mouseY));
rectanglesDim.add(new PVector(X, Y));
rectanglesCol.add(color(r, g, b, a));
}
```