Connect ellipses created in a class with one other

Programming Questions

Ivan Cruz

Connect ellipses created in a class with one other

in Programming Questions • 10 months ago

Hey guys,

I am trying to make a quick experiment. I created a class that generates a random sized circles every time you click the screen. I want to implement connecting the circles to one other once they're on screen. So far I've managed to connect them to the center one but I want to implement a connection amongst them all or at least the previous one.

I tried doing pmouseX, pmouseY as I thought this location might only get saved on click since I put it inside the mouseReleased function. Now I know that it's always updating!

Any thoughts? Here's my code, thanks and happy thanksgiving!

ArrayList circleCollection;
int originX = 400;
int originY = 250;
float prevX, prevY;
void setup(){
size(800,500);
smooth();
frameRate(30);
//DEFINE ARRAY LIST
circleCollection = new ArrayList();
}
void draw(){
background(240);
fill(0);
for(int i = 0; i < circleCollection.size(); i++){
Circle myCircle = (Circle) circleCollection.get(i);
myCircle.display();
}
ellipse(originX, originY, 10,10);
}
void mouseReleased(){
Circle myCircle = new Circle(mouseX, mouseY, random(1,10), pmouseX, pmouseY);
circleCollection.add(myCircle);
}
class Circle{
//CLASS VARIABLES
float xPos, yPos, diameter, prevX, prevY;
//CONSTRUCTOR
Circle(float _xPos, float _yPos, float _diameter, float _prevX, float _prevY){
xPos = _xPos;
yPos = _yPos;
diameter = _diameter;
prevX = _prevX;
prevY = _prevY;
}
void display(){
ellipse(xPos, yPos, diameter, diameter);
line(originX, originY, xPos, yPos);
line(prevX, prevY, xPos, yPos);
}
}

I'm trying to create a sketch that allows you to create posters similar to this one:

http://betweenstudio.tumblr.com/post/30838767476/ethicsinadvertising-by-amanda-mocci

Replies(3)

amnon.owed

Re: Connect ellipses created in a class with one other

10 months ago

How about this?

Adapted Code

ArrayList <Circle> circleCollection = new ArrayList <Circle> ();
void setup(){
size(800,500);
circleCollection.add(new Circle(width/2, height/2, 10));
smooth();
}
void draw(){
background(240);
noFill();
beginShape();
for(Circle c : circleCollection) {
vertex(c.x, c.y);
}
endShape();
fill(0);
for(Circle c : circleCollection) {
c.display();
}
}
void mousePressed(){
circleCollection.add(new Circle(mouseX, mouseY, random(1,10)));
}
class Circle extends PVector {
Circle(float _x, float _y, float _z){
super(_x, _y, _z);
}
void display(){
ellipse(x, y, z, z);
}
}

Ivan Cruz

Re: Connect ellipses created in a class with one other

10 months ago

Thanks for your answer once again! I noticed last time you helped me out that you declare arrayLists and for loops different (shorter) Would you happen to have a reference on about your way of doing this. I'd like to fully wrap my head around it.

If you could also explain how you did it a bit would be awesome. I just saw your kinect/physics tutorial, looks amazing, I'll give it a try once I get some more basic processing down.

Is there any resources you might have to keep exploring processing. I'm reading the Processing book by the creators of Processing and Daniel Shiffmans learning processing simultaneously. My background is design/animation and I'm really interested in Processing as a platform to transfer all that knowledge I have into interactive work.

Also as a final note, what do you use to code? I noticed your interface was a bit different than processing! Thanks!

amnon.owed

Re: Connect ellipses created in a class with one other

10 months ago

See this page: http://www.javacodegeeks.com/2011/04/java-generics-quick-tutorial.html

You can also look it up with search terms: java generics, for-each loop

To exlain the above code in words: the Circle class extends the PVector class. So the Circle is basically a kind of PVector, except that it also has a display method. An ArrayList contains objects only of the type Circle (allowing the shorting for-each loop). We start with one Circle in the middle. Mousepresses can add more Circles with a random diameter stored in the PVector's z. In the draw loop we do two things. First use all the xy coordinates of the Circles/PVectors in a begin/endShape, this Shape has noFill() so it only displays the lines between consecutive points. Second go over all the circles and display them with xy coordinates and z diameter.

Those two books are a good start. Another good one is Generative Design, which is also the most visually appealing Processing book to date. There are many, many good resources on Processing and programming in general. Very useful are the current and previous forums. Specific resources depends on specific interests or goals.

I use the regular PDE, don't know where you saw a different interface.

Top Reply