Windows Phone 7– Silverlight Gesture Support

Ok this is my last blog about Windows Phones 7 for a while, I have gone a bit of a WP7 splurge and this should be the conclusion. This week I was at a great Windows Phone 7 boot camp which included Silverlight  and XNA development. One of the key features that I missed, up until this boot camp, was the fact that all the XNA goodness is available to us humble Silverlight developers, with the notable exception of how graphics are pushed to the UI.

What interested me the most about this integration is the use and availability of Gesture Support within Silverlight. I have seen several projects that have their own quite frightening examples of how to catch some of the more common gestures. The permutations and combinations of these solutions were enough to keep me away from gesture support all together until we discovered that gesture support can be imported from the XNA name space (Microsoft.Xna.Framework.Input.Touch).

A fundamental difference between the XNA and the Silverlight approach is that XNA is based on a game loop, however, Silverlight relies upon an event driven model. So in order to support gesture detection in Silverlight we need to enable an event that tells us a gesture occurred. The following is an example of how a grid responds to a manipulation event in XAML:

Next during our page initialization we should subscribe to the gestures that we want our Silverlight app to respond to as follows.

TouchPanel.EnabledGestures = GestureType.Pinch | GestureType.Hold | GestureType.DoubleTap;

Finally we respond to the event we setup earlier, and detect which gesture actually occurred.

private void ContentPanel_ManipulationCompleted(object sender, ManipulationCompletedEventArgs e)
{
    while (TouchPanel.IsGestureAvailable)
    {
        GestureSample gesture = TouchPanel.ReadGesture();

        // Temporarily update page title to indicate type of gesture
        // and its properties (for the purpose of the demo).
        if (gesture.GestureType == GestureType.Pinch)
        {
            // Do something with pinch
        }
        else if(gesture.GestureType == GestureType.Hold)
        {
            //Do something with Hold
        }
        else if (gesture.GestureType == GestureType.DoubleTap)
        {
            //Do something with DoubleTap
        }
    }
}

As a side note you if you intend to update the UI at this point you will want to do this using BeginInvoke as I mentioned in a previous post.