Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles / multimedia / OpenGL

Interactive Water Effect Multitouch

4.60/5 (10 votes)
1 Feb 2011CPOL2 min read 39.7K   2.4K  
Interactive Water Effect Multitouch with Tuio Library

Introduction

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 http://www.youtube.com/watch?v=EkZDBLxMX9U.

Background

The interesting thing (because some of you could say, hmm, why make an article with this) is the library in opensource tuio library (http://www.tuio.org/?cpp).
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:

projetscreenshot.jpg
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:

C++
TuioDemo(int port)    
 {             
 tuioClient = new TuioClient(port);      
 tuioClient->addTuioListener(this);       
 tuioClient->connect();     
 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:

C++
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.

C++
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:

C++
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:

C++
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.

History

  • 1st February, 2011: Initial post

License

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