本系列將介紹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 開發多點觸控應用程序。
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">源碼下載
出處: {GnieTech} (http://www.cnblogs.com/gnielee/
[]