Processing Forum

Interaction between "blobs" with Box2D

[0 Replies]
- 12-Jun-2011 04:24 AM
- Forum: Contributed Library Questions
Hey all,

I am happily playing around and trying to further the " blob" example from Daniel Shiffman's Box2d library for Processing.

What I am trying to do is create two blobs that can interact(collide) with each other. I am able to easily create two different blob objects yet they seem to render on different layers and are not influenced by each other.

My two objects:
2. import pbox2d.*;
4. import org.jbox2d.collision.shapes.*;
5. import org.jbox2d.common.*;
6. import org.jbox2d.dynamics.*;
7. import org.jbox2d.dynamics.joints.*;
9. // A reference to our box2d world
10. PBox2D box2d;
12. // A list we'll use to track fixed objects
13. ArrayList<Boundary> boundaries;
15. // Our "blob" objects
16. Blob blob;
17. Blob blob2;
19. void setup() {
20. size(400,300);
21. smooth();
23. // Initialize box2d physics and create the world
24. box2d = new PBox2D(this);
25. box2d.createWorld();
27. // Add some boundaries
28. boundaries = new ArrayList<Boundary>();
29. boundaries.add(new Boundary(width/2,height-5,width,10));
30. boundaries.add(new Boundary(width/2,5,width,10));
31. boundaries.add(new Boundary(width-5,height/2,10,height));
32. boundaries.add(new Boundary(5,height/2,10,height));
34. // Make new blobs
35. blob = new Blob();
36. blob2 = new Blob();
38. }
40. void draw() {
41. background(255);
43. // We must always step through time!
44. box2d.step();
46. // Show the blobs!
47. blob.display();
48. blob2.display();
50. // Show the boundaries!
51. for (Boundary wall: boundaries) {
52. wall.display();
53. }
55. // Here we create a dynamic gravity vector based on the location of our mouse
56. PVector g = new PVector(mouseX-width/2,mouseY-height/2);
57. g.normalize();
58. g.mult(10);
60. }
Blob class:
2. // The Nature of Code
3. // <http://www.shiffman.net/teaching/nature>
4. // Spring 2010
5. // PBox2D example
7. // A blob skeleton
8. // Could be used to create blobbly characters a la Nokia Friends
9. // http://postspectacular.com/work/nokia/friends/start
11. class Blob {
13. // A list to keep track of all the points in our blob
14. ArrayList<Body> skeleton;
16. float bodyRadius; // The radius of each body that makes up the skeleton
17. float radius; // The radius of the entire blob
18. float totalPoints; // How many points make up the blob
21. // We should modify this constructor to receive arguments
22. // So that we can make many different types of blobs
23. Blob() {
25. // Create the empty
26. skeleton = new ArrayList<Body>();
28. // Let's make a volume of joints!
29. ConstantVolumeJointDef cvjd = new ConstantVolumeJointDef();
31. // Where and how big is the blob
32. Vec2 center = new Vec2(random(100,width-100),random(100,height/2));
33. radius = random(30,60);
34. totalPoints = 40;
35. bodyRadius = 1;
38. // Initialize all the points
39. for (int i = 0; i < totalPoints; i++) {
40. // Look polar to cartesian coordinate transformation!
41. float theta = PApplet.map(i, 0, totalPoints, 0, TWO_PI);
42. float x = center.x + radius * sin(theta);
43. float y = center.y + radius * cos(theta);
45. // Make each individual body
46. BodyDef bd = new BodyDef();
47. bd.fixedRotation = true; // no rotation!
48. bd.position.set(box2d.coordPixelsToWorld(x,y));
49. Body body = box2d.createBody(bd);
51. // The body is a circle
52. CircleDef cd = new CircleDef();
53. cd.radius = box2d.scalarPixelsToWorld(bodyRadius);
54. cd.density = 1.0f;
55. // For filtering out collisions
56. cd.filter.groupIndex = -2;
58. // Finalize the body
59. body.createShape(cd);
60. // Add it to the volume
61. cvjd.addBody(body);
62. // We always do this at the end
63. body.setMassFromShapes();
65. // Store our own copy for later rendering
66. skeleton.add(body);
67. }
69. // These parameters control how stiff vs. jiggly the blob is
70. cvjd.frequencyHz = 12.0f;
71. cvjd.dampingRatio = 2.0f;
73. // Put the joint thing in our world!
74. box2d.world.createJoint(cvjd);
76. }
79. // Time to draw the blob!
80. // Can you make it a cute character, a la http://postspectacular.com/work/nokia/friends/start
81. void display() {
83. // Draw the outline
84. beginShape();
85. fill(150);
86. noStroke();
87. strokeWeight(1);
88. for (Body b: skeleton) {
89. Vec2 pos = box2d.getBodyPixelCoord(b);
90. vertex(pos.x,pos.y);
91. }
92. endShape(CLOSE);
95. // Draw the individual circles
96. /*for (Body b: skeleton) {
97. // We look at each body and get its screen position
98. Vec2 pos = box2d.getBodyPixelCoord(b);
99. // Get its angle of rotation
100. float a = b.getAngle();
101. pushMatrix();
102. translate(pos.x,pos.y);
103. rotate(a);
104. fill(175);
105. stroke(0);
106. strokeWeight(1);
107. ellipse(0,0,bodyRadius*2,bodyRadius*2);
108. popMatrix();
109. }*/
111. }
Boundary class:

http://www.shiffman.net/itp/classes/nature/box2d_2010/blob/Boundary.pde

I know it's probably right under my nose, yet if I could get some advice I'd really appreciate it!

Thanks

Boxwrap2d complex shape construction

[1 Reply]
- 01-Jun-2011 10:59 PM
- Forum: Contributed Library Questions
Hello all,

My latest experiment is delving into using the boxwrap2d library. I have had, and have been attempting, an idea to create a custom physics object (see image) in which 4 circles are strung together by lines, which all have physics properties.

I am just wondering how I can create such lines that will work as physics objects that shrink and expand as the circles move.

In a way it is similar to using Distance Joints to constrain each circle, yet the lines that join the circles would work as physics objects, and interact with other shapes.

The reason for this is that I am wanting to, for example, using it to contain other objects, circles rects etc it can be picked up and bounced around the screen.

Any ideas in how I can pursue this? Many thanks.

Mask a pattern inside a shape, using only PGraphics

[2 Replies]
- 25-May-2011 10:15 PM
- Forum: Programming Questions
Hello all,

Just got this small problem I have been trying to work out.

I want to generate a pattern, in this example simple hatching lines, as a PGraphics obj and then mask them with a shape, currently a Rect, that is another PGraphics obj. I have been playing with blend() and a few things yet I haven't been able to get anything to work well.

Basically something to this likeness, is what I am trying to do:

Any ideas?
2. PGraphics canvas;
3. PGraphics pg;
6. void setup() {
7. size(500, 500,P2D);
8. canvas = createGraphics(500, 500, P2D);
9. pg = createGraphics(500, 500, P2D);
11. pg.beginDraw();
12. pg.background(0);
13. pg.stroke(255);
14. //pg.fill(255);
15. pg.strokeWeight(2);
16. for(int i = 0; i < 800; i = i + 10){
17. pg.line(0+i, 0, 500+i, 500);
18. pg.line(0-i, 0, 500, 500+i);
19. }
21. pg.endDraw();
23. canvas.beginDraw();
24. canvas.background(0);
25. canvas.noStroke();
26. canvas.rect(width/2,height/2,200,200);
27. canvas.blend(pg,0,0, width,height, 0,0,width,height,MULTIPLY);
28. canvas.endDraw();
31. }
33. void draw() {
34. image(canvas,0,0);
35. }

How to make text into a rigid body?

[1 Reply]
- 02-Jan-2011 06:12 PM
- Forum: Programming Questions
Hello all,

I have been conducting a few experiments with the fisica and geomerative libraries to try and create rigid bodies that are infact made up of single characters of text. I first started by using plain jpegs, which if course just built a bounding box around the entire image, and then looked into SVG's but the examples given for SVG usage in fisica+geomerative seem to be very buggy and inconsistent, with the code executing fine, but no images appeared on the canvas and the error
1. Found invalid polygon,
  sides are too close to parallel.
  
  Didn't add unusable polygon. Dumping vertices:
  
  float xv[] = {-0.039218f,-0.039218f,-0.039218f,};
  float yv[] = {0.412512f,0.111878f,0.412512f,};
  Found invalid polygon,
  sides are too close to parallel.
continually returned.

As a small example I am basically trying to make a bounding box go around the contour of a character. Such as "A". So when added to a physics engine and say fall on it's side the diagonal of the A character would be touching the ground, and not simply appear to have been rotated 90 degrees.

I have tried searching around the forums, and openprocessing.org trying to gain an idea on how to achieve such a thing but to no avail.

If anyone would have any previous attempted or advice to get me started. Cheers.

Ways to mask text with shapes?

[6 Replies]
- 31-Dec-2010 03:15 AM
- Forum: Programming Questions
Hello all,

I have this little animation here that animates in a looped seamless pattern. I have text, colored white, in the middle of the canvas that the looped shapes pass over. What I am trying to work out is when the white bars pass over the text it masks it to reveal the same text but black.

I have looked into PGraphics, PShape, and PImage, and it seems apparent that masking it only possible with a combination of PGraphics and PImage. Any ideas on how I could do this?

Here is a graphic example of what I'm trying to achieve.
1. drawLine wob1;
  drawLine wob2;
  drawLine wob3;
  drawLine wob4;
  drawLine wob5;
  PFont helv;
  drawText title;
  
  void setup() {
  
  //frame.setResizable(true);
  size(320, 480);
  smooth();
  frameRate(50);
  
  wob1 = new drawLine(0);
  wob2 = new drawLine(200);
  wob3 = new drawLine(400);
  wob4 = new drawLine(600);
  wob5 = new drawLine(800);
  
  title = new drawText();
  
  }
  
  void draw() {
  
     background(#000000);
  
     wob1.increment();
     wob1.display(#ffffff);
     wob1.pos();
     wob1.boundary();
  
     wob2.increment();
     wob2.display(#ffffff);
     wob2.boundary();
  
     wob3.increment();
     wob3.display(#ffffff);
     wob3.boundary();
  
     wob4.increment();
     wob4.display(#ffffff);
     wob4.boundary();
  
     wob5.increment();
     wob5.display(#ffffff);
     wob5.boundary();
  
     title.rendertitle(#ffffff;
  
  }
  
  class drawLine {
  
  int x = -480;
  int y = 0;
  int count;
  
  drawLine(int offset) {
  
     this.x = this.x + offset;
  
  }
  
  void increment() {
  
     this.x += 3;
     this.y += 4;
  
  }
  
  void display(int col) {
  
  //noStroke();
  fill(col);
  //translate(0,0);
  rectMode(CENTER);
  rotate(-PI/3.0);
  rect(x,y,100,3000);
  rotate(PI/3.0);
  
  }
  
  void pos() {
  
     println(this.x);
  
     //if(this.x >= -218 && this.x <= 207){ colr = #000000; } else { colr = #ffffff; }
  
  }
  
  void boundary() {
  
     if(this.x > 520) {
  
       this.x = -480; this.y = 0;
     }
  
  }
  
  }
  
  class drawText {
  
  drawText() {
  
  helv = loadFont("Helvetica-Bold.vlw");
  
  }
  
  void rendertitle(int colr) {
     fill(colr);
     textFont(helv, 30);
     text("Text goes here", width/2, height/2, 240, 50);
     }
  
  }

Activity Trend