java - processing - Having Object Oriented programming issues

Question

So basically, my aim it to create a program like the MS Paint software, where I can draw shapes with mouse dragging and change its colors. This is a very long script of mine. I'm fairly new to OOP so I am having difficulties trying to make all the functions to work together.

Main

Button button1, button2, button3, button4, button5, button6, button7;
Rect rect;
Circle circle;
int mode = 1;

void setup() {
    size(900,600);
    smooth();
    rect = new Rect(0,0,0,0, new PImage());
    circle = new Circle(0,0,0,0, new PImage());
    color gray = color(234);
    color black = color(0);
    color white  = color(255);
    color red = color(255,0,0);
    color green = color(0,255,0);
    color blue = color(0,0,255);

    button1 = new Button(10, 60, 20, white, gray, black); //draw rectangle function
    button2 = new Button(10, 100, 20, white, gray, black); //draw circle function
    button3 = new Button(10, 140, 20, red, gray, black); //option of color red
    button4 = new Button(10, 160, 20, green, gray, black); //option of color green
    button5 = new Button(10, 180, 20, blue, gray, black); //option of color blue
    button6 = new Button(10, 220, 20, black, gray, black); //fill entire shape
    button7 = new Button(10, 240, 20, white, gray, black); //fill nothing
}

void draw() {
    button1.setp();
    button2.setp();
}

void mousePressed() {
    if (button1.press()) { mode = 1; }
    if (button2.press()) { mode = 2; }
    if (button3.press()) { mode = 3; }
    if (button4.press()) { mode = 4; }
    if (button5.press()) { mode = 5; }
    if (button6.press()) { mode = 6; }
    if (button7.press()) { mode = 7; }
}

void manageButtons() {
    button1.update();
    button2.update();
    button3.update();
    button4.update();
    button5.update();
    button6.update();
    button7.update();

    button1.display();
    button2.display();
    button3.display();
    button4.display();
    button5.display();
    button6.display();
    button7.display();
}

void mouseReleased() {
    button1.release();
    button2.release();
    button3.release();
    button4.release();
    button5.release();
    button6.release();
    button7.release();
}

void mouseDragged() {
    //rect.drag();
}

Button Class

class Button {
    int x, y; // the x- and y-coordinate
    int size; // dimension (width & height)
    color baseGray; // Default gray value
    color overGray; // Value when the mouse is over
    color pressGray; // Value when the mouse is pressed
    boolean over = false; // true when the mouse is over
    boolean pressed = false;// true when pressed 

    Button(int xp, int yp, int s, color b, color o, color p) {
        x = xp;
        y = yp;
        size = s;
        baseGray = b;
        overGray = o;
        pressGray = p;
    }

    void setp() {
        background(255);
        manageButtons();
        //stroke();
        if (mode == 1) {
            rect.drawing();
        } else if (mode == 2) {
            circle.drawing();
        }
    }

    void update() {
        if ((mouseX >= x) && (mouseX <= x + size) && (mouseY >= y) && (mouseY <= y + size)) {
            over = true;
        } else {
            over = false;
        }
    }

    boolean press() {
        if (over) {
            pressed = true;
            return true;
        } else {
            return false;
        }
    }

    void release() {
        pressed = false;
        rect.release();
        circle.release();
    }

    void display() {
        if (pressed) {
            fill(pressGray);
        } else if (over) {
            fill(overGray);
        } else {
            fill(baseGray);
        }

        stroke(0);
        rect(x, y, size, size);
    }
}

Circle Class

class Circle {
    int x, y;
    int xp, yp;
    PImage a;

    Circle(int dragx, int dragy, int movex, int movey, PImage image) {
        x = dragx;
        y = dragy;
        xp = movex;
        yp = movey;
        a = image;
    }

    void display() {
        smooth();
        background(255);
        a = get();
        stroke(0);
        fill(255); //255,255,10);
    }

    void drawing() {
        image(a, 0, 0); //background(a);
        float sizex = xp - x;
        float sizey = yp - y;
        if (mousePressed && mouseButton == LEFT) {
            ellipse(x, y, sizex, sizey);
        }
    }

    void press() {
        x = mouseX;
        y = mouseY;
    }

    void release() {
        xp = mouseX;
        yp = mouseY;
        noLoop();
        a = get();
        loop();
    }

    void drag() {
        xp = 80 + mouseX;
        yp = 80 + mouseY;
    }
}

Rectangle Class

class Rect {
    int x, y;
    int xp, yp;
    PImage a;

    Rect(int dragx, int dragy, int movex, int movey, PImage image) {
        x = dragx;
        y = dragy;
        xp = movex;
        yp = movey;
        a = image;
    }

    void display() {
        smooth();
        background(255);
        a = get();
        stroke(0);
        fill(255); //255,255,10);
    }

    void drawing() {
        image(a, 0, 0); //background(a);
        float sizex = xp - x;
        float sizey = yp - y;
        if (mousePressed && mouseButton == LEFT) {
            rect(x, y, sizex, sizey);
        }
    }

    void press() {
        x = mouseX;
        y = mouseY;
    }

    void release() {
        xp = mouseX;
        yp = mouseY;
        noLoop();
        a = get();
        loop();
    }

    void drag() {
        xp = mouseX;
        yp = mouseY;
    }
}

With the above processing script (java), I am having issues getting the rectangle and circle classes to work properly with the buttons I have created. Button 1 is supposed to draw rectangles and button 2 is supposed to draw circles (so far, only these functions are supposed to work. I also need to apply colors to them).

I know the rectangle and circle classes work properly because I had tested them separately prior to putting everything together. The buttons (functions) work but not correctly (I am supposed to use the mouse to drag the shapes into any desired place, while this program only allows them to appear where I place them and only from the corner, as if I'm only stretching the shapes from x and y position (0,0)). My sole problem is that I can't seem to join the buttons to the shape function correctly, and make them all work together.

Answer 1

It is hard to evaluate the correctness of your code without seeing the main method. Your 'main' class is set up in such a way that it appears the method mousePressed() is intended to poll the buttons and set the drawing mode based on their state.

It is impossible for me to know if you are polling the buttons correctly, however, without viewing the main method.

If you are looking to use an Object-Oriented approach, you are going to want to use the Observer pattern. In essence, your buttons will all have a reference to the 'main' object which has a buttonClicked(Button btn) method. When a button is clicked, it runs the 'main' object's buttonClicked(Button btn) method. The argument provided will be a reference to the button that is clicked so that the main can choose the appropriate mode to use. Demo code follows:

In Main class:

//Give the button a reference to the main object
button1 = new button(this);

//receive notifications from the button
public buttonClicked(Button btn) {
    if(btn.equals(button1))
        mode = 1;
    if(...)
        ...
}