Multi-touch gesture interpretation and ToolKit.dll and Microsoft.Phone.dll conflict issues in Window Phone app

Source: Internet
Author: User
Tags in degrees

I recently wrote a windowphone application with the need for single touch and multi-touch control. such as click, double-click, swipe, two-finger swipe, etc., in this process encountered some problems, here to share my experience.

First of all the various methods of Windowphone touch are summarized and analyzed, and I am grateful to Mr. Charles Petzold for the interpretation of most of the questions here from Mr. Charles Petzold.

gesture Services and listeners

    • First you need to install Windows phone 7 developer tools, and, of course, the Silverlight for Windows Phone toolkit.

      After the toolkit is installed, you can use it in your own Windows Phone project by adding a reference to the Microsoft.Phone.Controls.Toolkit assembly. In the Add Reference dialog box, it is listed under the. NET tab.

      Then, in a XAML file, you need an XML namespace declaration such as the following (but all content is on one line):

           xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"    

      Here are 12 available gesture events, which I'll discuss in roughly order (the events that I grouped into the same row are relevant and occur in the same order):

           GestureBegin, GestureCompletedTapDoubleTapHoldDragStarted, DragDelta, DragCompletedFlickPinchStarted, PinchDelta, PinchCompleted    

      Suppose you want to handle the TAP and hold events that occur in a grid or any child grid. you can specify it in a XAML file, specifying the method as follows:

           <Grid ...     > <toolkit:GestureService.GestureListener>  <toolkit:GestureListener    Tap="OnGestureListenerTap"   Hold="OnGestureListenerHold" /> </toolkit:GestureService.GestureListener>  ...     </Grid>    

      You specify events and handlers in the Gesturelistener tag, which is a child of the Gesturelistener attached property of the Gestureservice class.

      In addition, in your code, you will need the namespace directives for the Microsoft.Phone.Controls namespace and the following code:

           GestureListener gestureListener =  GestureService.GetGestureListener(element);gestureListener.Tap += OnGestureListenerTap;gestureListener.Hold += OnGestureListenerHold;    

      In either case, if you want to set this gesture listener on the panel, make sure that you at least set the Background property to transparent! The event is implemented through a panel that has a default background of NULL.

      If you have done the above section you can have basic touch, the remaining 10 touch and the above two (Tap,hold) touch usage is basically consistent, I will explain the main points below. Tap and hold

      All gesture events are accompanied by event arguments of type Gestureeventargs or derived from Gestureeventargs. The OriginalSource property indicates the topmost element that touches the first finger of the screen, and the GetPosition method provides the current coordinates of this finger relative to any element.

      Gesture events can be routed, which means they can be passed in the visual tree and can be processed for any element that has Gesturelistener installed. as always, event handlers can set the Handled property of Gestureeventargs to True to prevent events from being further passed in the visual tree. However, this can only affect other elements that use these gesture events. setting Handled to True does not prevent the higher-level elements in the visual tree from getting touch input through other interfaces.

      The Gesturebegin event indicates that a finger has touched a screen that was not touched by the previous finger, and gesturecompleted signals when all the fingers have left the screen. These events can be convenient for initialization or cleanup, but you will typically pay more attention to gesture events that occur between the two events.

      I'm not going to spend too much time on more simple gestures. tap occurs when a finger touches the screen and then lifts within about 1.1 seconds, and the finger does not move far from the original position. if the time interval of two clicks is too short, then the second click is received as Doubletap. hold occurs when a finger is pressed on the screen and stays in approximately the same position for about 1.1 seconds. The hold event is generated at the end of this time and does not need to wait until the finger leaves the screen.

      Drag and Flick

      The Drag sequence (contains a dragstarted event, 0 or more DragDelta events, and a dragcompleted event) occurs when a finger touches the screen, moves on the screen, or leaves the screen. The dragstarted event is delayed until the finger actually starts to move outside the TAP threshold because it is not known that a drag occurs when the finger touches the screen for the first time. If you place your finger on the screen and do not move for approximately one second, the hold event may be performed before the dragstarted event.

      Because the finger has started to move when the dragstarted event is raised, the Dragstartedeventargs object can contain a Direction property of type Orientation (horizontal or vertical). the DragDeltaEventArgs object included with the DragDelta event contains more information: Horizontalchange Properties and Verticalchange properties (which can be easily added to TranslateTransform X Properties and Y properties), or Canvas.Left and canvas.top attached properties.

      The Flick event occurs when the finger leaves the screen while the finger is still moving, indicating that the user wants to perform the delay. The event arguments contain Angle values (measured clockwise from the positive X-axis), and horizontalvelocity and verticalvelocity values, both in pixels per second.

      Flick events can occur independently, can occur between dragstarted and dragcompleted events (no DragDelta events are required), or can occur before DragDelta events after a series of dragcompleted events. Typically, you need to handle the Drag event with the Flick event, almost as if Flick were a continuation of the Drag. However, you need to add your own delay logic.

      These operational procedures are demonstrated in the Dragandflick project. The screen contains an ellipse that lets users easily drag back and forth with their fingers. If you flick the screen away from the screen, the Flick event occurs, and the Flick handler saves some information and installs a handler for the Compositiontarget.rendering event. This event, which occurs with the video display refresh synchronization, keeps the ellipse moving, but it also slows down the movement.

      Handling the bounce off the edge is a bit special: The program keeps a position as if the ellipse is moving in one direction until it stops; The position is contained within the bouncing area of the ellipse.

      pinch two finger touch

      The Pinch sequence occurs when there are two fingers touching the screen, and it is often interpreted as extending or shrinking an object on the screen or rotating it.

      no doubt, Pinch fingers is one of the most elusive multi-touch processing areas, and it's not uncommon for higher-level interfaces to not provide sufficient information. It is well known that Windows Phone 7 Manipulationdelta events are particularly complex to use.

      when handling gestures, Drag sequence and The Pinch sequences are mutually exclusive. they don't overlap, but they can happen one by one. For example, touch the screen with one finger and drag the screen. now tap the screen with another finger. you will get a dragcompleted to end the Drag sequence, after which a pinchstarted event occurs and multiple Pinchdelta event. now keep the first finger moving on, but lift the second finger. This is a pinchcompleted for ending the Pinch sequence, and then dragstarted and DragDelta will occur. Depending on the number of fingers on the screen, you are essentially alternating between the Drag sequence and the Pinch sequence.

      A useful feature of this Pinch gesture is that it does not discard information. You can use the properties of the event arguments to completely reconstruct the position of the two fingers so that you can always go back to the basics when needed.

      In the Pinch sequence, the current position of a finger (let's call it the primary finger) is always available in the GetPosition method. in this discussion, we call this return value PT1. for the pinchstarted event, the Pinchstartedgestureeventargs class has two additional properties, named Distance and Angle, respectively, that indicate the position of the second finger relative to the first finger. you can easily calculate this actual location by using the following statement:

        1. Point pt2 = new Point (pt1. X + args. Distance * Cos (args. Angle),
        2. Pt1. Y + args. Distance * Sin (args. Angle));

      The Angle property is in degrees, so before calling Math.Cos and Math.sin, you need to convert it to radians using the Cos and Sin methods. before the pinchstarted handler finishes, you also want to save the Distance and Angle properties to fields whose names might be pinchstartdistance and pinchstartangle.

      The Pinchdelta event comes with a Pinchgestureeventargs object. Similarly, with the GetPosition method you can get the position of the primary finger, and the primary finger may have moved from its original position to another location. for the second finger, the event arguments provide the Distanceratio and Totalangledelta properties.

      Distanceratio is the ratio of the current distance to the original distance between the fingers, which means that you can calculate the current distance as follows:

        1. Double distance = args. Distanceratio * pinchstartdistance;

      Totalangledelta is the difference between the current angle and the original angle between the fingers. you can calculate the current angle as follows:

           double angle = args.TotalAngleDelta + pinchStartAngle;    

      Now you can calculate the position of the second finger in the previous way:

        1. Point pt2 = new Point (pt1. X + distance * Cos (angle),
        2. Pt1. Y + distance * Sin (angle));

      During Pinchdelta processing, you do not need to save any additional information to the field to further process the Pinchdelta event.

      The Twofingertracking project demonstrates this logic by displaying blue and green ellipses that track one or two fingers on the screen.

      This is done for touch, especially multi-fingered touch.

      Original reference https://msdn.microsoft.com/en-us/magazine/gg650664.aspx

      solutions for problems in the face of Longlistselector in both Toolkit.dll and Microsoft.Phone.dll

      If you really use it, you may find a problem, Longlistselector also exists in ToolKit.dll and Microsoft.Phone.dll, leading to conflict.

      What is this for? Is it stupid to write a. dll, the reason is that Longlistselector first existed in toolkit, and later by WP official incorporation, so there was a bloody conflict.

      As you might expect, the historical issues like this are likely to be addressed in the new version. There is a conflict problem in WP7, and this problem is solved in WP8, so installing WP8 is good.

      But the problem comes, the WP7 version of the toolkit exists. msi file Click to install directly, and WP8 there is no corresponding file, so the installation method is a bit cumbersome in this I only provide links on the above has a detailed introduction, is only English, test the English level.

      Installation link http://phone.codeplex.com/releases/view/107923

      This is the installation instructions to install the NuGet after installing the Windows Phone Toolkit package method is to open the VS's in the Assembly manager Console

      Enter Install-package Wptoolkit. Last install multilingual App Toolkit for Visual Studio This is an. msi file that you can double-click

Multi-touch gesture interpretation and ToolKit.dll and Microsoft.Phone.dll conflict issues in Window Phone app

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.