Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Multi-touch development with Flash and Flex

7,999 views

Published on

This is my presentation that I during webinar session. Link to my webinar recording: http://my.adobe.acrobat.com/p84912063/

Published in: Technology
  • Be the first to comment

Multi-touch development with Flash and Flex

  1. 1. Multi-touch development in Flash and Flex Piotr Walczyszyn | Platform Evangelist © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.
  2. 2. About Me h p://riaspace.net h p://twi er.com/pwalczyszyn © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 2
  3. 3. Agenda   Touch events vs. gestures   Supported platforms and hardware   New Flash touch API’s   New Flash gesture API’s   Demo   Q&A © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 3
  4. 4. Touch events vs. gestures   Touch events are raw inputs   Gestures are combinations of multiple touch events © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 4
  5. 5. 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 © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 5
  6. 6. WHAT’S NEW? © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 6
  7. 7. 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 © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 7
  8. 8. 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 © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 8
  9. 9. TOUCH EVENTS © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 9
  10. 10. New Flash touch API’s   TouchEvent.TOUCH_BEGIN   TouchEvent.TOUCH_END   TouchEvent.TOUCH_MOVE   TouchEvent.TOUCH_OUT   TouchEvent.TOUCH_OVER   TouchEvent.TOUCH_ROLL_OUT   TouchEvent.TOUCH_ROLL_OVER   TouchEvent.TOUCH_TAP © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 10
  11. 11. New Flash touch API’s   Touch event properties   touchPointID: A unique identi cation number assigned to the touch point.   isPrimaryTouchPoint: Indicates whether the rst 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.   sizeX: e width of the contact area.   sizeY: e height of the contact area.   New touch functions on Sprite   startTouchDrag: Drags the speci ed sprite on a touch-enabled device.   stopTouchDrag: Ends the startTouchDrag() method. © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 11
  12. 12. GESTURE EVENTS © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 12
  13. 13. New Flash gesture API’s   GestureEvent.GESTURE_TWO_FINGER_TAP   PressAndTapGestureEvent.GESTURE_PRESS_AND_TAP   TransformGestureEvent.GESTURE_PAN   TransformGestureEvent.GESTURE_ROTATE   TransformGestureEvent.GESTURE_SWIPE   TransformGestureEvent.GESTURE_ZOOM © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 13
  14. 14. Gesture events properties   TransformGestureEvent:   offsetX and offsetY indicate the horizontal or vertical translation of the display object since the previous gesture event.   scaleX and scaleY indicate 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:   tapLocalX and tapLocalY indicating the horizontal or vertical coordinate at which the event occurred relative to the containing interactive object.   tapStageX and tapStageY indicate the horizontal or vertical coordinate at which the tap touch occurred in global Stage coordinates. © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 14
  15. 15. DEMO © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 15
  16. 16. Credits and Links   Credits to Ryan Lee for le ing me use icons from h p://gesturecons.com   Christian Cantrell’s article on: h p://www.adobe.com/devnet/ ash/articles/multitouch_gestures.html   ASDocs: h p://help.adobe.com/en_US/FlashPlatform/beta/reference/actionscript/3/ ash/ui/Multitouch.html © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 16
  17. 17. Q&A © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential. 17
  18. 18. © 2010 Adobe Systems Incorporated. All Rights Reserved. Adobe Con dential.

×