Touch events are similar to mouse events, except that you can receive and track more than one of them at once, and touch events do not support mouse-specific concepts such as hovering.Gestures are the synthesis of multiple touch events into a single event. Examples of gestures include "pinching" an image to scale it, or "swiping" to delete something from a list. Some platforms explicitly support the concept of gestures, reducing the amount of work that a developer needs to do in order to detect and react to them, and some platforms require developers to capture multiple touch events and synthesize them into gestures themselves. The Flash Platform automatically synthesizes the most common gestures across different platforms, but also provides developers with the APIs necessary to synthesize their own.
Michaël CHAIZE | Platform Evangelist Flex and Multi-touch applications
About Me 2 http://codemoiunmouton.wordpress.com http://twitter.com/mchaize
Multi-touch facts 3 First Multi-touch display developed by Nimish Mehta. Murray Hill’s paper on touch-screen based interfaces. 1991 Pierre Wellner’s paper on multi-finger and pinching motions. 2006 Jeff Han presents multi-touch sensing at TED. 2007 Apple annouces the iPhone. 2007 MSFT announces Surface. 2009 Windows 7 launches with full multi-touch support. 2009 Apple adds multi-touch gestures to MacBooks. 2009 Adobe adds multi-touch and Gestures to Flash/AIR.
Two modes in Flash : Touch events vs. gestures Touch events are raw inputs Gestures are combinations of multiple touch events 4
Supported platforms and hardware Supported by Flash Player 10.1 and AIR 2.0 Touch Windows 7 and later iPhone OS 3.0 and later Gestures Windows 7 and later Macs running Mac OS X 10.5.3 and later (with multi-touch trackpads) At this time only AIR applications (not swf content in the browsers) iPhone OS 3.0 and later Android support Multi-touch 5
What do we get with FP10.1 and AIR 2.0? flash.ui.Multitouch flash.ui.MultitouchInputMode flash.events.TouchEvent flash.events.GestureEvent flash.events.GesturePhase flash.events.TransformGestureEvent flash.events.PressAndTapGestureEvent 7
Multitouch API Multitouch.inputMode MultitouchInputMode.GESTURE: Use this mode if you want multi-touch events synthesized into gesture events. MultitouchInputMode.TOUCH_POINT: Use this mode if you are interested only in touch events and no mouse or gesture events. MultitouchInputMode.NONE: Use this mode if you want to handle all touches as mouse events. Multitouch.maxTouchPoints Multitouch.supportedGestures Returns Vector.<String> Multitouch.supportsGestureEvents Multitouch.supportsTouchEvents 8
New Flash touch API’s TouchEvent.TOUCH_BEGIN TouchEvent.TOUCH_END TouchEvent.TOUCH_MOVEThe user is moving his finger across the screen TouchEvent.TOUCH_OUTA touch point has left an InteractiveObject(fire for each child of the InteractiveObject) TouchEvent.TOUCH_OVER TouchEvent.TOUCH_ROLL_OUTA touch point has left an InteractiveObject(don’t fire for each child, act as a container) TouchEvent.TOUCH_ROLL_OVER TouchEvent.TOUCH_TAPA quick TOUCH_BEGIN and TOUCH_END has occured 10
New Flash touch API’s Touch event properties touchPointID: A unique identification number assigned to the touch point. isPrimaryTouchPoint: Indicates whether the first point of contact is mapped to mouse events. pressure: A value between 0.0 and 1.0 indicating force of the contact with the device (platform and device specific). sizeX: The width of the contact area. sizeY: The height of the contact area. New touch functions on Sprite startTouchDrag: Drags the specified sprite on a touch-enabled device. stopTouchDrag: Ends the startTouchDrag() method. 12
Gesture events properties TransformGestureEvent: offsetXand offsetYindicate the horizontal or vertical translation of the display object since the previous gesture event. scaleXand scaleYindicate the horizontal or vertical scale of the display object since the previous gesture event. rotation indicates the current rotation angle, in degrees, of the display object along the z-axis since the previous gesture event. PressAndTapGestureEvent: tapLocalXand tapLocalYindicating the horizontal or vertical coordinate at which the event occurred relative to the containing interactive object. tapStageXand tapStageYindicate the horizontal or vertical coordinate at which the tap touch occurred in global Stage coordinates. 15
16 DEMO Gestures with Flex on MAC Touch Events with Flex on Windows 7 Gestures with Flash CSx and Device Central CSx
Credits and Links Credits to Ryan Lee for letting me use icons from http://gesturecons.com Christian Cantrell’s article on:http://www.adobe.com/devnet/flash/articles/multitouch_gestures.html ASDocs:http://help.adobe.com/en_US/FlashPlatform/beta/reference/actionscript/3/flash/ui/Multitouch.html 17