Monday, 21 November 2011

Introduction to Multitouch Programming in WPF 4.0

Windows 7 and .NET 4.0 only

In version 4.0 of the .NET framework, Microsoft supports multitouch programming. The .NET API builds on the native Win32 API that is only available in Windows 7 and later versions. You can simulate multitouch on Windows Vista by using a special user input management layer that emulates multitouch on a normal PC.

What is availabel in Beta 1

The manipulation events are already available in Beta 1, but the WPF controls do not take use of them. In later versions you can just enable manipulation of sliders or scrollviewers on control level

How to handle multitouch input

Multitouch gestures like scaling, panning or rotating are already preprocessed by the underlying layer. You will receive the result in form of an Manipulation struct that contains a Expansion, Rotation, Scale and Translation. The information is provided in four maniuplation events:
  • ManipulationStarted
  • ManipulationDelta
  • ManipulationStarting
  • ManipulationCompleted
To enable receiving manipulation events you have to set the ManipulationMode to the manipulations you want to enable. If you want to receive all kind of manipulations, you can set the ManipulationMode="All".

How to create a simple WPF multitouch foto viewer

Create a new WPF 4.0 solution.
 
public class TouchImage : Image
{
    private MatrixTransform _matrixTransform;
 
    public TouchImage()
    {
        ManipulationMode = ManipulationModes.All;
        _matrixTransform = new MatrixTransform();
        RenderTransform = _matrixTransform;
    }
 
    protected override void OnManipulationDelta(ManipulationDeltaEventArgs e)
    {
        var manipulation = e.GetCumulativeManipulation((IInputElement)Parent);
 
        var delta = e.GetDeltaManipulation((IInputElement)Parent);
        Matrix matrix = _matrixTransform.Matrix;
 
        var originalCentre = new Point(ActualWidth / 2, ActualHeight / 2);
        matrix.Translate(delta.Translation.X, delta.Translation.Y);
        matrix.Transform(originalCentre);
 
        var centre = matrix.Transform(originalCentre);
        matrix.RotateAt(delta.Rotation, centre.X, centre.Y);
 
        centre = matrix.Transform(originalCentre);
        matrix.ScaleAt(delta.Scale, delta.Scale, centre.X, centre.Y);
 
        _matrixTransform.Matrix = matrix;
        e.Handled = true;
 
        base.OnManipulationDelta(e);
    }
}
 
 

No comments:

Post a Comment