Demonstration of Gesture APIs in AIR 2

I don’t have a multi-touch computer (yet), but I do have a MacBook with a multi-touch trackpad which means I can write AIR 2 applications that incorporate gestures. The video below demonstrates a few of the new gesture APIs in AIR 2:

The code below shows how to indicate that you want to receive gesture events (as opposed to multi-touch, or no touch events at all), and registers for zoom, rotate, and pan gesture events (the watch variable refers to a Sprite which contains the bitmap image of the watch):

Multitouch.inputMode = MultitouchInputMode.GESTURE;
watch.addEventListener(TransformGestureEvent.GESTURE_ZOOM, onZoom);
watch.addEventListener(TransformGestureEvent.GESTURE_ROTATE, onRotate);
watch.addEventListener(TransformGestureEvent.GESTURE_PAN, onPan);

The three functions below show responding to each of the gesture events:

private function onZoom(e:TransformGestureEvent):void
{
var watch:Sprite = e.target as Sprite;
watch.scaleX *= e.scaleX;
watch.scaleY *= e.scaleY;
}

private function onRotate(e:TransformGestureEvent):void
{
var watch:Sprite = e.target as Sprite;
watch.rotation += e.rotation;
}

private function onPan(e:TransformGestureEvent):void
{
var watch:Sprite = e.target as Sprite;
var watchBitmap:Bitmap = watch.getChildAt(0) as Bitmap;
watchBitmap.x += e.offsetX;
watchBitmap.y += e.offsetY;
}

For much more information on how multi-touch and gestures work in both AIR 2 and Flash Player 10.1 (including OS and hardware support, which gestures are supported where, and a thorough review of the APIs), and to download sample code, see Multi-touch and Gesture Support on the Flash Platform. Or, if you just want to see the code for this sample, you can download it here.

9 Responses to Demonstration of Gesture APIs in AIR 2

  1. Philippe says:

    AIR rocks!

  2. TransformGestureEvent!! go adobe!

  3. Bryan says:

    Christian,Do you know of or recommend any multi-touch/gesture capable hardware (that works with AIR 2 specifically)? I found this developer kit from 3M: http://solutions.3m.com/wps/portal/3M/en_US/TouchSystems/TouchScreen/Technologies/Multi-touch/ but it looks like using it with OSX and AIR would require writing your own drivers at this point. Would love to start developing multi-touch kiosk prototypes using AIR on OS X. I can obviously get started much like your demo with the MacBook trackpad, but hope to be able to demo on the real thing. Any hardware suggestions would be much appreciated. Thanks for the video demo!

  4. Cedric says:

    I’m speechless… It’s seems so easy to use…

  5. Don Kerr says:

    Have you tried to open this example inside Flash Builder 4 Beta with Air 2 SDK overlay? I get this error1046: Type was not found or was not a compile-time constant: TransformGestureEvent. ZoomExample.as line 86Is their a code change to make it work in FB4 Beta 2? Or is their something wrong in my SDK config? One of the voice examples works ok. But, the multi-touch events don’t see to be found. Strange.Thanks!Don KerrManager, Space City Adobe User Group

  6. Yen Pei says:

    Don,I face the same problem too. Have u managed to solve that?Regards,YEN PEI

  7. Don Kerr says:

    Figured out the above issue. The instructions for installing Air 2 Overlay on an existing Flex SDK did not work on Snow Leopard. Finally had to copy files one-by-one to get it to work. Now I’m rockin’ with Air 2! Great job Adobe!Thanks Christian for all your great examples!Don Kerr

  8. Chad Upton says:

    I noticed the download link wasn’t working. But, the AS files are available at the other link above. Or, you can download the .AIR files and code near the bottom of this page:
    http://www.adobe.com/devnet/air/samples_actionscript.html