Elastic Collision

29 July 2007
5 Comments →

A small tutorial on how to create bouncing balls with ActionScript source code. A couple of years back I was creating some interactive sites using bouncing balls as navigation. These needed to behave in a believable manner so I spent some time looking at rigid body dynamics code.

Rigid Body Dynamics

There are many approaches to solids-based simulation on a computer. The most realistic involve running a simulation in relatively large slices of time (say 1/60 second) until a collision occurs, and then ‘rewinding’ the simulation in smaller slices of time until the exact moment of impact. This ensures that no objects are ever seen to overlap, and the simulation then continues from the exact moment at which they touch. This is computationally intensive and a little overkill for what I wanted.

The second method is a little more ‘relaxed’ and doesn’t strive for perfection. You can get a reasonable result using springs to resolve collisions.

Elastic Collision

I already had some spring code so I hooked up a system as follows;

collision.gif

Figure 1 is a system with balls bouncing around under gravity. The system checks whether two balls overlap. Figure 2 shows what happens when two balls overlap. All we have to do is measure the overlap. We temporarily create a spring which is attached to the centre of each ball between a and b.

collision-2.gif

The spring’s resting length is then set such that, when fully relaxed, it would allow the balls to touch exactly. This means that the spring is under compression; it tries its best to get back to its resting length and in doing so forces the balls apart as shown in Figure 3.

Nervous Energy

This worked really well for what I needed as the balls bounce around nicely and it’s a lot of fun. However the lack of precision shows when you try and contain the balls too tightly. The system becomes a little unstable as the balls try to break free from each other but are constrained by the walls.

However the same code is used the in Magnetic example which is able to resolve itself as there is plenty of space for the balls to move into.

Download

[ZIP] Download Elastic Collision source code

Example

Click and drag to move the balls around


Comments

5 comments so far
Leave a comment →

Hey Simon!

That’s great! Check out Yugop’s approach at http://yugop.com/

Og2t
23 April 2008

1


Simply PERFECT !!! very good Design,
nice mechanism ! PRG for reference
good Job ! when for Iphone ?
I will be there ….

lamberto
7 August 2008

2


about my previous request for WC for Iphone…I intendend to find it in App Store…..easy and I am happy also to pay…!
Ciao dall’Italia

lamberto
7 August 2008

3


Hi lamberto – yes good idea would be nice on iPhone. I have applied for a license to publish in the Apple AppStore, but who knows when or if I will get a license? If I do, I will let you know on the site. Best, Simon

Simon
7 August 2008

4


Maybe adding a little damping would kill the nervous movement? Spring + damper are
always more realistic than just a spring.

Moritz
17 August 2008

5


Leave a comment

(required)
(will not be published) (required)