# Class problem: Place four Sketches on the screen

Hi guys I have this situation: I created an exercise where inside of it I created a class object called A_square, but my goal would be has in a square 666x666, four different classes (A_B_C_D) which different graphic output.

My question: How Could I create a square 666x666 with inside of it four different smaller square (333x333) with different dynamic settings? Maybe with some PGraphics settings?

Sorry for my English, it is not my first Language.

``````//This below is the first situation:
A_square a1;

void setup () {
size (333, 333);
frameRate(12);

background (0);
a1 = new A_square();
}

void draw() {
background (0);
a1.graphic();
}

// ========================================================

class A_square {
int x;
int y;
float r=0;
boolean rotationMode = true;

A_square () {
// empty constructor
}

void graphic() {
if (rotationMode) {
translate (width/2, height/2);
r = r + 1;
}
for (int y=-width; y<width; y=y+20) {
for ( int x=-height; x<height; x=x+20) {
fill(random(0, 255), random(0, 255), random(0, 255));
ellipse (x, y, random(5, 15), random(5, 15));
}
}
}
}
``````
2 Likes

depending of what you plan you can just make it so that class A_square
only produces output between 0 and 333 for x and y

• and then next class from 334 to 666 for x and from 0 to 333 for y and so on

Could be, actually I don’t fully understand the second part of your message. However the concept is based on the idea to have different square (dynamic) inside of a bigger one.
The other three (B-C-D) I’m going to create, but before I would like to achive the 333x333 A_square inside of the 666x666 one, maybe A in the upper right of it.

Do you suggest to use map funcition for adjust the A_square output? Or inside the for loops?

The concept is simple but technically I’m stuck because the first A_square is based on the width and height of a square which is misured 333x333.

makes it so that class A_square
only produces output between 0 and 333 for x and y

``````

//This below is the first situation:
A_square a1;
B_square b1;
C_square c1;

void setup () {
size (666, 666);
frameRate(12);

background (0);
a1 = new A_square();
b1 = new B_square();
c1 = new C_square();
}

void draw() {
background (0);
a1.graphic();
b1.graphic();
c1.graphic();
}

// ========================================================

class A_square {
int width1=333;
int height1=333;
int x;
int y;
float r=0;
// boolean rotationMode = true;

A_square () {
// empty constructor
}

void graphic() {

ellipseMode(CENTER);
for (int y=0; y<width1; y=y+20) {
for ( int x=0; x<height1; x=x+20) {
pushMatrix();
fill(random(0, 255), random(0, 255), random(0, 255));
translate(x, y);
ellipse (0, 0, random(5, 15), random(5, 15));
popMatrix();
}
}
r = r + 1;
}
//
}
// ========================================================

class B_square {
void graphic() {
fill(0, 0, 244);
rect(334, 0,
333, 333);
}
}
// ========================================================

class C_square {
void graphic() {
fill(220, 0, 244);
rect(334, 334,
333, 333);
}
}
``````
1 Like

OR you use PGraphics (done only for A_class)

``````

//This below is the first situation:
A_square a1;
B_square b1;
C_square c1;

void setup () {
size (666, 666);
frameRate(12);

background (0);
a1 = new A_square();
b1 = new B_square();
c1 = new C_square();
}

void draw() {
background (0);

a1.graphic();
b1.graphic();
c1.graphic();
}

// ========================================================

class A_square {
int width1=333;
int height1=333;
int x;
int y;
float r=0;
// boolean rotationMode = true;

PGraphics pg1;

A_square () {
// empty constructor
}

void graphic() {
pg1=createGraphics(333, 333);
pg1.beginDraw();
pg1.pushMatrix();
pg1.translate(width/2, height/2);
pg1.ellipseMode(CENTER);
for (int y=-width; y<width; y=y+20) {
for ( int x=-height; x<height; x=x+20) {
pg1.pushMatrix();
pg1.fill(random(0, 255), random(0, 255), random(0, 255));
pg1.translate(x, y);
pg1.ellipse (0, 0,
random(5, 15), random(5, 15));
pg1.popMatrix();
}
}
r = r + 1;
pg1.popMatrix();
pg1.endDraw();
//
image(pg1, 0, 0);
}
//
}
// ========================================================

class B_square {
void graphic() {
fill(0, 0, 244);
rect(334, 0,
333, 333);
}
}
// ========================================================

class C_square {
void graphic() {
fill(220, 0, 244);
rect(334, 334,
333, 333);
}
}
``````
1 Like

Thank you so much!!! I have a question about the first case: Why the code is still? I mean the rotation, I would like to achive the rotation of the loops

Do you mean this case::: makes it so that class A_square
only produces output between 0 and 333 for x and y

They do rotate on my computer

But it’s only an example you can change it the way you want

Yes I mean that case, but the strange thing it’s on my pc the code doesn’t rotate…

Then you should fix it

Ok, but I don’t understand why on your pc it rotates, I took your code!

well each ellipse rotates around itself, the entire thing doesn’t

In this new version it does

``````

//This below is the first situation:
A_square a1;
B_square b1;
C_square c1;
D_square d1;

void setup () {
size (666, 666);
frameRate(12);

background (0);
a1 = new A_square();
b1 = new B_square();
c1 = new C_square();
d1 = new D_square();
}

void draw() {
background (0);
a1.graphic();
b1.graphic();
c1.graphic();

d1.graphic();
}

// ========================================================

class A_square {
int width1=333;
int height1=333;
int x;
int y;
float r=0;
// boolean rotationMode = true;

A_square () {
// empty constructor
}

void graphic() {

pushMatrix();
ellipseMode(CENTER);
translate(333/2, 333/2);

for (int y=-width1/2; y<width1/2; y=y+20) {
for ( int x=-height1/2; x<height1/2; x=x+20) {
pushMatrix();
fill(random(0, 255), random(0, 255), random(0, 255));
translate(x, y);
ellipse (0, 0, random(5, 15), random(5, 15));
popMatrix();
}
}
r = r + 1;
popMatrix();
}
//
}
// ========================================================

class B_square {
void graphic() {
fill(0, 0, 244);
rect(334, 0,
333, 333);
}
}
// ========================================================

class C_square {
void graphic() {
fill(220, 0, 244);
rect(334, 334,
333, 333);
}
}

class D_square {
void graphic() {
fill(220, 0, 244);
rect(0, 334,
333, 333);
}
}
``````
1 Like

Awesome I’m very happy thank you!!!

1 Like