Click here to Skip to main content
15,074,987 members
Articles / Multimedia / OpenGL
Posted 1 Feb 2011

Tagged as


22 bookmarked

Interactive Water Effect Multitouch

Rate me:
Please Sign up or sign in to vote.
4.60/5 (10 votes)
1 Feb 2011CPOL2 min read
Interactive Water Effect Multitouch with Tuio Library


I found an excellent article posted in CodeProject: Interactive water effect.

It's pretty good because you can make some wave on a plane by clicking on it with the mouse.

But, I made a multitouch table and I have adapted the program for it. So I share with you my code.

A video example can be found at


The interesting thing (because some of you could say, hmm, why make an article with this) is the library in opensource tuio library (
The tuio library uses UDP to send touch event. For more information about table multitouch, see the example of the implementation of tuio lib C++ in a opengl application.

Using the Code

tuio lib provides a class TuioListener with offer method for touch Event.

The project in msvc is:

In the article, Interactive water effect, the project is an OpenGl program.

To implement the tuiolib, I made a class TuioDemo. This class has a constructor:

TuioDemo(int port)    
 tuioClient = new TuioClient(port);      
 if (!tuioClient->isConnected()) {          

The port is the UDP number for connecting to the software detecting the touch. My TuioDemo extends TuioListener and has to implement the methods:

void addTuioObject(TuioObject *tobj) { }  
void updateTuioObject(TuioObject *tobj) { } 
void removeTuioObject(TuioObject *tobj){ } 
void addTuioCursor(TuioCursor *tcur);
void updateTuioCursor(TuioCursor *tcur);
void removeTuioCursor(TuioCursor *tcur);
void refresh(TuioTime frameTime) { }    

The TuioListener is a design pattern: observer.

All methods ***TuiObject are there when the user puts a fiducial marker attached onto physical objects. So it's not interesting for this article.

The other ***TuioCursor is for touch by finger.

void addTuioCursor(TuioCursor *tcur);      When a finger touch the surface
void updateTuioCursor(TuioCursor *tcur);   When a finger move    
void removeTuioCursor(TuioCursor *tcur);   When a finger untouch. 

The TuioCursor gets some great information like: x_pos and y_pos accessible by methods: getX() and getY().

I made another method of TuioDemo:

void showWave(dmFlotte *flotte)
    std::list<TuioCursor*> lstCursor = tuioClient->getTuioCursors();
    std::list<TuioCursor*>::iterator tcur; 
    for (tcur=lstCursor.begin(); tcur!= lstCursor.end(); tcur++) {                   
        flotte->setWave((*tcur)->getX(),-(*tcur)->getY(),  128);

This updates the plane according to all touches made at one time on the multitouch surface.
the flotte variable (in English slang, it's water) describes all perturbation on water. This method is called in the update of openGl:

void display(void)

Points of Interest

I hope this article can help people with the tuio library.

Please let me know if you have a problem.

I'm searching for a job, so tell me if you are interested in employing me. My email address is charles.vidal ( at ) gmail dot com.


  • 1st February, 2011: Initial post


This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


About the Author

Software Developer (Senior)
France France
No Biography provided

Comments and Discussions

Generalvery cool Pin
woposmail20-Aug-12 0:37
Memberwoposmail20-Aug-12 0:37 
GeneralMy vote of 5 Pin
Manoj Kumar Choubey26-Feb-12 21:13
professionalManoj Kumar Choubey26-Feb-12 21:13 
GeneralN o expected output Pin
PrafullaVedante1-Feb-11 19:37
MemberPrafullaVedante1-Feb-11 19:37 
GeneralRe: N o expected output Pin
GPUToaster™2-Feb-11 0:21
MemberGPUToaster™2-Feb-11 0:21 
You need to have a TUIO compatible I/O device....
A drop of water breaks a rock not by brute force but by patience.

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.