1 / 24

Gestures and Responding to Interaction

Gestures and Responding to Interaction. Windows 8 Gestures, Gesture Types, Using Pointers and Manipulation events. George Georgiev. Telerik Corporation. www.telerik.com. Technical Trainer. itgeorge.net. Table of Contents. Gestures in Windows 8 Static Gestures Manipulations

macy
Download Presentation

Gestures and Responding to Interaction

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Gestures and Responding to Interaction Windows 8 Gestures, Gesture Types, Using Pointers and Manipulation events George Georgiev Telerik Corporation www.telerik.com Technical Trainer itgeorge.net

  2. Table of Contents • Gestures in Windows 8 • Static Gestures • Manipulations • Responding to Static Gestures • WinRT Pointers • Pointers overview • Handling Pointer events • WinRT Manipulation events

  3. Interactions in Windows 8 Tapping, Holding, Swiping, Sliding, Rotating, etc.

  4. Interactions in Windows 8 • Windows 8 is built around touch interactions • Defines a list of standard interactions • Direct input from the user, instead of controls • Three types of interaction events • Gesture events – static single touch interactions • Pointer events – single touch/pen/cursor • Manipulation events – multi-touch interactions

  5. Basic Windows 8 Interactions

  6. Interactions in Windows 8 • Some interactions are available only on some devices • E.g. you can't "pinch" with a mouse • App must provide alternative interaction methods for different input devices • Input devices • Finger(s) • Mouse • Pen/stylus

  7. Interactions in Windows 8 • Interactions/gestures should be fluid • UI respond with appropriate "energy" • Interactions provide visual feedback • Interaction animations "connect"

  8. Responding to Static Gestures Tap, Double-Tap, Tap and Hold

  9. Responding to Static Gestures • WinRT supports events for static gestures • Tapped • DoubleTapped • Holding • Most static gestures work with both mouse and touch input • Except Holding – works only on touch

  10. Responding to Static Gestures • Can attach event handlers in C# or directly on XAML controls: • Handlers receive event arguments • OriginalSource and PointerDeviceType <TextBlock Tapped="TextBlockTapped"> Tap me </TextBlock> <TextBlock DoubleTapped="TextBlockDoubleTapped"> Double-Tap me </TextBlock> <TextBlock Holding="extBlockHolding"> Hold me </TextBlock>

  11. Responding to Static Gestures Live Demo

  12. WinRT Pointers Device-independent input

  13. WinRT Pointers • Pointers - base of all user input interactions • Represent a single abstract device interaction • Common events for press, release, move, etc. • Abstract "contact" detection • Pointer interaction • A pointer represents a single interaction • Pointer created on start and destroyed on end • Multiple devices interact -> multiple pointers created

  14. WinRT Pointers • Pointers events • PointerMoved • PointerCanceled • PointerPressed • PointerReleased • PointerExited • PointerEntered • PointerCaptureLost • PointerWheelChanged • Event args provide • Current point • Intermediate points • All Static gesture event properties

  15. WinRT Pointers • Pointers enable low-level gesture processing • Access to each input device contact position • Can build custom gestures • Can customize reaction to existing gestures • All gesture processing up to developer

  16. Using WinRT Pointers Live Demo

  17. WinRT Manipulation Events High-level Device-abstract Interactions

  18. WinRT Manipulation Events • Manipulations • Continuous interactions • Take immediate effect on UI element • Single or Multi-touch • WinRT Manipulations – high-level manipulations detection • Provide various info on manipulation over an element – position, velocity, rotation, etc. • Fire events on interaction start, during interaction, end

  19. WinRT Manipulation Events • Manipulation speed and inertia • Users can interact fast or slow • UI should respond accordingly • WinRT Manipulation events support this • Detect interaction "velocity" • "inertia start" – pointer released while moving • Manipulation mode • Which interactions a UI element should detect • Default is "None"

  20. WinRT Manipulation Events • Events • ManipulationStarting • ManipulationStarted • ManipulationDelta • ManipulationCompleted • ManipulationInertiaStarting

  21. WinRT Manipulation Events Live Demo

  22. Gestures and Responding to Interactions http://academy.telerik.com

  23. Exercises • Implement PaintRT: • Description on the next slide…

  24. Exercises • A simplified version of Paint for Windows RT • Can draw lines, circles and squares • Colors are picked from the circle, by rotating it – the color on top (marked by the white strip) is the current color. Hint: place them in a Canvas element and rotate the canvas • The current figure is picked from the 3 options above by sliding them left or right. The figure above the white strip is the current figure • The picture is drawn on the canvas to the left (that red thing with blue eyes is a drawing made with PaintRT) • Tapping on the canvas should draw the current figure with the current color • Double-Tapping a figure on the canvas should change it's color, by cycling through the available ones (red, black, blue, green) • * Bonus (not obligatory) implement rotating, scaling and moving drawn figures

More Related