• fullscreen
• Bubble.pde
• ping_pong.pde
• class Bubble {
color c;
// vertical velocity
float vy;
float x;
float y;
float d;  // diameter

boolean newBall;

Bubble(float x, float y){
c = color(255);
vy = 0;
this.x = x;
this.y = y;
d = 1;
// this is a new ball!
newBall = true;
}

void display(){
// After the ball is created and is released...
/* I've placed this first in the condition as it's the state the ball will spend most time in.
The efficiency increase is probably negligible in this case...  */
if(!newBall){
y = constrain(y, 0, height - d/2);
y = y + vy;
vy += gravity;

if (y >= height-d/2){
vy *= -0.9;
}
}
// Only true when ball first created and mouse is pressed
else {
if (d < 81){
d++;
}
// force release once it reaches maximum size...
else {
newBall = false;
}
}

// drawing the ball is independent of the above condition...
fill(c);
noStroke();
ellipseMode(CENTER);
ellipse(x, y, d, d);
}

}

Bubble [] bubbles = new Bubble[0];
/* I'm making the assumption that 'ac' is in fact gravity which should probably be a global property... */
float gravity = 0.1;

void setup(){
size (300,600);
smooth();
}

void draw(){
background(50);
//display balls
for (int i=0; i<bubbles.length; i++){
bubbles[i].display();
}
}

void mousePressed(){
//append new object directly to the array
bubbles = (Bubble[]) append(bubbles, new Bubble(mouseX, mouseY));
}

void mouseReleased(){
// in the array set the last ball's 'newBall' property to false:
// Note: bubbles.length is the number of balls in the array so the index of the last ball is bubbles.length-1
bubbles[bubbles.length-1].newBall = false;
}

### tweaks (0)

This sketch is running as Java applet, exported from Processing.

Report Sketch

Report for inappropriate content

Your have successfully reported the sketch. Thank you very much for helping to keep OpenProcessing clean and tidy :)

## Ping Pong - example code

6

This is a revision of Shanfan Huang's sketch (http://www.openprocessing.org/visuals/?visualID=9906) demonstrating a better approach to handling object state.

Click to create a ball...

Shanfan Huang
25 May 2010
Thank you for commenting in details!

I found that to figure out a simple logic the most difficult.
The things you revised are indeed the concepts I found most confusing.
eg. whether a variable should be local or global, which function goes first and which to follow, and how to effectively use a boolean variable...etc.

(it actually took me 8 hours non-stop to produce the Ping Pong you saw.... 囧rz... and twisted my neck afterward)
While practice makes improvement for sure, any tips on training my mindset to think differently?
blindfish
25 May 2010
Well - assuming gravity is a constant that will affect all objects equally it should obviously be global; and it's best to follow this rule even if you just have one object: it makes it a lot easier should you want to add more later, or re-use code in another sketch. A property that only affects a specific object (like its position or state) should be local to that object.

The trick to grasp from this example is that an object's state should be stored inside the object (rather than trying to find convoluted workarounds). It's also worth pointing out that the state needn't be a boolean. Whilst these are ideal where only two possible states exist you may sometimes have multiple states - e.g. a button might be 'up', 'over', 'down', 'disabled' etc. - in which case you might use an int property and use a switch() to choose between states, adjusting the int property as necessary under certain conditions.

The best way to learn is to look at example code (e.g. at http://processing.org/learning/ ). Also it's sometimes easier to visualise a problem with pen and paper rather than straining at a screen. If you get really stuck the best option is often to just walk away: take a break! It's amazing how many solutions come to you that way...
Shanfan Huang
28 May 2010
Thanks! Got a lot to think through.... :)
You need to login/register to comment.