WPF环境下多点触屏开发的一些经验(转)

本系列将介绍Multi-Touch（MT）多点触控技术的相关内容，使开发人员了解如何在Windows 平台中开发出具有MT 功能的应用程序。众所周知Windows 7 操作系统自身已经支持具有MT 功能的硬件设备， 画板程序（Paint）就是一个很好的例子，如果你的显示设备具有MT 功能，便可以用两个手指同时在画板中绘制不同的图案。

     

作为开发者对MT 应用程序进行测试的时候，当然需要MT 硬件设备的支持，否则我们无法判断程序是否能够正常运行。虽然现在市面上的MT 设备已经很多，但价格也都不菲。如果没有多点触控设备能否进行MT 程序的开发与测试呢？  答案当然是可以的，下文将介绍如何通过多鼠标模拟多点触控功能。

下载Multi-Touch Vista

首先需要从CodePlex 下载Multi-Touch Vista，通过它可以模拟多点触控。Multi-Touch Vista 其实有很多功能，但本篇我们只将它作为多点触控模拟器使用。下面是引自Multi-Touch Vista 的项目描述：

Multi-Touch Vista is a user input management layer that handles input from various devices (touchlib, multiple mice, TUIO etc.) and normalises it against the scale and rotation of the target window. Now with multitouch driver for Windows 7.

安装驱动

将压缩包解压，进入Driver 目录，依操作系统选择32或64位，运行Install driver.cmd（也可以在CMD 运行该程序）。

系统会弹出以下提示，选择"Install this driver software anyway"继续安装。

设备管理

驱动安装完毕后，进入设备管理器，选择"Human Interface Devices"，右键"Universal Software HID device"，将其禁用（Disable）。

选择"Yes"，确定。

重新右键"Universal Software HID device"，将其再次启用（Enable）。

触屏设置

在“开始”菜单输入"pen and touch"，运行应用程序，如果上一步"Universal Software HID device"没有启动则无法运行该程序。

点击"Touch"标签，勾选下方"Touch pointer"选项，点击确定。

运行模拟器

首先为计算机再连接一个USB鼠标，用于模拟多点触控操作。回到解压目录，运行Multitouch.Service.Console.exe。

服务启动后，便可以看到下图所示的两个红点，分别代表两个鼠标输入设备。

接下来运行Multitouch.Driver.Console.exe

最后运行Multitouch.Configuration.WPF.exe

点击"Configure device"按键，勾选"Block native windows mouse input … …"，点击"OK"。

此后，Windows 鼠标就不再起作用了，取而代之的是屏幕上的那两个红点。

打开画板（Paint），此时可以用两个鼠标同时绘制各自的曲线。

至此，我们在没有MT 设备的条件下，通过模拟器实现了全部多点触控功能，就连Windows 7 也认为当前显示器具备多点触屏功能。通过该模拟器就可以正常测试MT 应用程序了，下一篇将开始介绍如何在WPF 开发多点触控应用程序。

作者：李敬然（Gnie）
出处：{GnieTech} （http://www.cnblogs.com/gnielee/）

WPF Multi-Touch 开发：基础触屏操作（Raw Touch）

多点触控（Multi-Touch）就是通过与触屏设备的接触达到人与应用程序交互的操作过程。例如，生活中经常使用的触屏手机、触屏笔记本、显示器以及微软最新的Surface 产品等这些都属于触屏操作设备。本篇将介绍如何开发能够支持MT 功能的应用程序。

在WPF 4 中已经具备的多点触控开发技术，当多个手指触碰到触屏设备时，WPF 会把每跟手指认为是一个触控设备，并为其分配唯一的识别ID，以便跟踪不同手指的操作手势。下面将通过实例演示WPF 所支持的低级别触控操作：触碰（TouchDown）、分离（TouchUp）、移动（TouchMove），它们都是一些最基础的操作模式。

创建项目

新建项目在XAML中写入如下代码，<Grid>中只添加了<Canvas> 控件，其中包含TouchDown、TouchUp、TouchMove 三个基础触控事件。当手指触碰程序时便会在Canvas 中生成彩色圆圈，圆圈的位置随手指的移动而改变，手指离开触屏的同时圆圈消失。接下来将逐一讲解每个事件所完成的任务。

<Window x:Class="WpfRawTouch.MainWindow"        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"        Title="MainWindow" Height="350" Width="525">    <Grid>        <Canvas x:Name="touchPad" Background="Gray"                TouchDown="touchPad_TouchDown" TouchUp="touchPad_TouchUp"                 TouchMove="touchPad_TouchMove">        </Canvas>    </Grid></Window>

TouchDown 事件主要是完成当触碰产生时在<Canvas> 控件中生成彩色圆圈的任务（C#代码如下）。使用Ellipse 创建随机颜色的圆圈，通过GetTouchPoint 方法获取触碰位置点，并调整圆圈在<Canvas> 中的位置。为了跟踪手指移动轨迹，需要将触屏设备ID 及UI 控件存储在集合movingEllipses 中。

private Dictionary<int, Ellipse> movingEllipses = new Dictionary<int, Ellipse>();Random rd = new Random();private void touchPad_TouchDown(object sender, TouchEventArgs e){    Ellipse ellipse = new Ellipse();    ellipse.Width = 30;    ellipse.Height = 30;    ellipse.Stroke = Brushes.White;    ellipse.Fill = new SolidColorBrush(        Color.FromRgb(            (byte)rd.Next(0, 255),            (byte)rd.Next(0, 255),            (byte)rd.Next(0, 255))            );    TouchPoint touchPoint = e.GetTouchPoint(touchPad);    Canvas.SetTop(ellipse, touchPoint.Bounds.Top);    Canvas.SetLeft(ellipse, touchPoint.Bounds.Left);    movingEllipses[e.TouchDevice.Id] = ellipse;    touchPad.Children.Add(ellipse);}

当手指离开触屏时TouchUp 事件将被触发，首先将触碰设备从movingEllipses 集合中删除不再跟踪手指相关操作，并从<Canvas> 中将彩色圆圈移除。

private void touchPad_TouchUp(object sender, TouchEventArgs e){    movingEllipses.Remove(e.TouchDevice.Id);    Ellipse ellipse = movingEllipses[e.TouchDevice.Id];    touchPad.Children.Remove(ellipse);}

当手指在触屏上持续移动时TouchMove 事件触发，它来跟踪手指移动轨迹，并重新调整圆圈在<Canvas> 中的位置。

private void touchPad_TouchMove(object sender, TouchEventArgs e){    Ellipse ellipse = movingEllipses[e.TouchDevice.Id];    TouchPoint touchPoint = e.GetTouchPoint(touchPad);    Canvas.SetTop(ellipse, touchPoint.Bounds.Top);    Canvas.SetLeft(ellipse, touchPoint.Bounds.Left);}

程序演示

至此，一个简单的触控应用程序就完成了编译并运行该程序，用手指触碰屏幕并持续移动看看是否会出现下面视频中的情况（如果没有多点触屏设备请参考这里解决）。

< width="480" height="400" src="http://player.youku.com/player.php/sid/XMTk4MTY0NjI4/v.swf">

源码下载

WpfRawTouch.zip

作者：李敬然（Gnie）
出处：{GnieTech} （http://www.cnblogs.com/gnielee/

[]