Double Dutch Double Touch

Windows Phone From Scratch #49

In my previous posting, I demonstrated how to register a touch (or tap) on Windows DoubleTouch Phone. Today I will extend that to implement Double-Touch.

To begin, I need to go back to the original Touch class and make two changes: the OnTouch method needs to be changed to protected (from private) and needs to be marked virtual so that I can override it in a derived class.

To get started, re-open the Toucher project, and make these two changes in TouchAction.cs.  Next, create a new class, DoubleTouchAction, that derives from TouchAction:

using System;

namespace Toucher
{
   public class DoubleTouchAction : TouchAction

Give your new class its own event (DoubleTouch) and a private nullable-DateTime object to hold the time of the initial touch. We’ll compare that time with the time of the second touch, and if it is within a second we’ll consider that to be a double-touch.

public class DoubleTouchAction : TouchAction
{
   public event EventHandler DoubleTouch;
   const int INTERVAL = 1;

   private DateTime? TimeOfFirstTouch { get; set; }

The heart of this class is in the overridden OnTouch method which begins by calling the base method (to pick up the Touch) and then compares the time of the touch with the time of the first touch.  If there is no time (the DateTime has no value) or if the time between touches exceeds one second then the time of the first touch is reset to the current time, otherwise the event is called.

protected override void OnTouch( )
{
   base.OnTouch( );

   if ( TimeOfFirstTouch.HasValue &&
         DateTime.Now < TimeOfFirstTouch +
         TimeSpan.FromSeconds( INTERVAL ) )
   {
      OnDoubleTouch( );
      TimeOfFirstTouch = null;
   }
   else
   {
      TimeOfFirstTouch = DateTime.Now;
   }
}

The event just checks to make sure that someone has registered to receive the event and then calls the event on the AssociatedObject as you saw in the earlier version,

private void OnDoubleTouch( )
{
   if ( DoubleTouch != null )
   {
      DoubleTouch( AssociatedObject, EventArgs.Empty );
   }
}

 

You can now return to Blend to wire up the behavior, or if you like,, open MainPage.xaml and just copy the form of the behavior from the existing one:

 <Custom:Interaction.Behaviors>
    <local:TouchAction
       x:Name="TouchActionBehavior"
       Touch="TouchActionBehavior_Touch" />
    <local:DoubleTouchAction
       x:Name="DoubleTouchActionBehavior"
       DoubleTouch="DoubleTouchActionBehavior_DoubleTouch" />
 </Custom:Interaction.Behaviors>

 

You can now go to the code behind file and add a handler for the DoubleTouch,

private void TouchActionBehavior_Touch(
   object sender, System.EventArgs e )
{
   //System.Windows.MessageBox.Show(
   //   "You touched the panel!" );
}

private void DoubleTouchActionBehavior_DoubleTouch
   ( object sender, System.EventArgs e )
{
   System.Windows.MessageBox.Show(
      "You double-touched the panel!" );
}

 

While you need not comment out the message box on the first touch, you do have to be quick to register the second touch in under a second.  Commenting out the message box makes this easier.

Share

About Jesse Liberty

Jesse Liberty is an independent consultant and programmer with three decades of experience writing and delivering software projects. He is the author of 2 dozen books and multiple Pluralsight courses, and has been a Senior Technical Evangelist for Microsoft, a Distinguished Software Engineer for AT&T, a VP for Information Services for Citibank and a Software Architect for PBS. He is a Xamarin Certified Mobile Developer and a Xamarin MVP, Microsoft MVP and Telerik MVP.
This entry was posted in Mini-Tutorial, Patterns & Skills, WindowsPhone and tagged , . Bookmark the permalink.

Leave a Reply

Your email address will not be published.