Procedural to OOP

Programming Questions

oxxiio

in Programming Questions • 1 year ago

My first attempt at converting a procedural program to OOP is not behaving as it should. I can't pinpoint what's wrong with the code, but I suspect the class I wrote is at fault somewhere. Is it the way I called/setup the mouseClicked function?

Procedural version.

float x = 40;
float y = 40;
int bxW = 60;
int bxH = 60;
boolean rectClicked = false;
float moveX = 2;
int countClick = 0;
///////////////////////////////
void setup() {
size(700, 600);
smooth();
noStroke();
}
///////////////////////////////////////
void draw() {
background(255);
box1();
emptyRect();
}////////////////////////////// end draw
//----------- functions -----------
/////////////////////////////////////////
void box1 () {
// draw the square
fill(#7178E5);
noStroke();
rect(x, y, bxW, bxH);
if (rectClicked) {
countClick = 1;
x += moveX;
if (x>= 400) {
x = 400;
moveX = - moveX;
}
if (x<=40) {
x = 40;
moveX = - moveX;
}
}
else {
countClick = 0;
x = 40;
}
}
////////////////////////////////
void emptyRect() {
//empty rect
stroke(#3C3D40);
fill(255, 15);
rect(40, 40, 60, 60);
}
//////////////////////////////////
void mouseClicked() {
box1MouseClick();
}
///////- box1 mouse click functions ///////////
void box1MouseClick() {
if ((mouseX>42) && (mouseX<=99) && (mouseY >44) && (mouseY<99)) {
rectClicked = true;
}
if ((countClick >= 1) && (mouseX>42) && (mouseX<=99) && (mouseY >44) && (mouseY<99)) {
rectClicked = false;
}
}

OOP version:

/////////globals //////////
boolean rectClicked = false;
int countClick = 0;
/////////////////////////
class Boxen {
float x;
float y;
int bxW;
int bxH;
float speedX;
int startX;
int endX;
int startY;
int endY;
///////////////////////////////////
Boxen() {
x = 40;
y = 40;
bxW = 60;
bxH = 60;
speedX = 2;
}
////////////////////////////////////
void displayBoxen() {
fill(#7178E5);
noStroke();
rect(x, y, bxW, bxH);
}
void moveBoxen() {
if (rectClicked) {
countClick = 1;
x += speedX;
if (x>= 400) {
x = 400;
speedX = - speedX;
}
if (x<=40) {
x = 40;
speedX = - speedX;
}
}
else {
countClick = 0;
x = 40;
}
}
/////////// mouseClick function ///////////
void mouseClicked(int tempStartX, int tempEndX, int tempStartY, int tempEndY ) {
startX = tempStartX;
endX = tempEndX;
startY = tempStartY;
endY = tempEndY;
//////////////////
// First Square X: Parameters: 42, 99
// 1st Square Y Parameters: 44, 99
//
//
//
//
////////////////////
if ((mouseX>startX) && (mouseX<=endX) && (mouseY >startY) && (mouseY<endY)) {
rectClicked = true;
}
if ((countClick >= 1) && (mouseX>startX) && (mouseX<=endX) && (mouseY >startY) && (mouseY<endY)) {
rectClicked = false;
}
}
}/// end class
Boxen myBoxen;
void setup() {
size(700,600);
background(255);
smooth();
noStroke();
myBoxen = new Boxen();
}
void draw(){
myBoxen.displayBoxen();
myBoxen.mouseClicked(42,99,44,99);
myBoxen.moveBoxen();
emptyRect();
}
//////////// other function ////////////
void emptyRect()
{
stroke(#3C3D40);
fill(255, 15);
rect(40, 40, 60, 60);
}

Replies(9)

PhiLho

Re: Procedural to OOP

1 year ago

Well, it is better to handle the mouseClicked() method in the mouseClicked() function, don't you think?

void draw(){
myBoxen.displayBoxen();
myBoxen.moveBoxen();
emptyRect();
}
void mouseClicked()
{
myBoxen.mouseClicked(42,99,44,99);
}

oxxiio

Re: Procedural to OOP

1 year ago

I tried your code, but now nothing happens.

/////////globals //////////
boolean rectClicked = false;
int countClick = 0;
/////////////////////////
class Boxen {
float x;
float y;
int bxW;
int bxH;
float speedX;
int startX;
int endX;
int startY;
int endY;
///////////////////////////////////
Boxen() {
x = 40;
y = 40;
bxW = 60;
bxH = 60;
speedX = 2;
}
////////////////////////////////////
void displayBoxen() {
fill(#7178E5);
noStroke();
rect(x, y, bxW, bxH);
}
void moveBoxen() {
if (rectClicked) {
countClick = 1;
x += speedX;
if (x>= 400) {
x = 400;
speedX = - speedX;
}
if (x<=40) {
x = 40;
speedX = - speedX;
}
}
else {
countClick = 0;
x = 40;
}
}
/////////// mouseClick function ///////////
void mouseClicked(int tempStartX, int tempEndX, int tempStartY, int tempEndY ) {
myBoxen.mouseClicked(42,99,44,99);
startX = tempStartX;
endX = tempEndX;
startY = tempStartY;
endY = tempEndY;
//////////////////
// First Square X: Parameters: 42, 99
// 1st Square Y Parameters: 44, 99
//
//
//
//
////////////////////
if ((mouseX>startX) && (mouseX<=endX) && (mouseY >startY) && (mouseY<endY)) {
rectClicked = true;
}
if ((countClick >= 1) && (mouseX>startX) && (mouseX<=endX) && (mouseY >startY) && (mouseY<endY)) {
rectClicked = false;
}
}
}/// end class
Boxen myBoxen;
void setup() {
size(700,600);
background(255);
smooth();
noStroke();
myBoxen = new Boxen();
}
void draw(){
myBoxen.displayBoxen();
//myBoxen.mouseClicked(42,99,44,99);
myBoxen.moveBoxen();
emptyRect();
}
//////////// other function ////////////
void emptyRect()
{
stroke(#3C3D40);
fill(255, 15);
rect(40, 40, 60, 60);
}

PhiLho

Re: Procedural to OOP

1 year ago

I don't see my code in the code you show again, which looks strongly like the previous one.
Ah, I see, you just commented out the myBoxen.mouseClicked(42,99,44,99); which is the first part, but you haven't added the mouseClicked() function calling it.
This function is automatically called by Processing whenever the user clicks on the sketch. You have to transmit the information to the class, via its method.

Note: I wonder why you pass parameters to the mouseClicked() method in Boxen, instead of using the fields of the class.

oxxiio

Re: Procedural to OOP

1 year ago

I did add the mouseClicked function. See line 72 in the code. When I run the program, and click on the blue rect, nothing happens. Could you post how the code should be for this to work? Sometimes if I see the code, I'll understand it better.

calsign

Re: Procedural to OOP

1 year ago

mousePressed() is called by Processing with no parameters. You'll have to remove the parameters from mousePressed() (the global version, not the one in your class) and find another way to get to those values.

v.k.

Re: Procedural to OOP

1 year ago

Here, an adapted version of your code with some comments. Just to help you understand, the result should not be be what u need, but i think might help you understand better.

edited: as i forgot to change lines 88 and 90 they still having the hard number (40), though the objects are not behaving as they should. Every one stops at lef,t where the first square is instead of their own position. if you change those hard numbers to startX they should work fine. (untested)

/////////globals //////////
int countClick = 0;
/////////////////////////
class Boxen {
float x;
float y;
int bxW;
int bxH;
float speedX;
float startX; // made float to can interchange with x
// i did use your var for another porpouse
// store the original position for the frame
int endX;
float startY;
int endY;
boolean rectClicked = false; // Brought inside class so each instance has it own
///////////////////////////////////
Boxen() { // a constructor with hard number is not much usefull
x = 40;
y = 40;
bxW = 60;
bxH = 60;
speedX = 2;
startX = x;
startY = y;
}
Boxen(float _x, float _y, int _bxW, int _bxH, float _speed) {
// this accepts inputs for making diferent instances
x = _x;
y = _y;
startX = x;
startY = y;
bxW = _bxW;
bxH = _bxH;
speedX = _speed;
}
////////////////////////////////////
void displayBoxen() {
fill(#7178E5);
noStroke();
rect(x, y, bxW, bxH);
emptyRect(); /// called form inside the clas to share class vars
}
void emptyRect()
{
stroke(#3C3D40);
fill(255, 15);
rect(startX, startY, bxW, bxH); /// startX used here, we ant the frame to stay..
}
void moveBoxen() { // I did not get the porpouse of counClick so ignored it
if (rectClicked) {
countClick = 1;
x += speedX;
if (x>= 400) {
x = 400;
speedX = - speedX;
}
if (x<=40) {
x = 40;
speedX = - speedX;
}
}
}
/////////// mouseClick function ///////////
void isMouseClicked() {
//////////////////
// First Square X: Parameters: 42, 99
// 1st Square Y Parameters: 44, 99
//
//
//
//
////////////////////
if ((mouseX > startX) && (mouseX< startX + bxW) &&
(mouseY >startY) && (mouseY < startY + bxH)) {
rectClicked = true;
}
}
}/// end class
Boxen myBoxen;
Boxen myBoxen2;
Boxen[] several= new Boxen[10]; // illustrate how to handle a lot...
void setup() {
size(700, 600);
background(255);
smooth();
noStroke();
myBoxen = new Boxen();
myBoxen2 = new Boxen(100, 100, 50, 60, 1.89);
for (int i = 0 ; i < several.length; i++)
{
several[i] = new Boxen (100, 200+ i*40 , 40, 40, i+1 );// i helps change parameters..
}
}
void draw() {
background(255);//
myBoxen.displayBoxen();
myBoxen.moveBoxen();
myBoxen2.displayBoxen();
myBoxen2.moveBoxen();
for (int i = 0 ; i < several.length; i++)
{
several[i].displayBoxen();
several[i].moveBoxen();
}
}
void mouseClicked()
{
myBoxen.isMouseClicked();
myBoxen2.isMouseClicked();
for (int i = 0 ; i < several.length; i++)
{
several[i].isMouseClicked();
}
}
//////////// other function ////////////

PhiLho

Re: Procedural to OOP

1 year ago

" I did add the mouseClicked function. See line 72 in the code."
Ah, I wouldn't have thought you have put it there... With this line, you make a recursive call, ie. an infinite loop...
I have put my mouseClicked() function at the same level than draw(), and without parameters. See the reference about this function.

oxxiio

Re: Procedural to OOP

1 year ago

Yes, this makes sense to me now. Basically had to make my own ismouseClicked function and not call it 'mouseClicked' which is already taken by Processing. Still lots to learn......

PhiLho

Re: Procedural to OOP

1 year ago

In Processing / Java, two functions can have the same name if they have different number of parameters, or if they are in different classes (or, in Processing, global names vs. class' method names). So the core of the problem wasn't a name clash, rather how to call your function.

Top Reply