Loading...
Logo
Processing Forum
Programming Questions
oxxiio
oxxiio

Procedural to OOP

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. 

Copy code
  2. float x = 40;
  3. float y = 40;

  5. int bxW = 60;
  6. int bxH = 60;

  8. boolean rectClicked = false;
  9. float moveX = 2;

  11. int countClick = 0;


  14. ///////////////////////////////

  16. void setup() {

  18.   size(700, 600);
  19.   smooth();
  20.   noStroke();

  22. }

  24. ///////////////////////////////////////

  26. void draw() {

  28.   background(255);
  29.   box1();
  30.   emptyRect();
  31. }////////////////////////////// end draw



  35. //----------- functions -----------

  37. /////////////////////////////////////////
  38. void box1 () {

  40.   // draw the square
  41.   fill(#7178E5);
  42.   noStroke();
  43.   rect(x, y, bxW, bxH);


  46.   if (rectClicked) {

  48.     countClick = 1;

  50.     x += moveX;

  52.     if (x>= 400) {

  54.       x = 400;
  55.       moveX = - moveX;
  56.     }

  58.     if (x<=40) {

  60.       x = 40;
  61.       moveX = - moveX;
  62.     }
  63.   }

  65.   else {
  66.     countClick = 0;
  67.     x = 40;
  68.   }
  69. }
  70. ////////////////////////////////
  71. void emptyRect() {
  72.   //empty rect
  73.   stroke(#3C3D40);
  74.   fill(255, 15);
  75.   rect(40, 40, 60, 60);
  76. }
  77. //////////////////////////////////


  80. void mouseClicked() {
  81.   box1MouseClick();
  82. }

  84. ///////- box1 mouse click functions ///////////

  86. void box1MouseClick() {
  87.   if ((mouseX>42) && (mouseX<=99) && (mouseY >44) && (mouseY<99)) {

  89.     rectClicked = true;
  90.   }

  92.   if ((countClick >= 1) && (mouseX>42) && (mouseX<=99) && (mouseY >44) && (mouseY<99)) {
  93.     rectClicked = false;
  94.   }
  95. }




      

         OOP version:
Copy code
  2. /////////globals //////////

  4.   
  5. boolean rectClicked = false;
  6. int countClick = 0;

  8. /////////////////////////



  12. class Boxen {
  13.   


  16.   float x;
  17.   float y;

  19.   int bxW;
  20.   int bxH;
  21.   float speedX;

  23.   int startX;
  24.   int endX;
  25.   int startY;
  26.   int endY;
  27.   ///////////////////////////////////
  28.   Boxen() {

  30.     x = 40;
  31.     y = 40;
  32.     bxW = 60;
  33.     bxH = 60;
  34.     speedX = 2;
  35.   }
  36.   ////////////////////////////////////
  37.   void displayBoxen() {
  38.     fill(#7178E5);
  39.     noStroke();
  40.     rect(x, y, bxW, bxH);
  41.   }

  43.   void moveBoxen() {
  44.     if (rectClicked) {

  46.       countClick = 1;

  48.       x += speedX;

  50.       if (x>= 400) {

  52.         x = 400;
  53.         speedX = - speedX;
  54.       }

  56.       if (x<=40) {

  58.         x = 40;
  59.         speedX = - speedX;
  60.       }
  61.     }
  62.     else {
  63.       countClick = 0;
  64.       x = 40;
  65.     }
  66.   }
  67.   /////////// mouseClick function ///////////

  69.   void mouseClicked(int tempStartX, int tempEndX, int tempStartY, int tempEndY ) {

  71.     startX = tempStartX;
  72.     endX   = tempEndX;
  73.     startY = tempStartY;
  74.     endY   = tempEndY;
  75.     //////////////////
  76.     // First Square X: Parameters: 42, 99
  77.     // 1st Square Y Parameters: 44, 99
  78.     //
  79.     //
  80.     //
  81.     //
  82.     ////////////////////

  84.     if ((mouseX>startX) && (mouseX<=endX) && (mouseY >startY) && (mouseY<endY)) {

  86.       rectClicked = true;
  87.     }

  89.     if ((countClick >= 1) && (mouseX>startX) && (mouseX<=endX) && (mouseY >startY) && (mouseY<endY)) {
  90.       rectClicked = false;
  91.     }
  92.   }
  93.   
  94.   

  96.   
  97.   
  98. }/// end class




  103. Boxen myBoxen;


  106. void setup() {

  108.   size(700,600);
  109.   background(255);
  110.   smooth();
  111.   noStroke();
  112.   myBoxen = new Boxen();
  113.   
  114. }


  117. void draw(){

  119. myBoxen.displayBoxen();
  120. myBoxen.mouseClicked(42,99,44,99);
  121. myBoxen.moveBoxen();

  123. emptyRect();

  125. }


  128. //////////// other function ////////////

  130.   void emptyRect()
  131.  {
  132.   stroke(#3C3D40);
  133.   fill(255, 15);
  134.   rect(40, 40, 60, 60);
  135.  
  136.  }

Replies(9)

PhiLho
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?
Copy code
  1. void draw(){
  2.  
  3. myBoxen.displayBoxen();
  4. myBoxen.moveBoxen();
  5.  
  6. emptyRect();
  7.  
  8. }
  9.  
  10. void mouseClicked()
  11. {
  12. myBoxen.mouseClicked(42,99,44,99);
  13. }

oxxiio
oxxiio

Re: Procedural to OOP

1 year ago
I tried your code, but now nothing happens. 

Copy code
  2. /////////globals //////////

  4.   
  5. boolean rectClicked = false;
  6. int countClick = 0;

  8. /////////////////////////



  12. class Boxen {
  13.   


  16.   float x;
  17.   float y;

  19.   int bxW;
  20.   int bxH;
  21.   float speedX;

  23.   int startX;
  24.   int endX;
  25.   int startY;
  26.   int endY;
  27.   ///////////////////////////////////
  28.   Boxen() {

  30.     x = 40;
  31.     y = 40;
  32.     bxW = 60;
  33.     bxH = 60;
  34.     speedX = 2;
  35.   }
  36.   ////////////////////////////////////
  37.   void displayBoxen() {
  38.     fill(#7178E5);
  39.     noStroke();
  40.     rect(x, y, bxW, bxH);
  41.   }

  43.   void moveBoxen() {
  44.     if (rectClicked) {

  46.       countClick = 1;

  48.       x += speedX;

  50.       if (x>= 400) {

  52.         x = 400;
  53.         speedX = - speedX;
  54.       }

  56.       if (x<=40) {

  58.         x = 40;
  59.         speedX = - speedX;
  60.       }
  61.     }
  62.     else {
  63.       countClick = 0;
  64.       x = 40;
  65.     }
  66.   }
  67.   /////////// mouseClick function ///////////

  69.   void mouseClicked(int tempStartX, int tempEndX, int tempStartY, int tempEndY ) {

  71.     
  72.     myBoxen.mouseClicked(42,99,44,99);
  73.     
  74.     startX = tempStartX;
  75.     endX   = tempEndX;
  76.     startY = tempStartY;
  77.     endY   = tempEndY;
  78.     //////////////////
  79.     // First Square X: Parameters: 42, 99
  80.     // 1st Square Y Parameters: 44, 99
  81.     //
  82.     //
  83.     //
  84.     //
  85.     ////////////////////

  87.     if ((mouseX>startX) && (mouseX<=endX) && (mouseY >startY) && (mouseY<endY)) {

  89.       rectClicked = true;
  90.     }

  92.     if ((countClick >= 1) && (mouseX>startX) && (mouseX<=endX) && (mouseY >startY) && (mouseY<endY)) {
  93.       rectClicked = false;
  94.     }
  95.   }
  96.   
  97.   

  99.   
  100.   
  101. }/// end class




  106. Boxen myBoxen;


  109. void setup() {

  111.   size(700,600);
  112.   background(255);
  113.   smooth();
  114.   noStroke();
  115.   myBoxen = new Boxen();
  116.   
  117. }


  120. void draw(){

  122. myBoxen.displayBoxen();
  123. //myBoxen.mouseClicked(42,99,44,99);
  124. myBoxen.moveBoxen();

  126. emptyRect();

  128. }


  131. //////////// other function ////////////

  133.   void emptyRect()
  134.  {
  135.   stroke(#3C3D40);
  136.   fill(255, 15);
  137.   rect(40, 40, 60, 60);
  138.  
  139.  }


PhiLho
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
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
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.
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) 

Copy code

  3. /////////globals //////////



  7. int countClick = 0;

  9. /////////////////////////



  13. class Boxen {



  17.   float x;
  18.   float y;

  20.   int bxW;
  21.   int bxH;
  22.   float speedX;

  24.   float startX; // made float to can interchange with x
  25.                 // i did use your var for another porpouse
  26.                 // store the original position for the frame
  27.   int endX;
  28.   float startY;
  29.   int endY;
  30.   
  31.   boolean rectClicked = false;  // Brought  inside class so each instance has it own
  32.   ///////////////////////////////////
  33.   
  34.   Boxen() { // a constructor with hard number is not much usefull

  36.     x = 40;
  37.     y = 40;
  38.     bxW = 60;
  39.     bxH = 60;
  40.     speedX = 2;
  41.     startX = x;
  42.     startY = y;
  43.   }



  47.   Boxen(float _x, float _y, int _bxW, int _bxH, float _speed) {
  48.             // this accepts inputs for making diferent instances
  49.     x = _x;
  50.     y = _y;
  51.     startX = x;
  52.     startY = y;
  53.     bxW = _bxW;
  54.     bxH = _bxH;
  55.     speedX = _speed;
  56.   }
  57.   ////////////////////////////////////
  58.   void displayBoxen() {
  59.     fill(#7178E5);
  60.     noStroke();
  61.     rect(x, y, bxW, bxH);
  62.     emptyRect();  /// called form inside the clas to share class vars
  63.   }

  65.   void emptyRect()
  66.   {
  67.     stroke(#3C3D40);
  68.     fill(255, 15);
  69.     rect(startX, startY, bxW, bxH); /// startX used here, we ant the frame to stay..
  70.   }




  75.   void moveBoxen() {       // I did not get the porpouse of counClick so ignored it 
  76.     if (rectClicked) {

  78.       countClick = 1;

  80.       x += speedX;

  82.       if (x>= 400) {

  84.         x = 400;
  85.         speedX = - speedX;
  86.       }

  88.       if (x<=40) {

  90.         x = 40;
  91.         speedX = - speedX;
  92.       }
  93.     }
  94.   }
  95.   /////////// mouseClick function ///////////

  97.   void isMouseClicked() {  

  99.     //////////////////
  100.     // First Square X: Parameters: 42, 99
  101.     // 1st Square Y Parameters: 44, 99
  102.     //
  103.     //
  104.     //
  105.     //
  106.     //////////////////// 
  107.     if ((mouseX > startX) && (mouseX< startX + bxW) &&
  108.          (mouseY >startY) && (mouseY < startY  + bxH)) {

  110.       rectClicked = true;
  111.     }

  113.   }
  114. }/// end class




  119. Boxen myBoxen;
  120. Boxen myBoxen2;
  121. Boxen[] several= new Boxen[10]; // illustrate how to handle a lot...


  124. void setup() {

  126.   size(700, 600);
  127.   background(255);
  128.   smooth();
  129.   noStroke();
  130.   myBoxen = new Boxen();
  131.   myBoxen2 = new Boxen(100, 100, 50, 60, 1.89);
  132.   for (int i = 0 ; i < several.length; i++)
  133.   {
  134.     several[i] = new Boxen (100, 200+ i*40 , 40, 40, i+1 );// i helps change parameters..
  135.   }
  136. }


  139. void draw() {
  140.   background(255);// 
  141.   myBoxen.displayBoxen();
  142.   myBoxen.moveBoxen();

  144.   myBoxen2.displayBoxen();
  145.   myBoxen2.moveBoxen();
  146.   
  147.   for (int i = 0 ; i < several.length; i++)
  148.   {
  149.     several[i].displayBoxen();
  150.     several[i].moveBoxen();
  151.   }
  152. }



  156. void mouseClicked()
  157. {
  158.   myBoxen.isMouseClicked();
  159.   myBoxen2.isMouseClicked();
  160.   for (int i = 0 ; i < several.length; i++)
  161.   {
  162.     several[i].isMouseClicked();
  163.   }
  164.   
  165. }

  167. //////////// other function ////////////


PhiLho
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
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
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

Statistics

  • 9 Replies
  • 666  Views
  • 1 Followers

Tags

No tags available for this topic.

Actions

Related Posts