I struggled a lot with just trying to figure out how to work the ‘class’ thin, even though I understood the overall concept. Eventually, after watching a few videos and getting help from classmates, I worked it out.
My code is as follows:
//Main CircleDrawing
Shape shape1;
Shape shape2;
Shape shape3;
Shape shape4;
Shape shape5;
Shape shape6;
Shape shape7;
Shape shape8;
int x1= mouseX;
int y1 = mouseY;
color red = color(255, 0, 0, 20);
color green = color(0, 255, 0, 30);
color blue = color(0, 0, 255, 10);
int counter = 1;
void setup(){
size (500,500);
smooth();
colorMode(HSB);
shape1 = new Shape(x1, y1, 250, 150, 250, 250, 100, 100);
shape2 = new Shape(x1, y1, 150, 250, 250, 250, 400, 200);
shape3 = new Shape(x1, y1, 400, 250, 250, 250, 100, 400);
shape4 = new Shape(x1, y1, 250, 400, 250, 250, 50, 290);
}
void draw(){
background(250);
shape1.display();
shape2.display();
shape3.display();
shape4.display();
noStroke();
if(counter == 1) {
fill(red);
}
else if(counter == 2) {
fill(green);
}
else if(counter == 3) {
fill(blue);
}
if (mousePressed == true) {
ellipse(mouseX, mouseY, 50, 50);
}
}
void mouseReleased() {
counter++; // increase the counter
if(counter == 4) {
counter = 1; // loop after 3
}
println(counter);
}
//Class
class Shape{
//Variables
int x1, y1, x2, y2, x3, y3, x4, y4;
//The Constuctor
Shape(int px1, int py1, int px2, int py2, int px3, int py3, int px4, int py4){
x1 = px1;
y1 = py1;
x2 = px2;
y2 = py2;
x3 = px3;
y3 = py3;
x4 = px4;
y4 = py4;
}
//Functions
void display(){
//x1 = int(random(x1-10,x1+10));
//y1 = int(random(y1-10,y1+10));
x1 = mouseX;
y1 = mouseY;
quad(x1, y1, x2, y2, x3, y3, x4, y4);
}
}
This is the final product:
I think this could be improved by designing more organized shapes to create an image perhaps.