Multi Touch presentation

5,456 views
5,359 views

Published on

Published in: Technology
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
5,456
On SlideShare
0
From Embeds
0
Number of Embeds
25
Actions
Shares
0
Downloads
204
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

Multi Touch presentation

  1. 1. Multi-touch development in Flash and Flex
  2. 2. About Me Senthil kumar .S Senior RIA Engineer http://sensaran.wordpress.com
  3. 3. Agenda Flow of Input from user to Run Time Supported Platform and Hardware Touch Events vs gestures The API for handling user interaction New Flex Touch Events New Flex Gesture Events Code
  4. 4. Flow of Input from user to Run Time User Device Operating System Application Flash Run Time
  5. 5. Supported Platforms and hardware Supported by Flash Player 10.1 and Air 2.0 Touch Windows 7 and later. Mac OS X 10.5.3 and later iphone OS 3.0 and later. Android 2.2 , Windows 6.5 Gesture Windows 7 and later. Mac OS X 10.5.3 and later iphone OS 3.0 and later. Android 2.2 , Windows 6.5
  6. 6. What is New For MultiTouch?
  7. 7. Touch events vs gestures • Touch events Input with a single point device • Gesture events One or more touch for eg,user rotates the rectangle using two fingers or zoom
  8. 8. Important concepts and terms In Touch Discovery API. Touch event . Touch point. Multi touch event. Gesture event. Phases. Stylus. Press-and-tap .
  9. 9. • Touch Events
  10. 10. TouchEvent class • 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
  11. 11. • Gesture Events
  12. 12. Gesture event types. • TransformGestureEvent.GESTURE_PAN • TransformGestureEvent.GESTURE_ROTATE • TransformGestureEvent.GESTURE_SWIPE • TransformGestureEvent.GESTURE_ZOOM
  13. 13. Multitouch and gesture support • Windows 7 TransformGestureEvent.GESTURE_PAN TransformGestureEvent.GESTURE_ROTATE TransformGestureEvent.GESTURE_ZOOM PressAndTapGestureEvent.GESTURE_PRESS_AND_TAP • Mac OS X 10.5.3 and later + iPhone TransformGestureEvent.GESTURE_PAN TransformGestureEvent.GESTURE_ROTATE TransformGestureEvent.GESTURE_SWIPE TransformGestureEvent.GESTURE_ZOOM • Windows Mobile 6.5 TransformGestureEvent.GESTURE_PAN
  14. 14. • DEM0 CODE import mx.core.UIComponent; import flash.ui.Multitouch; import flash.ui.MultitouchInputMode public function init( ) :void { // check the Status of the Touch Input.... if(Capabilities.touchscreenType == TouchscreenType.NONE){ Multitouch.inputMode = MultitouchInputMode.NONE; } if(Capabilities.touchscreenType == TouchscreenType.FINGER) { Multitouch.inputMode = MultitouchInputMode.TOUCH_POINT; } if(Capabilities.touchscreenType == TouchscreenType.STYLUS){ Multitouch.inputMode = MultitouchInputMode.GESTURE; }
  15. 15. var mySprite:Sprite = new Sprite(); var uiCon:UIComponent = new UIComponent(); addChild(uiCon); mySprite.graphics.beginFill(0x336699); mySprite.graphics.drawRect(50,50,100,100); uiCon.addChild(mySprite); mySprite.addEventListener(TouchEvent.TOUCH_BEGIN, onTouchBegin) mySprite.addEventListener(TouchEvent.TOUCH_MOVE, onTouchMove) mySprite.addEventListener(TouchEvent.TOUCH_END, onTouchEnd) } private function onTouchBegin( event :TouchEvent ) :void { event.target.startTouchDrag(event.touchPointID); event.target.scaleX *= 0.5 event.target.scaleY *= 0.5 }
  16. 16. // Function will trigger when function Move private function onTouchMove( event :TouchEvent ) :void { event.target.alpha = 0.5 } // Here the Touch End private function onTouchEnd( event :TouchEvent ) :void { event.target.stopTouchDrag(event.touchPointID); event.target.width = 240; event.target.height = 240; event.target.alpha = 1; }

×