TUIO and flash quick start guide.

Congratulations, either you have an in depth knowledge of TUIO, or you’ve decided to jump right in.

Here’s a high level breakdown to get up and running as fast as possible.

• Grab an emulator or a touch tracker.

  Tongseng is a good tracker for testing on the mac. It takes touch events on the native touchpad of a Mac and converts them to UDP TUIO data. Start up the tracker.

• Grab a LocalConnection UDP bridge.

  Bridges like this one take the UDP data and convert it to native flash LocalConnection. Startup the gateway.

• Create a new project.

  If you are using Flash, Flash Builder, FDT, or Flash develop, you first need to startup a new project. This could mean a new FLA, a new base document class. Try to keep it tidy of course.

• Add in some libraries.

  Go grab the Bubblebird library and addit to your project. If you see errors or get errors on compile about TouchEvents, see if they are the native TouchEvents that are dispatched requiring Flash player 10.1. If Flash player 10.1 isn’t an option go in an comment out all the lines that dispatch a flash.events.TouchEvent, it doesn’t take long to do a find.

• Create a document class.

  When the application has been added to stage you’ll want to add in code that looks like the following:

  var connector:IOSCConnector = new LCConnector();
  var tuioClient:TuioClient = new TuioClient(connector);
  TuioManager.init(this.stage, tuioClient);
  var tuioManager:TuioManager = TuioManager.getInstance();
  
  TuioDebug.init(this.stage);
  var tuioDebug:TuioDebug = TuioDebug.getInstance();
  tuioClient.addListener(tuioDebug);
  

  This is the most basic startup of the TuioManager that includes setting up the TuioDebug for seeing point data on the screen and connecting with a LocalConnection connector.

  Another good example is from bubblebird

• Test the SWF.

  Run the SWF, and run your fingers over the track pad. Moving in the upper left should find a debug point in the upper left of your SWF, move it around the screen you should see that circle move. Try multiple fingers. If you don’t see a circle with x, y and id data to the right of it then go back and retrace your steps. Perhaps confirm the tracker and bridge are running and that firewalls are not blocking port 3333.

• Add MouseEvent listeners.

  Go into the TuioManager and change the variable: private var _dispatchMouseEvents:Boolean = true;

  Add Sprites that have event listeners for MouseEvents (we recommend MOUSE_DOWN, MOUSE_MOVE, MOUSE_UP, MOUSE_CLICK; depending on the situation)

  Test your app to see if the listener functions fire on the MouseEvents.

• Off to the races.

  Now it’s up to you to take a look at how touch data is being gathered (camera, laser, kinect, etc) and create an experience. You might try a simple application or something more complex.