Verlet integration (actionscript 3), in 9 mins woow!

date: 20 Mar, 2010, actionscript: 3 FP10, complexity: complexity level 3.5 of 5complexity level 3.5 of 5complexity level 3.5 of 5complexity level 3.5 of 5complexity level 3.5 of 5, feedback (votes): users score 5 of 5 (285 votes)users score 5 of 5 (285 votes)users score 5 of 5 (285 votes)users score 5 of 5 (285 votes)users score 5 of 5 (285 votes)

Yeah I know, this is maybe one more article speaking about Verlets physics in Flash but I think that it still worth going through it. The reason why I'm writing it is because of the people who wrote me and asked me about how the previous balloon logic was built and how the “Verlet integration” was applied on it (the balloon movement algorithm).

The first time I heard about Verlets was about 10 years ago I think, when I was working on a C++ program building a dynamic animated bridge, at that time all documents and resources I found about Verlets were really confusing and at the end I gave up on it (sometimes people explain simple things in the most complicated way). Last year 2009 in flash on the beach (Brighton, UK) when I was attending the session of Keith Peters, he came with some really good ideas about how to implement the “Verlet Integration” in flash using actionscript 3 in a very, very easy way that makes my imagination fly.

The “Verlet integration” consists in dots and links between these dots where each dot has remembered which was its previous position to determine its next step, the new position of x is equal to x + x – previous_x (same for y) and then each of these dots are associated (grouped) by pairs that try to keep same distance between each other as they were when the program started.

Does it sound simple? It's because It is really simple! This tutorial explains step by step how Verlets physics works in flash (actionscript 3, flash player 10). In this example I'm creating a grid of 30 x 25 points, linking them by pairs, applying some gravity on each dot and making the stickers do the dirty work.

Take a look on this video; the whole practice doesn't take more than 9 minutes, try to do it by yourself, it is really simple to follow, all you need to have is the Flash Develop and the Open Source Flex SDK (you don't have to pay for any of them)

Here is the compiled swf which looks like a cloth, click and drag for moving it around.

download sourcecode - feel free to ask any question about this code.

download video tutorial - 168MB (high definition 720p), also available on youtube:

date: 21 Nov 2012 - 23:17:12, published by jackie
Hi: Your tutorials is fantastic! but i can't download the video tutorial either from your links or youtube,could you upload another link? really appreciate that!
date: 25 Dec 2010 - 03:47:31
You should monetize your blog; for, a lot of developers visit your blog, and that could be translating into additional income for you.
date: 20 Jun 2010 - 15:12:39, published by Kvasir
Interesting ... :> Heard about Verlet, but never tried to use it, and now... It is just simple :D Would be cool to see more on this topic :)
date: 07 Jun 2010 - 01:10:44, published by palani
Nice work
date: 12 Apr 2010 - 05:50:45, published by MAX
Veryyyyyyyyyyyyyyyyy Cool
date: 02 Apr 2010 - 13:12:11, published by bosworth99
Very very cool. Simple mathematics presenting wonderful effects. excellent work, as usual!
date: 29 Mar 2010 - 23:08:36, published by kilomanX
wow, this "verlet integration" looks very interesting. And once again your work is looks very cool.
date: 25 Mar 2010 - 21:03:47, published by rasputin
very nice!
date: 25 Mar 2010 - 20:04:02, published by pinkninja
it's unbelievable what this simple code does... quite cool, cheers!